websocket:实现自己和自己对话

websocket简介

  • websocket是伴随着html5出现的新技术
  • 与传统http请求不同
  • 本质是基于 TCP 的协议

websocket与传统http请求的区别

传统http请求是由浏览器发起请求-服务端接收到请求-服务端返回数据,来回请求一次就断了。
websocket同样是由浏览器发起请求服务器接收请求,但是服务器接收到websocket请求后会在服务器与浏览器之间建立一个web端socket连接,这个连接允许服务器和浏览器相互发送消息,如果服务器端和浏览器端都不断开,socket连接是不会断开的。

websocket使用

创建 WebSocket 对象

var websocket = new WebSocket('ws://echo.websocket.org/');

建立连接

websocket.onopen = function() {
    console.log('websocket open');
}

发送请求

websocket.send(val);

接收到消息时回调

websocket.onmessage = function(e) {
    console.log(e.data);
}

通信发生错误时

websocket.onerror = function(e){
    console.log(e);
}

关闭连接时回调

websocket.onclose = function() {
    console.log('websocket close');
}
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论
好的,这是一个简单的 Spring Boot 集成 WebSocket 实现对话功能的 Demo,你可以参考一下。 首先,我们需要在 pom.xml 文件中添加 WebSocket 和 Spring Web 依赖: ```xml <dependencies> <dependency> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-starter-websocket</artifactId> </dependency> <dependency> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-starter-web</artifactId> </dependency> </dependencies> ``` 接下来,我们需要创建一个 WebSocket 配置类,用于注册 WebSocket 终端点和处理器: ```java @Configuration @EnableWebSocket public class WebSocketConfig implements WebSocketConfigurer { @Override public void registerWebSocketHandlers(WebSocketHandlerRegistry registry) { registry.addHandler(new ChatWebSocketHandler(), "/chat").setAllowedOrigins("*"); } } ``` 在上面的代码中,我们注册了一个名为 ChatWebSocketHandler 的 WebSocket 处理器,并将其映射到路径 /chat。同时,我们通过 setAllowedOrigins 方法允许来自任何来源的 WebSocket 连接。 接下来,我们需要定义 WebSocket 处理器 ChatWebSocketHandler: ```java public class ChatWebSocketHandler extends TextWebSocketHandler { private final List<WebSocketSession> sessions = new CopyOnWriteArrayList<>(); @Override public void afterConnectionEstablished(WebSocketSession session) throws Exception { sessions.add(session); } @Override protected void handleTextMessage(WebSocketSession session, TextMessage message) throws Exception { for (WebSocketSession s : sessions) { if (s.isOpen()) { s.sendMessage(message); } } } } ``` 在上面的代码中,我们定义了一个名为 sessions 的列表,用于存储所有 WebSocket 连接的会话。在 afterConnectionEstablished 方法中,我们将新连接的会话添加到 sessions 列表中。在 handleTextMessage 方法中,我们将接收到的消息广播给所有连接的会话。 最后,我们需要创建一个简单的 HTML 页面,用于测试 WebSocket 连接: ```html <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>WebSocket Test</title> </head> <body> <input type="text" id="message"> <button onclick="send()">Send</button> <div id="output"></div> <script> var socket = new WebSocket("ws://" + window.location.hostname + ":8080/chat"); socket.onmessage = function(event) { var output = document.getElementById("output"); output.innerHTML += event.data + "<br>"; }; function send() { var message = document.getElementById("message").value; socket.send(message); } </script> </body> </html> ``` 在上面的代码中,我们使用 JavaScript 创建一个 WebSocket 连接,并将其连接到 ChatWebSocketHandler 处理器。我们还创建了一个文本框和一个按钮,用于发送消息。每当接收到一条消息时,我们将其添加到名为 output 的 div 中。 这就是一个简单的 Spring Boot 集成 WebSocket 实现对话功能的 Demo。你可以使用浏览器打开 HTML 页面,测试 WebSocket 连接。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

Keven.

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值