webscoket服务器

如何在vue3中,搭建一个 websocket 的服务,达到发送消息的作用。

下面是一个使用 Node.js 搭建 WebSocket 服务器的例子:

首先,安装 ws 库:

npm install ws

然后,创建一个 server.js 文件,内容如下:

const WebSocket = require('ws');

const wss = new WebSocket.Server({ port: 8080 });

wss.on('connection', function connection(ws) {
ws.on('message', function incoming(message) {
console.log('received: %s', message);
});

ws.send('something');
});

最后,启动服务器:

node server.js

然后,在浏览器中打开 http://localhost:8080/%EF%BC%8C%E5%8D%B3%E5%8F%AF%E8%BF%9E%E6%8E%A5%E5%88%B0 WebSocket 服务器。

在 Vue 3 中使用 WebSocket 的方法与在浏览器中使用类似,具体可以参考以下代码:

import { createApp } from 'vue';

const app = createApp({
data() {
return {
ws: null,
};
},
mounted() {
this.ws = new WebSocket('ws://localhost:8080');
this.ws.addEventListener('message', (event) => {
console.log(event.data);
});
},methods: {
sendMessage(message) {
this.ws.send(message);
},
},
});

app.mount('#app');