WebSocket 是一种能够在浏览器和服务器之间直接传递数据的网络协议，它具有实时性和高效性等优点，在前端开发中使用非常广泛。而 websocket-as-promised 是一款基于 WebSocket 的 npm 包，它封装了 WebSocket API，使其支持 Promise，简化了 WebSocket 的使用方式。
基本概念
在使用 websocket-as-promised 之前，我们需要了解一些基本概念：
WebSocket
WebSocket 是 HTML5 开始提供的一种在单个 TCP 连接上进行全双工通讯的协议，它允许服务器主动推送数据给客户端。WebSocket 协议在建立连接时需要进行握手，之后就可以直接发送数据，不需要像 HTTP 协议一样每次请求都要建立一次连接。
Promise
Promise 是一种异步编程的解决方案，它可以将异步操作以同步操作的形式表示出来。Promise 有三种状态：Pending（等待状态）、Resolved（已完成状态）和 Rejected（已失败状态）。当 Promise 对象的状态从 Pending 转变为 Resolved 或 Rejected 时，就称为 Promise 对象“已定型”。一旦 Promise 对象“已定型”，就无法再改变状态。
安装和使用
安装 websocket-as-promised 可以直接使用 npm 进行安装：
npm install websocket-as-promised
在代码中引入 websocket-as-promised：
const WebSocketAsPromised = require('websocket-as-promised');连接 WebSocket
连接 WebSocket 需要使用 WebSocketAsPromised 类，可以通过构造函数传递 WebSocket 的 URL：
const wsp = new WebSocketAsPromised('wss://echo.websocket.org/');如果需要传递 WebSocket 的参数，可以使用第二个参数：
const wsp = new WebSocketAsPromised('wss://echo.websocket.org/', {
createWebSocket: url => new WebSocket(url, ['soap', 'xmpp'], {rejectUnauthorized: false}),
packMessage: data => JSON.stringify(data),
unpackMessage: data => JSON.parse(data),
attachRequestId: (data, requestId) => Object.assign({requestId: requestId}, data),
extractRequestId: data => data && data.requestId
});其中 createWebSocket 函数用来创建 WebSocket 对象，packMessage 函数用来将消息打包，unpackMessage 函数用来解包消息，attachRequestId 函数用来附加一个唯一的请求 ID，extractRequestId 函数用来从返回的数据中提取请求 ID。
发送消息
通过 send 方法发送消息到 WebSocket 服务器，该方法返回一个 Promise，用来异步处理返回的结果。
wsp.send({type: 'ping'}).then(response => {
console.log(response); // {type: 'pong'}
});监听消息
通过 onData 方法监听 WebSocket 返回的消息，该方法接受一个回调函数作为参数。
wsp.onData(message => console.log(message));
错误处理
通过 onError 方法监听 WebSocket 发送和返回数据时的错误。
wsp.onError(error => console.log(error));
关闭连接
使用 close 方法可以关闭 WebSocket 连接：
wsp.close();
示例代码
-- -------------------- ---- -------
----- ------------------- - ---------------------------------
----- --- - --- -------------------------------------------------
------------------------- -- -
--------------- ---------------------- -- -
----------------------
---
---
------------------------------ -- ----------------------
----------------------------- -- --------------------学习和指导意义
使用 websocket-as-promised 可以简化 WebSocket 的使用方式，使其更符合 Promise 的异步操作方式。WebSocket 的开发需要掌握的知识点较多，如建立连接、传输数据、关闭连接等，而使用 websocket-as-promised 可以简化这些操作。同时，掌握 WebSocket 的开发也是前端工程师必备的技能之一，学习和掌握 WebSocket 可以提高前端应用的实时性和效率。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/5eeda9f7b5cbfe1ea06102f2