vue3怎么创建WebSocket连接后端地址:ws://localhost:8090/websocket/{userId}
时间: 2023-07-31 18:10:21 浏览: 117
vue中使用websocket
5星 · 资源好评率100%
在Vue3中创建WebSocket连接可以使用`WebSocket`对象,如下所示:
```javascript
const userId = 'your user id';
const socket = new WebSocket(`ws://localhost:8090/websocket/${userId}`);
// 监听连接成功事件
socket.addEventListener('open', event => {
console.log('WebSocket连接已打开');
});
// 监听收到消息事件
socket.addEventListener('message', event => {
console.log('收到消息:', event.data);
});
// 监听连接关闭事件
socket.addEventListener('close', event => {
console.log('WebSocket连接已关闭');
});
// 监听连接出错事件
socket.addEventListener('error', event => {
console.error('WebSocket连接出错:', event);
});
```
在以上代码中,我们首先定义了`userId`变量,然后通过`new WebSocket()`方法创建了一个WebSocket连接,并传入了完整的后端地址。接着,我们可以通过监听`open`、`message`、`close`和`error`事件来处理WebSocket连接的状态和收到的消息。需要注意的是,WebSocket连接是异步的,因此我们需要等待连接成功后才能发送消息。
阅读全文