概念部分：
1，WebSocket 是 HTML5 提供的 TCP 连接上进行全双工通讯的协议。一次握手之后，服务器和客户端可以互相主动通信，双向传输数据。
2，浏览器想服务器发送请求，建立连接之后，可通过send()方法想服务器发送数据，并通过message事件接受服务器返回的数据。
使用示例
<script>
export default {
mounted() {
this.connectWebsocket();
},
methods: {
connectWebsocket() {
let websocket;
if (typeof WebSocket === "undefined") {
console.log("您的浏览器不支持WebSocket");
return;
} else {
let protocol = "ws";
let url = "";
if (window.localtion.protocol == "https:") {
protocol = "wss";
}
// `${protocol}://window.location.host/echo`;
url = `${protocol}://localhost:9998/echo`;
// 打开一个websocket
websocket = new WebSocket(url);
// 建立连接
websocket.onopen = () => {
// 发送数据
websocket.send("发送数据");
console.log("websocket发送数据中");
};
// 客户端接收服务端返回的数据
websocket.onmessage = evt => {
console.log("websocket返回的数据：", evt);
};
// 发生错误时
websocket.onerror = evt => {
console.log("websocket错误：", evt);
};
// 关闭连接
websocket.onclose = evt => {
console.log("websocket关闭：", evt);
};
}
}
}
};
</script>
以上就是vue使用websocket概念及示例的详细内容，更多关于vue使用websocket的资料请关注Devmax其它相关文章！