怎样在Vue中使用websocket传输数据

「爱情、让人受尽委屈。」 2022-09-03 04:19 291阅读 0赞

## 简介 ##

WebSocket 协议在2008年诞生，2011年成为国际标准。所有浏览器都已经支持了。
    
    它的最大特点就是，服务器可以主动向客户端推送信息，客户端也可以主动向服务器发送信息，是真正的双向平等对话，属于服务器推送技术的一种。
    
    
    
    其他特点包括：
    
    （1）建立在 TCP 协议之上，服务器端的实现比较容易。
    
    （2）与 HTTP 协议有着良好的兼容性。默认端口也是80和443，并且握手阶段采用 HTTP 协议，因此握手时不容易屏蔽，能通过各种 HTTP 代理服务器。
    
    （3）数据格式比较轻量，性能开销小，通信高效。
    
    （4）可以发送文本，也可以发送二进制数据。
    
    （5）没有同源限制，客户端可以与任意服务器通信。
    
    （6）协议标识符是ws（如果加密，则为wss），服务器网址就是 URL。
    
    如：
    ws://example.com:80/some/path

## 属性、事件、方法： ##

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzIyMTgyOTg5_size_16_color_FFFFFF_t_70]

> webSocket.readyState  
> readyState属性返回实例对象的当前状态，共有四种。  
> CONNECTING：值为0，表示正在连接。  
> OPEN：值为1，表示连接成功，可以通信了。  
> CLOSING：值为2，表示连接正在关闭。  
> CLOSED：值为3，表示连接已经关闭，或者打开连接失败。

## 简单示例： ##

参考：  
https://blog.csdn.net/qq\_38215042/article/details/108336909  
https://www.ruanyifeng.com/blog/2017/05/websocket.html  
https://www.runoob.com/html/html5-websocket.html  
https://www.cnblogs.com/yibadejiu/p/9962589.html

[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzIyMTgyOTg5_size_16_color_FFFFFF_t_70]: /images/20220829/84ebb24c63d842e1859df1e7a7caa878.png