spring boot + webSocket 实现简单会话与在线人数统计的demo
webSocket推送是常用于生产项目的模块，在我们部门做的一个汇报演示的demo中遇到了webSocket的一些问题。
自己下来看看了看webSocket的东西，结合spring boot 做了一个简单的demo;
介绍的部分大家可以参考众多的帖子，度娘
http://www.cnblogs.com/wei2yi/archive/2011/03/23/1992830.html
http://my.oschina.net/ldl123292/blog/304360
好的，现在贴一下我的代码 注释写的很细，也很简单，一下就能看懂。
java:
package com.haungteng.springboot.controller.websocket;
import org.springframework.stereotype.Component;
import javax.websocket.OnClose;
import javax.websocket.OnMessage;
import javax.websocket.OnOpen;
import javax.websocket.Session;
import javax.websocket.server.ServerEndpoint;
import java.io.IOException;
import java.util.concurrent.CopyOnWriteArraySet;
/**
* @author ht
* @describle 统计在线人数的demo
*/
@Component
@ServerEndpoint("/websocket") //该注解表示该类被声明为一个webSocket终端
public class MySocket {
//初始在线人数
private static int online_num = 0;
//线程安全的socket集合
private static CopyOnWriteArraySet<MySocket> webSocketSet = new CopyOnWriteArraySet<MySocket>();
//会话
private Session session;
@OnOpen
public void onOpen(Session session){
this.session = session;
webSocketSet.add(this);
addOnlineCount();
System.out.println("有链接加入，当前人数为:"+getOnline_num());
}
@OnClose
public void onClose(){
webSocketSet.remove(this);
subOnlineCount();
System.out.println("有链接关闭,当前人数为:"+getOnline_num());
}
@OnMessage
public void onMessage(String message,Session session) throws IOException{
System.out.println("来自客户端的消息:"+message);
for(MySocket item:webSocketSet){
this.session.getAsyncRemote().sendText("hello");
}
}
public synchronized int getOnline_num(){
return MySocket.online_num;
}
public synchronized int subOnlineCount(){
return MySocket.online_num--;
}
public synchronized int addOnlineCount(){
return MySocket.online_num++;
}
}
html:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>My WebSocket</title>
</head>
<body>
<h2 onclick="openTanTan()" style="color:dodgerblue;text-align: center">WeTanTan</h2>
<div id="tantanbox" style="width:800px;height:498px;margin:0 auto;">
<div id="box-left" style="float:left;width:600px;height:500px;">
<div id="content" style="height:350px;border:1px solid dodgerblue;"></div>
<div id="input-content" style="height:145px;border:1px solid dodgerblue;"><textarea id="input-message" style="width:99%;height:96%"></textarea></div>
<button id="btn1" onclick="sendMessage()" style="width:38px;height:18px;line-height:18px;border:0;margin:4px 0 0 10px;">send</button>
<button id="btn2" onclick="ClosedWebSocket()" style="width:38px;height:18px;line-height:18px;border:0;margin:4px 0 0 10px;">close</button>
</div>
<div id="box-right" style="float:left;width:195px;height:497px;border:1px solid dodgerblue">
<span style="font-size:10px;color:dodgerblue;font-weight:bold;">在线人数:</span>
<hr/>
<div id="count-users" style="font-size:10px;color:dodgerblue;font-weight:bold"></div>
</div>
</div>
</body>
<script>
var usernames=[];
var username="";
window.onload = function(){
document.getElementById("tantanbox").style.display="none";
};
function openTanTan(){
alert("open your WeTanTan chat!");
username = window.prompt("输入你的名字:");
//document.write("welcome to wetantan!<p id="username">"+username+"</p>");
usernames.push(username);
document.getElementById("tantanbox").style.display="block";
/*--------------------开始websocket部分----------- ---------*/
var ws = null;//申请一个websocket对象
//判断当前浏览器是不是支持websocket
if("window" in window){
startWebSocket();
}else{
alert("NO SUPPORT!");
return;
}
};
function startWebSocket() {
ws = new WebSocket("ws://localhost:8080/websocket");
document.getElementById("count-users").innerHTML="";
ws.onclose = function () {
sendInnerHtml("<span style="font-size: 20px;color:greenyellow;font-weight: bold">"+"Bye~~"+"</span>");
};
ws.onerror = function () {
sendInnerHtml("websocket error");
};
ws.onopen = function (event) {
sendInnerHtml("Welcome to WeTanTan Light social web! "+"<span style="font-size: 30px;font-weight: bold;color:orange">"+username+"</span>");
};
ws.onmessage = function (e) {
console.log(e)
document.getElementById("count-users").innerHTML=e.data+"人";
sendInnerHtml("<br/>"+"服务器"+":"+e.data);
};
//监听方法，监听websocket关闭
window.onbeforeunload = function(){
ws.close();
};
}
function sendInnerHtml(innerHtml){
document.getElementById("content").innerHTML+=innerHtml+"<br/>";
};
function ClosedWebSocket(){
ws.close();
setTimeout(function(){
document.getElementById("tantanbox").style.display="none";
},1000);
};
function sendMessage() {
var message = document.getElementById("input-message").value;
ws.send(message);
document.getElementById("content").innerHTML="<br/>"+username+":"+message;
document.getElementById("input-message").value="";
};
</script>
</html>
声明：该文观点仅代表作者本人，牛骨文系教育信息发布平台，牛骨文仅提供信息存储空间服务。
- 上一篇： 网站在线人数以及历史访问人数的统计代码
- 下一篇： Java监听器学习 统计当前在线人数
