前端封装websocket

前端可以使用 WebSocket API 封装 WebSocket。WebSocket 可以在客户端和服务器之间建立持久性连接，以进行双向通信。以下是一个简单的 WebSocket 封装示例：

class WebSocketClient {
  constructor(url) {
    this.url = url;
    this.socket = null;
  }

  connect() {
    this.socket = new WebSocket(this.url);
    this.socket.onopen = () => {
      console.log('WebSocket connection established');
    };
    this.socket.onmessage = (event) => {
      console.log(`Received message: ${event.data}`);
    };
    this.socket.onclose = () => {
      console.log('WebSocket connection closed');
    };
    this.socket.onerror = (error) => {
      console.error(`WebSocket error: ${error}`);
    };
  }

  send(message) {
    if (this.socket.readyState === WebSocket.OPEN) {
      console.log(`Sending message: ${message}`);
      this.socket.send(message);
    } else {
      console.error('WebSocket connection not open');
    }
  }

  close() {
    this.socket.close();
  }
}

使用方法：

const socket = new WebSocketClient('ws://localhost:8080');
socket.connect();
socket.send('Hello, server!');
socket.close();

以上代码创建了一个 WebSocketClient 类，将 WebSocket API 封装在其中。它包括一个 connect() 方法，用于建立与 WebSocket 服务器之间的连接，一个 send() 方法，用于发送消息，以及一个 close() 方法，用于关闭连接。可以根据需要添加其他方法。