websocket前端使用

使用 WebSocket 前端需要以下步骤：

1. 创建 WebSocket 对象

在前端 JavaScript 中使用 WebSocket 首先需要创建 WebSocket 对象。可以通过以下代码创建：

var socket = new WebSocket('ws://localhost:8080');

其中，参数 'ws://localhost:8080' 是 WebSocket 服务器的地址。

2. 监听 WebSocket 事件

WebSocket 对象提供了一些事件来处理与服务器的交互。可以通过 addEventListener() 方法添加事件监听器来监听这些事件。常用的事件有：

- onopen：连接成功
- onmessage：接收到服务器发送的消息
- onerror：连接错误
- onclose：连接关闭

例如：

socket.addEventListener('open', function(event) {
  console.log('Connected to WebSocket server');
});

socket.addEventListener('message', function(event) {
  console.log('Received message: ' + event.data);
});

socket.addEventListener('error', function(event) {
  console.error('WebSocket error: ' + event);
});

socket.addEventListener('close', function(event) {
  console.log('WebSocket connection closed: ' + event);
});

3. 发送消息

可以使用 WebSocket 对象的 send() 方法发送消息给服务器，例如：

socket.send('Hello, server!');

完整的示例代码：

var socket = new WebSocket('ws://localhost:8080');

socket.addEventListener('open', function(event) {
  console.log('Connected to WebSocket server');
});

socket.addEventListener('message', function(event) {
  console.log('Received message: ' + event.data);
});

socket.addEventListener('error', function(event) {
  console.error('WebSocket error: ' + event);
});

socket.addEventListener('close', function(event) {
  console.log('WebSocket connection closed: ' + event);
});

socket.send('Hello, server!');

以上就是使用 WebSocket 前端的基本步骤。