1.java后端的maven添加websocket依赖
<!-- websocket依赖-->
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-websocket</artifactId>
</dependency>
2.实例化ServerEndpointExporter对象,
这样才能自动调用@ServerEndpoint(“/test”)里面的方法
@Configuration
public class WebSocketConfig {
@Bean
public ServerEndpointExporter serverEndpointExporter(){
return new ServerEndpointExporter();
}
}
3.创建一个类,该类的功能是提供websocket服务
/**
* websocket服务
*/
@Component
@ServerEndpoint("/test")
public class WebsocketServer{
@OnOpen
public void onOpen(Session session, EndpointConfig endpointConfig) {
System.out.println("websocket已连接");
}
@OnClose
public void onClose(Session session, CloseReason closeReason) {
System.out.println("websocket已关闭");
}
@OnError
public void onError(Session session, Throwable throwable) {
System.out.println("连接错误"+throwable);
}
//发送
@OnMessage
public void onMessage(String message,Session session){
System.out.println("接收到消息:" + message);
try {
session.getBasicRemote().sendText("回应: " + message);
} catch (Exception e) {
e.printStackTrace();
}
}
}
前端测试发起请求连接websocket
创建了一个html,控制台输出结果
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<script>
var ws=new WebSocket("ws://localhost:8080/test");
ws.onopen=function(){
console.log("连接成功");
ws.send('6666');
}
ws.onclose=function(){
console.log("连接关闭");
}
ws.onmessage=function(res){
console.log(res);
}
ws.onerror=function(res){
console.log(res);
}
</script>
</body>
</html>
结果: