【面试题精讲】什么是websocket？如何与前端通信？

2023-09-06 14:01:38 浏览数 (1)

有的时候博客内容会有变动，首发博客是最新的，其他博客地址可能会未同步,认准https://blog.zysicyj.top

什么是WebSocket？

WebSocket是一种在Web应用程序中实现双向通信的协议。它允许在客户端和服务器之间建立持久的、全双工的连接，以便实时地发送数据。

传统的HTTP协议是一种无状态的请求-响应协议，客户端发送请求，服务器返回响应，然后连接立即关闭。这种模型适用于大多数Web应用程序，但对于需要实时数据更新或双向通信的应用程序来说，它并不理想。

WebSocket通过在客户端和服务器之间建立长久的TCP连接，提供了一种持久性的通信通道。它通过在HTTP握手过程中升级连接，从而允许在同一个连接上进行双向通信。

WebSocket的特点包括：

  1. 双向通信：WebSocket允许客户端和服务器之间双向发送数据，而不仅仅是客户端向服务器发送请求。
  2. 实时性：WebSocket提供了高效的实时数据传输，可以在数据可用时立即将其推送给客户端。
  3. 较低的开销：WebSocket使用较少的网络开销，因为它使用持久连接而不需要频繁的握手和头部信息。
  4. 兼容性：WebSocket协议已经得到了广泛的支持，现代的Web浏览器和服务器都可以很好地支持WebSocket。

WebSocket在许多实时应用程序中得到广泛应用，例如聊天应用程序、实时协作工具、股票市场报价、多人游戏等。它提供了一种强大的机制，使得开发者可以轻松实现实时和双向的Web应用程序。

Spring Boot如何实现WebSocket

在Spring Boot中，可以使用Spring WebSocket模块来实现WebSocket功能。以下是使用Spring Boot实现WebSocket的基本步骤：

  1. 添加依赖：在 pom.xml文件中添加以下依赖，以引入Spring WebSocket和Tomcat WebSocket的支持：
代码语言：javascript复制
<dependency>
    <groupId>org.springframework.boot</groupId>
    <artifactId>spring-boot-starter-websocket</artifactId>
</dependency>
<dependency>
<groupId>org.apache.tomcat.embed</groupId>
<artifactId>tomcat-embed-websocket</artifactId>
</dependency>
  1. 创建一个WebSocket处理器类：创建一个类，实现 org.springframework.web.socket.handler.TextWebSocketHandler ，并重写 handleTextMessage和 afterConnectionEstablished等方法来处理WebSocket事件。
代码语言：javascript复制
import org.springframework.web.socket.TextMessage;
import org.springframework.web.socket.WebSocketSession;
import org.springframework.web.socket.handler.TextWebSocketHandler;

public class MyWebSocketHandler extends TextWebSocketHandler {

    @Override
    protected void handleTextMessage(WebSocketSession session, TextMessage message) throws Exception {
        // 处理收到的文本消息
    }

    @Override
    public void afterConnectionEstablished(WebSocketSession session) throws Exception {
        // 处理连接建立事件
    }
}
  1. 配置WebSocket端点：创建一个配置类，继承自 org.springframework.web.socket.config.annotation.WebSocketConfigurer ，并重写 registerWebSocketHandlers方法来注册WebSocket处理器和端点。
代码语言：javascript复制
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 {

    @Override
    public void registerWebSocketHandlers(WebSocketHandlerRegistry registry) {
        registry.addHandler(new MyWebSocketHandler(), "/websocket").setAllowedOrigins("*");
    }
}
  1. 启动应用程序：编写一个Spring Boot启动类，并添加 @SpringBootApplication注解来启动应用程序。
代码语言：javascript复制
import org.springframework.boot.SpringApplication;
import org.springframework.boot.autoconfigure.SpringBootApplication;

@SpringBootApplication
public class MyApplication {

    public static void main(String[] args) {
        SpringApplication.run(MyApplication.class, args);
    }
}

通过这些步骤，您可以在Spring Boot中实现WebSocket功能。客户端可以使用JavaScript的WebSocket 对象或其他WebSocket客户端库来连接到您的WebSocket端点。

