若依集成 WebSocket，linux 学习步骤
/*
客户端创建连接时触发
*/
@OnOpen
public void onOpen(Session session, @PathParam("sid") String sid) {
this.session = session;
webSocketSet.add(this); // 加入 set 中
addOnlineCount(); // 在线数加 1
log.info("有新窗口开始监听:" + sid + ", 当前在线人数为" + getOnlineCount());
this.sid = sid;
try {
sendMessage("连接成功");
} catch (IOException e) {
log.error("websocket IO 异常");
}
}
/**
客户端连接关闭时触发
**/
@OnClose
public void onClose() {
webSocketSet.remove(this); // 从 set 中删除
subOnlineCount(); // 在线数减 1
log.info("有一连接关闭！当前在线人数为" + getOnlineCount());
}
/**
接收到客户端消息时触发
*/
@OnMessage
public void onMessage(String message, Session session) {
log.info("收到来自窗口" + sid + "的信息:" + message);
// 群发消息
for (WebSocketServer item : webSocketSet) {
try {
item.sendMessage(message);
} catch (IOException e) {
e.printStackTrace();
}
}
}
/**
连接发生异常时候触发
*/
@OnError
public void onError(Session session, Throwable error) {
log.error("发生错误");
error.printStackTrace();
}
/**
实现服务器主动推送(向浏览器发消息)
*/
public void sendMessage(String message) throws IOException {
log.info("服务器消息推送："+message);
this.session.getBasicRemote().sendText(message);
}
/**
发送消息到所有客户端
指定 sid 则向指定客户端发消息
不指定 sid 则向所有客户端发送消息
*/
public static void sendInfo(String message, @PathParam("sid") String sid) throws IOException {
log.info("推送消息到窗口" + sid + "，推送内容:" + message);
for (WebSocketServer item : webSocketSet) {
try {
// 这里可以设定只推送给这个 sid 的，为 null 则全部推送
if (sid == null) {
item.sendMessage(message);
} else if (item.sid.equals(sid)) {
item.sendMessage(message);
}
} catch (IOException e) {
continue;
}
}
}
public static synchronized int getOnlineCount() {
return onlineCount;
}
public static synchronized void addOnlineCount() {
WebSocketServer.onlineCount++;
}
public static synchronized void subOnlineCount() {
WebSocketServer.onlineCount--;
}
public static CopyOnWriteArraySet<WebSocketServer> getWebSocketSet() {
return webSocketSet;
}
}
[](
)创建 controller，用于模拟服务端消息发送
============================================================================================
package com.lrjas.web.wms.controller;
import com.lrjas.common.core.controller.BaseController;
import com.lrjas.framework.ws.WebSocketServer;
import org.apache.shiro.authz.annotation.RequiresPermissions;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.PathVariable;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.ResponseBody;
import java.io.IOException;
import java.util.HashMap;
import java.util.Map;
@Controller
@RequestMapping("/wms/websocket")
public class WebSocketController extends BaseController
{
private String prefix = "wms/websocket";
@RequiresPermissions("wms:websocket:view")
@GetMapping()
public String socket() {
return prefix + "/websocket"; // 页面的访问路径
}
@RequiresPermissions("wms:websocket:edit")
//推送数据接口
@ResponseBody
@RequestMapping("/push/{cid}")
public Map<String, Object> pushToWeb(@PathVariable String cid, String message) {
if (message == null) {
message = "我是消息!!!";
}
Map<String, Object> result = new HashMap<>();
try {
WebSocketServer.sendInfo(message, cid);
result.put("code", 200);
result.put("msg", "success");
} catch (IOException e) {
e.printStackTrace();
}
return result;
}
}
[](
)添加 websocket.html
====================================================================================
HTML5 提供了对 websocket 的支持，并且提供了相关 api, 可以直接使用：
1.WebSocket 创建
// url 就是服务端的 websocket 端点路径， protocol 是可选的，指定了可接受的子协议
var Socket = new WebSocket(url, [protocol] );
2.WebSocket 事件
| 事件 | 事件处理程序 | 描述 |
| --- | --- | --- |
| open | Socket.onopen | 连接建立时触发 |
| message | Socket.onmessage | 客户端接收服务端数据时触发 |
| error | Socket.onerror | 通信发生错误时触发 |
| close | Socket.onclose | 连接关闭时触发 |
3.WebSocket 方法
| 方法 | 描述 |
| --- | --- |
| Socket.send() | 使用连接发送数据 |
| Socket.close() | 关闭连接 |
路径由控制器中代码决定：resources/templates/wms/websocket/websocket.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>websocket 测试</title>
<script src="http://code.jquery.com/jquery-2.1.
1.min.js"></script>
</head>
<body>
<button onclick="onSendButtonClick()">发送</button>
<button onclick="onJhButtonClick()">交互</button>
<div id="content"></div>
</body>
<script type="text/javascript"> var ws;
// 检测浏览器是否支持 webSocket
if (typeof(WebSocket) == "undefined") {
$("#content").html("您的浏览器不支持 webSocket！");
console.log("您的浏览器不支持 WebSocket!");
} else {
$("#content").html("您的浏览器支持 webSocket!");
console.log("您的浏览器支持 WebSocket!");
//模拟产生 clientID
let clientID = Math.ceil(Math.random()*100);
// 创建 WebSocket 对象, 注意请求路径！！！！
ws = new WebSocket("ws://localhost:6300/WebSocketServer/1");
还未添加个人签名 2021.03.18 加入
还未添加个人简介
评论