创建一个简单的Web项目,后端代码
import javax.websocket.*;
import javax.websocket.server.ServerEndpoint;
import java.io.IOException;
import java.util.Set;
import java.util.concurrent.CopyOnWriteArraySet;
@ServerEndpoint("/test")
public class SendMessageWebSocket {
private Session session;
private static final Set<SendMessageWebSocket> connections = new CopyOnWriteArraySet<>();
static {
new Thread(() -> {
while (true) {
for (SendMessageWebSocket connection : connections) {
try {
connection.session.getBasicRemote().sendText("你好,客户端!");
Thread.sleep(10000L);
// int i = 1 / 0;
} catch (Exception e) {
System.out.println("出现异常");
connections.remove(connection);
try {
connection.session.close();
} catch (IOException ioException) {
ioException.printStackTrace();
}
}
}
}
}).start();
}
@OnOpen
public void onOpen(Session session, EndpointConfig config) {
this.session = session;
connections.add(this);
System.out.println("编号[" + session.getId() + "]" + "已连接");
}
@OnClose
public void onClose(Session session, CloseReason closeReason) {
connections.remove(this);
System.out.println("编号[" + session.getId() + "]" + "已关闭");
}
@OnError
public void onError(Session session, Throwable throwable) {
System.out.println("onError" + throwable.getMessage());
}
@OnMessage
public void echoTextMessage(Session session, String msg, boolean last) {
System.out.println("收到消息:" + msg);
}
}
前端代码
<%@ page contentType="text/html;charset=UTF-8" %>
<html>
<head>
<title>WebSocket推送消息</title>
</head>
<body>
<input id="message" type="text" value="编辑消息"><br>
<button onclick="sendMsg()">发送</button>
<script>
var ws = null;
var target = "ws://127.0.0.1:8080/websocket/test";
function connect() {
ws = new WebSocket(target);
ws.onopen = function () {
console.log("已连接至服务器");
};
ws.onmessage = function (event) {
console.log("收到服务器消息:" + event.data)
};
ws.onclose = function () {
console.log("服务器连接已断开");
connect();//断开继续连接
};
ws.onerror = function (event) {
alert("onerror:" + event);
};
}
function sendMsg() {
ws.send(document.getElementById('message').value);
}
window.onload = function () {
connect();
}
</script>
</body>
</html>