在Vue中可以使用socket.io插件，不过这里使用的是js原生的WebSocket
首先再 data 中定义一个ws：
- data() {
- return {
- ws: "",
- };
- },
然后在method中设置相关函数
- methods: {
- // ws S
- onopen() {
- console.log("连接成功");
- let login_data = {}
- console.log("websocket握手成功，发送登录数据:", login_data);
- this.ws.send(login_data);
- },
- onmessage(e) {
- console.log(JSON.parse(e.data));
- switch (data["type"]) {
- case "ping":
- this.ws.send('{"type":"pong"}');
- break;
- // 登录 更新用户列表
- case "login":
- break;
- // 发言
- case "say":
- break;
- }
- },
- onclose() {
- console.log("连接关闭");
- },
- onerror() {
- console.log("出现错误");
- },
- }
然后在created 初始化：
- created() {
- this.ws = new WebSocket("ws://2020.9jm9.com:7272");
- this.ws.onopen = this.onopen;
- this.ws.onmessage = this.onmessage;
- this.ws.onclose = this.onclose;
- this.ws.onerror = this.onerror;
- },
感谢分享，很有帮助。不过在vue 中使用 websocket，我个使用的是第三方websocket框架【Goeasy】，文档齐全，能够快速上手开发，还有免费的技术支持，非常不错.