服务器实时通知客户端方案，服务器发送/推送事件方案（1）websocket

最新推荐文章于 2024-06-19 15:28:40 发布

置顶淘气的高老板

最新推荐文章于 2024-06-19 15:28:40 发布

阅读量4.6k

点赞数

分类专栏： spring-boot 网络编程 websocket 文章标签： websocket

本文链接：https://blog.csdn.net/kkgbn/article/details/51887018

版权

spring-boot 同时被 3 个专栏收录

31 篇文章 0 订阅

订阅专栏

网络编程

23 篇文章 1 订阅

订阅专栏

websocket

2 篇文章 0 订阅

订阅专栏

服务端

@Configuration
public class WebSocketConfig {
	@Bean
	public ServerEndpointExporter serverEndpointExporter(){
		return new ServerEndpointExporter();
	}
}

@ServerEndpoint("/websocket")
@Component
public class WebSocketTest {

	private static int onlineCount = 0;

	private static CopyOnWriteArraySet<WebSocketTest> webSocketSet = new CopyOnWriteArraySet<>();

	private Session session;

	@OnOpen
	public void onOpen(Session session) {
		this.session = session;
		webSocketSet.add(this);
		addOnlineCount();
		System.out.println("有新链接加入!当前在线人数为" + getOnlineCount());
	}

	@OnClose
	public void onClose() {
		webSocketSet.remove(this);
		subOnlineCount();
		System.out.println("有一链接关闭!当前在线人数为" + getOnlineCount());
	}

	@OnMessage
	public void onMessage(String message, Session session) throws IOException {
		System.out.println("来自客户端的消息:" + message);
		// 群发消息
		for (WebSocketTest item : webSocketSet) {
			item.sendMessage(message);
			item.sendMessage(message);
			item.sendMessage(message);
		}
	}

	public void sendMessage(String message) throws IOException {
		this.session.getBasicRemote().sendText(message);
	}

	public static synchronized int getOnlineCount() {
		return WebSocketTest.onlineCount;
	}

	public static synchronized void addOnlineCount() {
		WebSocketTest.onlineCount++;
	}

	public static synchronized void subOnlineCount() {
		WebSocketTest.onlineCount--;
	}

}

客户端

<!DOCTYPE HTML>
<html>
<head>
<base href="localhost://localhost:8080/">
<title>My WebSocket</title>
</head>

<body>
	Welcome
	<br />
	<input id="text" type="text" />
	<button οnclick="send()">Send</button>
	<button οnclick="closeWebSocket()">Close</button>
	<div id="message"></div>
</body>

<script type="text/javascript">
	var websocket = null;

	//判断当前浏览器是否支持WebSocket  
	if ('WebSocket' in window) {
		websocket = new WebSocket("ws://localhost:8084/websocket");
	} else {
		alert('Not support websocket')
	}

	//连接发生错误的回调方法  
	websocket.onerror = function() {
		setMessageInnerHTML("error");
	};

	//连接成功建立的回调方法  
	websocket.onopen = function(event) {
		setMessageInnerHTML("open");
	}

	//接收到消息的回调方法  
	websocket.onmessage = function(event) {
		setMessageInnerHTML(event.data);
	}

	//连接关闭的回调方法  
	websocket.onclose = function() {
		setMessageInnerHTML("close");
	}

	//监听窗口关闭事件，当窗口关闭时，主动去关闭websocket连接，防止连接还没断开就关闭窗口，server端会抛异常。  
	window.onbeforeunload = function() {
		websocket.close();
	}

	//将消息显示在网页上  
	function setMessageInnerHTML(innerHTML) {
		document.getElementById('message').innerHTML += innerHTML + '<br/>';
	}

	//关闭连接  
	function closeWebSocket() {
		websocket.close();
	}

	//发送消息  
	function send() {
		var message = document.getElementById('text').value;
		websocket.send(message);
	}
</script>
</html>

淘气的高老板

关注

0
点赞
踩
10

收藏

觉得还不错? 一键收藏
2
评论
服务器实时通知客户端方案，服务器发送/推送事件方案（1）websocket

My WebSocket Welcome Send Close var websocket = null; //判断当前浏览器是否支持WebSocket if ('WebSocket' in window) { websocket = new WebSocket("ws://localhost:8084/websocket"); } else {
复制链接

扫一扫

专栏目录