请注意，上述代码只是一个基本示例，您可以根据实际需求进行更复杂的WebSocket实现。另外，还可以使用@MessageMapping 注解来处理特定消息类型，使用SimpMessagingTemplate发送消息给订阅了特定主题的客户端等。

前端如何与websocket通信

在前端处理WebSocket连接和消息，您可以使用JavaScript的WebSocket API来实现。以下是基本的前端处理步骤：

  1. 创建WebSocket对象：使用 WebSocket构造函数创建一个WebSocket对象，并传入WebSocket服务器的URL。
代码语言：javascript复制
var socket = new WebSocket("ws://localhost:8080/your-application/websocket");
  1. 监听WebSocket事件：通过WebSocket对象的事件处理程序，监听WebSocket的连接状态和消息事件。
代码语言：javascript复制
socket.onopen = function () {
    // 连接建立后的操作
};

socket.onclose = function () {
    // 连接关闭后的操作
};

socket.onerror = function (error) {
    // 错误处理
};

socket.onmessage = function (event) {
    var message = event.data;
    // 处理收到的消息
};
  1. 发送消息：使用WebSocket对象的 send方法发送消息到WebSocket服务器。
代码语言：javascript复制
socket.send("Hello, server!");
  1. 关闭连接：使用WebSocket对象的 close方法关闭WebSocket连接。
代码语言：javascript复制
socket.close();

通过这些步骤，您可以在前端处理WebSocket连接和消息。您可以根据实际需求，在事件处理程序中实现您的业务逻辑，例如更新UI、发送和接收数据等。

请注意，WebSocket连接是异步的，所以您需要适当处理连接建立、关闭和错误事件。此外，还可以使用其他WebSocket库（如Socket.io、SockJS等）来简化WebSocket处理，并提供更多高级功能，如自动重连、心跳检测等。

如何使用Python与websocket通信

要实现Python和Spring Boot WebSocket的通信，可以使用Python的WebSocket客户端库与Spring Boot的WebSocket服务器进行通信。以下是一种常见的实现方式：

  1. 安装WebSocket客户端库：使用Python的包管理工具（如pip）安装websocket-client库。
代码语言：javascript复制
pip install websocket-client
  1. 在Python中创建WebSocket连接：在Python代码中导入websocket库，并创建一个WebSocket连接到Spring Boot的WebSocket服务器。
代码语言：javascript复制
import websocket

def on_message(ws, message):
    # 处理收到的消息
    print(f"Received: {message}")

def on_error(ws, error):
    # 处理错误
    print(f"Error: {error}")

def on_close(ws):
    # 处理连接关闭
    print("Connection closed")

def on_open(ws):
    # 处理连接建立
    print("Connection established")
    # 发送消息
    ws.send("Hello from Python!")

websocket.enableTrace(True)
ws = websocket.WebSocketApp("ws://localhost:8080/your-websocket-endpoint",
                            on_message=on_message,
                            on_error=on_error,
                            on_close=on_close)
ws.on_open = on_open
ws.run_forever()
  1. 在Spring Boot中处理WebSocket消息：在您的Spring Boot应用程序中创建WebSocket处理器类，处理来自Python客户端的消息。
代码语言：javascript复制
import org.springframework.stereotype.Component;
import org.springframework.web.socket.handler.TextWebSocketHandler;
import org.springframework.web.socket.TextMessage;
import org.springframework.web.socket.WebSocketSession;

@Component
public class MyWebSocketHandler extends TextWebSocketHandler {

    @Override
    protected void handleTextMessage(WebSocketSession session, TextMessage message) throws Exception {
        // 处理收到的消息
        System.out.println("Received: "   message.getPayload());
        // 发送消息给Python客户端
        session.sendMessage(new TextMessage("Hello from Spring Boot!"));
    }
}

确保WebSocket端点的URL路径在Python和Spring Boot代码中匹配，并根据实际情况进行调整。

通过这些步骤，您可以在Python和Spring Boot之间建立WebSocket通信。当Python客户端发送消息时，Spring Boot服务器将接收并处理该消息，并可以向Python客户端发送响应消息。

本文由 mdnice 多平台发布

websocket 客户端 连接 前端 通信

0 人点赞