我要评论我们今天不研究原理，只看应用。
什么是websocket
以上是百度百科的websocket定义。其实我们就可以理解websocket是一种全双工通讯协议，也就是服务端和客户端都可以发送、接收信息，对比http协议想一下就很容易理解：http协议是无状态的单向通讯协议，只能是客户端发送请求给服务端、服务端返回响应给客户端，之后连接就关闭了，服务端是不可以主动发送消息给客户端的。
应用场景
为什么需要websocket？
websocket是为了解决web应用场景下特定需求的，web应用使用的是http协议，服务端是没有办法主动发送消息给客户端的，但是某些场景下恰恰需要服务端主动发送消息给客户端，比如实时数据监控的场景：服务端定时（比如每分钟）获取到被监控设备的实时数据，前端页面实时展示监控值，当服务器端获取到新的数据的时候，要求前端页面相应的进行实时展示。
如果不采用websocket，一般会采用如下两种方式实现以上需求：
- 轮询：前端js定时轮询，发起查询请求，如果有新数据的话当然就可以获取到，但是即使没有新数据，前端也不会知道，只能机械式的不断轮询。
- 长轮询（long polling）：阻塞式轮询，拿不到数据就不返回一直等待，其实是一种更傻的轮询方式。
轮询方式是基于http协议实现的，主要缺点是开销大，因为每次轮询都需要发起http请求。
而websocket是该应用场景下以上两种轮询方式的理想替代方案，websocket仅在首次与服务器通讯的时候采用http协议，建立链接之后立即升级协议为websocket协议，建立长连接，之后的通讯都会工作在这个长连接下，所以，可以极大减少及时通讯业务场景下的连接开销。
springboot集成websocket
springboot对websocket做了无缝支持，使用起来也非常方便。
第一步：引入依赖。
<dependency>
<groupid>org.springframework.boot</groupid>
<artifactid>spring-boot-starter-websocket</artifactid>
</dependency>
第二步：使用serverendpoint注解创建websocket服务端：
package com.example.service;
import org.springframework.stereotype.component;
import javax.websocket.*;
import javax.websocket.server.serverendpoint;
import java.io.ioexception;
import java.util.hashmap;
import java.util.concurrent.copyonwritearrayset;
@serverendpoint(value = "/websocket")
@component
public class mywebsocket {
//静态变量，用来记录当前在线连接数。应该把它设计成线程安全的。
private static int onlinecount = 0;
//concurrent包的线程安全set，用来存放每个客户端对应的mywebsocket对象。
private static copyonwritearrayset<mywebsocket> websocketset = new copyonwritearrayset<mywebsocket>();
//与某个客户端的连接会话，需要通过它来给客户端发送数据
private session session;
//记录客户端特性：比如页面查询参数等等
private string params;
private hashmap<string,string> frontenddata = new hashmap<>();
/**
* 连接建立成功调用的方法*/
@onopen
public void onopen(session session) {
this.session = session;
websocketset.add(this); //加入set中
addonlinecount(); //在线数加1
system.out.println("有新连接加入！当前在线人数为" + getonlinecount());
try {
sendmessage(session.getid()+ ":connected...");
} catch (ioexception e) {
system.out.println("io异常");
}
}
/**
* 连接关闭调用的方法
*/
@onclose
public void onclose() {
websocketset.remove(this); //从set中删除
subonlinecount(); //在线数减1
system.out.println("有一连接关闭！当前在线人数为" + getonlinecount());
}
/**
* 收到客户端消息后调用的方法
*
* @param message 客户端发送过来的消息*/
@onmessage
public void onmessage(string message, session session) {
system.out.println("来自客户端的消息:" + message);
this.params = message;
try{
sendmessage(message);
}catch (exception e) {
e.printstacktrace();
}
}
/**
* 发生错误时调用
**/
@onerror
public void onerror(session session, throwable error) {
system.out.println("发生错误");
error.printstacktrace();
}
public void sendmessage(string message) throws ioexception {
this.session.getbasicremote().sendtext(message);
//this.session.getasyncremote().sendtext(message);
//群发消息
}
//给所有客户端发送消息
public void sendmessagetoall(string message,monitorservice monitorservice){
for (mywebsocket item : websocketset) {
try {
if(monitorservice.matchmessage(item.params,message))
item.sendmessage(message);
} catch (ioexception e) {
e.printstacktrace();
}
}
}
/**
* 群发自定义消息
* */
public static void sendinfo(string message) throws ioexception {
for (mywebsocket item : websocketset) {
try {
item.sendmessage(message);
} catch (ioexception e) {
continue;
}
}
}
public static synchronized int getonlinecount() {
return onlinecount;
}
public static synchronized void addonlinecount() {
mywebsocket.onlinecount++;
}
public static synchronized void subonlinecount() {
mywebsocket.onlinecount--;
}
}
第三部：创建一个monitorservice类，通过前台页面模拟设备数据提交给monitorservice，monitorservice接收到数据之后调用mywebsocket 的sendmessagetoall方法，将设备监控数据发送给前端进行展示：
package com.example.service;
import org.springframework.beans.factory.annotation.autowired;
import org.springframework.stereotype.service;
@service
public class monitorservice {
@autowired
private mywebsocket mywebsocket;
public void getmonitorvalue(string value){
sendvalue(value);
}
private void sendvalue(string value) {
try{
mywebsocket.sendmessagetoall(value,this);
}catch (exception e){
e.printstacktrace();
}
}
public boolean matchmessage(string params,string message){
//信息匹配
if(message.startswith(params)){
return true;
}
return false;
}
}
matchmessage方法做一个简单的业务场景的模拟：前端页面通过websocket发送一个订阅信息上来，表示当前页面订阅某一种类型的监测数据，matchmessage方法暂定一个特别简单的逻辑：以订阅信息打头的监测数据仅发送给该订阅客户端。比如客户端订阅“ttt”信息，则监测数据为tttabce123将发送给该客户端，其他非ttt打头的监测数据将不会发送给该客户端。
第四步：创建controller，调用monitorservice的getmonitorvalue方法，模拟设备监控数据的获取、并发送给订阅该数据的客户端。
package com.example.controller;
import com.example.service.monitorservice;
import com.example.service.testproperties;
import com.example.service.userservice;
import lombok.extern.slf4j.slf4j;
import org.springframework.beans.factory.annotation.autowired;
import org.springframework.scheduling.annotation.async;
import org.springframework.stereotype.controller;
import org.springframework.web.bind.annotation.*;
@restcontroller
@requestmapping("/hello")
@slf4j
public class helloworldcontroller {
@autowired
private monitorservice monitorservice;
@getmapping ("/sendmessage/{msg}")
public string sendmessage(@pathvariable string msg){
monitorservice.getmonitorvalue(msg);
return "hello";
}
第五步：客户端代码，写入websocket.htm文件中：
<!doctype html>
<html>
<head>
<title>my websocket</title>
</head>
<body>
welcome<br/>
<input id="text" type="text" /><button onclick="send()">send</button> <button onclick="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:8003/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>
运行测试
启动springboot项目，使用浏览器打开websocket.htm，文本框中输入ttt，表示订阅以ttt开头的实时监测数据，点击send按钮，页面回显ttt，表示客户端与服务端通过websocket成功发送、接收了信息：
浏览器再打开两个websocket.htm页面，分别发送ccc，aaa：
浏览器访问我们编写的模拟发送监测数据的服务，发送ttt12323，页面收到返回信息hello，表示发送成功：
查看已经打开的websocket.htm页面，发现订阅ttt服务的页面收到了服务器端通过websocket协议推送的信息：
另外两个页面没有收到信息，按照我们的设计，另外两个页面分别定制的是ccc以及aaa信息所以不会收到ttt信息。因此我们分别再次发送ccc及aaa信息：
检查websocket.htm页面：
ccc以及aaa客户端分别接收到了对应的信息，测试成功！
总结
在springboot项目中使用websocket其实非常简单：
- 引入依赖。
- 通过@serverendpoint注解编写webscoket服务端。
- 前端页面通过js代码编写websocket客户端。
以上三步，一个简单的websocket应用就可以正常工作了。
ok，many thanks！
发表评论