做黑龙头像的网站,c2c网站管理系统,扬中新闻回放视频,html5网站开发实例目录
WebSocket简介WebSocket原理WebSocket的使用场景在Spring Boot中集成WebSocket 创建Spring Boot项目添加依赖配置WebSocket创建WebSocket处理器配置WebSocket端点前端使用WebSocket添加WebSocket拦截器
WebSocket简介
WebSocket是一种在单个TCP连接上进行全双工通信的…目录
WebSocket简介WebSocket原理WebSocket的使用场景在Spring Boot中集成WebSocket 创建Spring Boot项目添加依赖配置WebSocket创建WebSocket处理器配置WebSocket端点前端使用WebSocket添加WebSocket拦截器
WebSocket简介
WebSocket是一种在单个TCP连接上进行全双工通信的协议。WebSocket使客户端和服务器之间的数据交换变得更加简单和快速适用于需要实时更新的应用场景。
WebSocket原理
WebSocket协议建立在HTTP协议之上但它不是HTTP协议的延续而是HTTP协议升级的一种。客户端通过发送一个HTTP请求来发起WebSocket连接这个请求包含一个特殊的Upgrade头表示请求协议从HTTP升级到WebSocket。服务器在接收到这个请求后如果支持WebSocket协议则返回一个101状态码表示切换协议随后双方就可以通过这个TCP连接进行双向通信。
WebSocket的使用场景
WebSocket非常适合以下应用场景
实时聊天应用例如即时通讯工具。在线游戏需要低延迟、高频率的数据交换。实时数据推送例如股票行情、体育赛事直播。协同编辑工具例如多人在线文档编辑。
在Spring Boot中集成WebSocket
创建Spring Boot项目
首先使用Spring Initializr或IDE如IntelliJ IDEA创建一个新的Spring Boot项目选择合适的Spring Boot版本如2.7.x或3.x并添加以下依赖
Spring WebWebSocket
添加依赖
在pom.xml中添加WebSocket的依赖
dependenciesdependencygroupIdorg.springframework.boot/groupIdartifactIdspring-boot-starter-websocket/artifactId/dependency!-- 其他依赖 --
/dependencies配置WebSocket
创建一个配置类来启用WebSocket支持并配置WebSocket端点和处理器。
import org.springframework.context.annotation.Configuration;
import org.springframework.web.socket.config.annotation.EnableWebSocket;
import org.springframework.web.socket.config.annotation.WebSocketConfigurer;
import org.springframework.web.socket.config.annotation.WebSocketHandlerRegistry;Configuration
EnableWebSocket
public class WebSocketConfig implements WebSocketConfigurer {Overridepublic void registerWebSocketHandlers(WebSocketHandlerRegistry registry) {registry.addHandler(new MyWebSocketHandler(), /ws).setAllowedOrigins(*) // 允许跨域.addInterceptors(new MyWebSocketInterceptor()); // 添加拦截器}
}创建WebSocket处理器
创建一个处理WebSocket消息的处理器类
import org.springframework.web.socket.TextMessage;
import org.springframework.web.socket.WebSocketSession;
import org.springframework.web.socket.handler.TextWebSocketHandler;public class MyWebSocketHandler extends TextWebSocketHandler {Overridepublic void handleTextMessage(WebSocketSession session, TextMessage message) throws Exception {String payload message.getPayload();// 处理接收到的消息System.out.println(Received: payload);session.sendMessage(new TextMessage(Echo: payload));}Overridepublic void afterConnectionEstablished(WebSocketSession session) throws Exception {// 连接成功后的逻辑处理System.out.println(Connected: session.getId());}
}添加WebSocket拦截器
为了在WebSocket连接建立之前和断开之后进行一些预处理和后处理可以添加WebSocket拦截器。
创建一个WebSocket拦截器类
import org.springframework.web.socket.WebSocketHandler;
import org.springframework.web.socket.server.HandshakeInterceptor;import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import java.util.Map;public class MyWebSocketInterceptor implements HandshakeInterceptor {Overridepublic boolean beforeHandshake(HttpServletRequest request, HttpServletResponse response, WebSocketHandler wsHandler, MapString, Object attributes) throws Exception {// 在握手之前的逻辑处理System.out.println(Before Handshake);// 可以通过请求参数进行身份验证等return true; // 返回true表示继续握手返回false表示终止握手}Overridepublic void afterHandshake(HttpServletRequest request, HttpServletResponse response, WebSocketHandler wsHandler, Exception exception) {// 在握手之后的逻辑处理System.out.println(After Handshake);}
}配置WebSocket端点
在WebSocketConfig中配置WebSocket端点如上所示已经在registerWebSocketHandlers方法中注册了WebSocket处理器和端点。
前端使用WebSocket
在前端使用JavaScript来连接和通信
!DOCTYPE html
html langen
headmeta charsetUTF-8titleWebSocket Demo/title
/head
bodyh1WebSocket Demo/h1button onclickconnect()Connect/buttonbutton onclicksendMessage()Send Message/buttonscriptlet socket;function connect() {socket new WebSocket(ws://localhost:8080/ws);socket.onopen function(event) {console.log(Connected to WebSocket server.);};socket.onmessage function(event) {console.log(Received: event.data);};socket.onclose function(event) {console.log(Disconnected from WebSocket server.);};socket.onerror function(error) {console.log(WebSocket error: error);};}function sendMessage() {if (socket) {socket.send(Hello, WebSocket!);}}/script
/body
/html至此与websocket的集成结束。
