介绍
WebSocket 是 HTML5 协议，它使得浏览器和服务器能够进行全双工通信，它通过在客户端和服务器之间建立一个不间断的连接，从而使得信息能够实时地传输。
而在小程序中使用 WebSocket 则需要使用 wxapp-websocket 这个 npm 包，这个包能够在小程序中便捷地实现 WebSocket 的功能。本文将详细介绍如何使用 wxapp-websocket 这个 npm 包，并包含一些示例代码。
安装
在使用 wxapp-websocket 前，需要先进行安装。
--- ------- --------------- ------
使用
创建 WebSocket
首先需要在需要使用 WebSocket 的页面或组件中引入 wxapp-websocket 包，并使用它创建一个 WebSocket 连接。
------ --------- ---- ------------------
----- --------- - --- -----------
---- ----------------------
---------- --------------
------- -
-------------- ------- ------
-
---在创建 WebSocket 对象时，可以传入一个配置项，包括：
url，必选。WebSocket 服务器的地址，可以使用wss或ws协议。protocols，可选。是一个字符串数组，表示子协议，若服务器没有进行协议选择，则返回空字符串。header，可选。一个 HTTP header 数组，包含了 HTTP header 描述中的一部分。
WebSocket 事件监听
有四个事件可以在 WebSocket 中进行监听，分别是：
onOpen，当 WebSocket 连接成功时触发。onClose，当 WebSocket 连接关闭时触发。onError，当 WebSocket 连接遇到错误时触发。onMessage，当 WebSocket 接收到服务器发送的消息时触发。
在监听事件时，可以为每个事件添加一个回调函数。
------------------- -- - ---------------------- ---------- --- -------------------- -- - ---------------------- ---------- --- ------------------------- -- - ------------------------ -------- ------- --- ----------------------------- -- - ---------------------- ------- ----------- --------- ---
发送消息
在 WebSocket 连接成功后，可以使用 send 方法发送消息，消息可以是字符串或 ArrayBuffer 类型。
--------------------- -------------
关闭连接
当不再需要使用 WebSocket 时，可以使用 close 方法关闭 WebSocket 连接。
------------------
示例代码
------ --------- ---- ------------------
----- --------- - --- -----------
---- ----------------------
---------- --------------
------- -
-------------- ------- ------
-
---
------------------- -- -
---------------------- ----------
---
-------------------- -- -
---------------------- ----------
---
------------------------- -- -
------------------------ -------- -------
---
----------------------------- -- -
---------------------- ------- ----------- ---------
---
--------------------- -------------
------------------结论
使用 wxapp-websocket 这个 npm 包可以便捷地在小程序中实现 WebSocket 的功能。在使用时，需要创建 WebSocket 对象并进行事件监听，之后就可以使用 send 方法发送消息，使用 close 方法关闭 WebSocket 连接。
来源：JavaScript中文网 ，转载请联系管理员！ 本文地址：https://www.javascriptcn.com/post/600671178dd3466f61ffe6e2