如何使用监听器实现前端实时显示在线人数和在线用户名

1.每当用户登录到网站时，会创建一个session，session存储着用户信息，因此，我们需要设置一个session相关的监听器，在编译器中创建一个listener.
在这里插入图片描述

选中changes to attribute框，然后Finish，会看到自定义的监听器中将接口中的方法都列出来，需要我们重写。

package com.listener;

import java.util.ArrayList;
import java.util.List;

import javax.servlet.annotation.WebListener;
import javax.servlet.http.HttpSessionAttributeListener;
import javax.servlet.http.HttpSessionBindingEvent;

import com.model.User;

@WebListener
public class mySessionAttuibuteListener implements HttpSessionAttributeListener {
	public static	List<User> onlineUser=new ArrayList<>();
	public void attributeAdded(HttpSessionBindingEvent arg0) {
		String name=arg0.getName();
		Object obj=arg0.getValue();
		if("user".equals(name)) {
			User user=(User) obj;
			onlineUser.add(user);
		}
	}
	public void attributeRemoved(HttpSessionBindingEvent arg0) {
		String name=arg0.getName();
		Object obj=arg0.getValue();
		if("user".equals(name)) {
			User user=(User) obj;
			onlineUser.remove(user);
		}
	}
	public void attributeReplaced(HttpSessionBindingEvent arg0) {

	}
}

上面代码的attributeAdded和attributeRemoved方法，在session对象的属性改变时触发。同时我们将list集合的访问控制符设置为public，同时设置为static，方便访问。

@WebServlet("/LoginServlet")
public class LoginServlet extends HttpServlet {
	private static final long serialVersionUID = 1L;

	protected void doGet(HttpServletRequest request, HttpServletResponse response)
			throws ServletException, IOException {
		request.setCharacterEncoding("utf-8");
		response.setCharacterEncoding("utf-8");
		String username = request.getParameter("username");
		String password = request.getParameter("password");
		System.out.println(username + " " + password);
		DBUtil db = new DBUtil();
		String sql = "select count(*) c from user where username=? and password=?";
		List<Object> param = new ArrayList<Object>();
		param.add(username);
		param.add(password);
		
		int row = 0;
		try {
			ResultSet rs = db.executeQuery(sql, param);
			if (rs != null && rs.next()) {
				row = rs.getInt("c");
			}
		} catch (SQLException e) {
			e.printStackTrace();
		} finally {
			db.close();
		}
		System.out.println("row=" + row);
		if (row == 1) {
		
1			User user=new User();
2			user.setUsername(username);
3			user.setPassword(password);
4			HttpSession session=request.getSession();
5			session.setAttribute("user",user);
6			response.sendRedirect("index.jsp");
			
		} else {
			System.out.println("登录失败");
		}

	}

	protected void doPost(HttpServletRequest request, HttpServletResponse response)
			throws ServletException, IOException {
		doGet(request, response);
	}

}

上面代码中的1到6行，可以看到，当servlet对用户的信息查询到后，会封装到user对象中，同时第五行，使用session.setAttribute(“user”,user);将对象放置到session域中。此时session域中值改变，触发监听器中attributeAdded（）方法。
在我们的显示页面，需要实时的显示出访问的用户名和用户人数
index.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %>

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<script type="text/javascript" src="js/jquery-3.3.1.min.js"></script>
 <script>
//开启定时器，每秒刷新一下showOnline（）方法，该方法中向servlet发送请求，servlet又从监听器中取值，因此，类似于动态的每秒获取值，从而实现了实时的在线人数和用户名
 setInterval("showOnline()",1000);
 function showOnline(){
	$.ajax({
		url:"GetOnlineServlet",
		tyep:"get",
		success:function(result){
			//alert(result);
			var users=JSON.parse(result);//从servlet中返回的是JSONArray类型，所以需要转换为js数组处理
			var $online=$("#online");
			var online="<span>当前在线人(共"+users.length+"人)</span><br>";
			
			for(var i=0;i<users.length;i++){
				online+=users[i].username;
				online+="<br>"
			}
			$online.html(online);
		}
	});
 }
 </script>

</head>
<body>
	<div id="online">
	</div>
	<br> 
	<a href="logout.jsp">注销</a>
</body>
</html>

GetOnlineServlet.java
@WebServlet("/GetOnlineServlet")
public class GetOnlineServlet extends HttpServlet {
private static final long serialVersionUID = 1L;

protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
	response.setCharacterEncoding("utf-8");
	List<User> user=mySessionAttuibuteListener.onlineUser;
	JSONArray js=JSONArray.fromObject(user);
	response.getWriter().write(js.toString());
}
protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
	doGet(request, response);
}

}

注销页面：
logout.jsp

<body>
	<%
1  	session.removeAttribute("user");
2		session.invalidate();
3		response.sendRedirect("login.jsp");
	%>
</body>

第一行，注销首先将自身的信息从域中remove掉，接着调用invalidate方法使session失效，最后重定向到登录页面。

以上。

如何使用监听器实现前端实时显示在线人数和在线用户名

猜你喜欢