webSocket的使用文档

- 1.webSocket介绍
- 2.webSocket使用

1.webSocket介绍

WebSocket是在单个TCP连接上提供全双工通信的协议。它允许双方同时进行数据传输，而不需要等待对方的响应，简单说就是他是服务器和客户端相互主动传输信息的约定协议。

优点：

双向通信：WebSocket 允许客户端和服务器之间进行双向通信，客户端可以主动向服务器发送消息，而不需要等待服务器的请求
低延迟：WebSocket 连接在建立后保持打开状态，减少了每次请求和响应所需的开销，从而降低了延迟。
持久连接：WebSocket 连接是持久的，允许长时间保持连接而无需重新建立。
跨域支持：WebSocket 协议支持跨域通信，可以与不同源的服务器进行交互。
总之，WebSocket 提供了一种高效、灵活的方式来实现实时数据传输，特别适合需要快速和频繁更新数据的应用程序。

2.webSocket使用

webSocker官网介绍

状态：

常量	值	作用
WebSocket.CONNECTING	0	连接正在建立阶段
WebSocket.OPEN	1	连接已经建立可以通信
WebSocket.CLOSING	2	连接正在关闭
WebSocket.CLOSED	3	连接已经关闭或者未建立连接

代码事例：

javascript 复制代码

javascript
// 初始化 WebSocket 实例，连接到指定的 WebSocket 服务器 (后端地址10.10.10.100:8080)
const webSocket = new WebSocket('ws://10.10.10.100:8080/webSocket');
// 检查WebSocket连接状态 
    if (webSocket.readyState === WebSocket.CONNECTING) {
         console.log("连接正在建立..."); 
    } else if (webSocket.readyState === WebSocket.OPEN) {
        console.log("连接已建立！"); 
    } else if (webSocket.readyState === WebSocket.CLOSING) {
        console.log("连接正在关闭..."); 
    } else if (webSocket.readyState === WebSocket.CLOSED) {
        console.log("连接已关闭！"); 
    }

常用属性：

属性	描述
WebSocket.onmessage	接收到信息时的回调函数
WebSocket.onopen	连接成功后的回调函数
WebSocket.onerror	连接失败是要执行的回调函数
WebSocket.onclose	设置连接关闭时要执行的回调函数

代码事例：

javascript 复制代码

// 创建 WebSocket 实例，连接到指定的 WebSocket 服务器
const WebSocket = new WebSocket('ws://10.10.10.100:8080/webSocket')
// 连接成功时的回调函数
webSocket.onopen = (event)=>{
    console.log('连接已建立！');  
    // 在这里可以执行连接成功后的操作，例如发送数据
    webSocket.send('Hello, WebSocket Server!');
};

// 接收到消息时的回调函数
webSocket.onmessage = (event)=>{
// 在这里可以处理接收到的消息
    console.log('接收到消息：', event.data);
};

// 连接关闭时的回调函数
webSocket.onclose = (event)=> {
 // 在这里可以执行连接关闭后的操作
   console.log('连接已关闭！');
};

// 连接发生错误时的回调函数
webSocket.onerror = (error)=> {
	//在这里可执行连接失败可重连
    console.error('连接发生错误：', error);
};