前言
WebSocket 是一种在客户端和服务端之间进行双向通信的网络协议。它是建立在 HTTP 协议基础上的，但是它比起 HTTP 协议有更好的实时性和更少的网络流量。
在实时 Web 应用中，WebSocket 广泛应用于实时通信、消息传递、在线游戏等方面。本文将介绍如何在 Deno 中使用 WebSocket 构建实时 Web 应用。
准备工作
在使用 WebSocket 构建实时 Web 应用前，我们需要准备一下工作。
首先需要安装 Deno，Deno 是一个现代化的 JavaScript 和 TypeScript 运行时环境。可以通过以下命令安装 Deno：
$ curl -fsSL https://deno.land/x/install/install.sh | sh
安装完毕后，可以使用以下命令检查 Deno 版本：
$ deno --version
其次需要安装 WebSocket 库，Deno 中提供了 WebSocket API。可以通过以下命令来安装 WebSocket 库：
$ deno install --allow-net mod.ts
至此，准备工作完成。
使用 WebSocket 构建实时 Web 应用
使用 WebSocket 来构建实时 Web 应用有两个关键角色，分别为客户端和服务端。在服务端上我们需要调用 WebSocket 的方法，包括监听客户端的连接、处理客户端的消息和响应客户端的请求等；在客户端上，我们需要发送消息到服务端并处理服务端的响应。
接下来，我们将介绍如何实现一个简单的服务端和客户端的 WebSocket 实时通信。
服务端
监听客户端的连接
在服务端上，我们需要使用 Deno 内置的 Deno.listen 方法来监听客户端的连接。当客户端连接上来之后，我们需要为每个连接创建一个 WebSocket 对象，并且添加 message 事件和 close 事件回调函数。
-- -------------------- ---- -------
------ - ----- - ---- ---------------------------------------
------ - ---------------- --------- - ---- ----------------------------------
----- ------ - ------- ----- ---- ---
---------------------- ------ ------- -- ----------------------
--- ----- ------ --- -- ------- -
----- - -------- ---- - - ----
-- ----------------------- -- ------------ -
-- -- --------- --
----------------- ----- ------- -------------------------
-
-
-------- ------------------- ----------- ---- -
------------------- ------------
-- ------
------------------------------ ------- -- -
------------------------ ------------
-------------- ----------------
---
-- ------
---------------------------- ------- -- -
------------------- ---------------
---
-处理客户端的消息
处理客户端的消息很简单，我们只需要在 message 事件回调函数中处理客户端传过来的数据即可。在本例中，我们将消息原样返回给客户端。
ws.addEventListener("message", (event) => {
console.log("received:", event.data);
ws.send(`echo: ${event.data}`);
});响应客户端的请求
在 WebSocket 中，客户端可以向服务端发送请求，服务端需要处理这些请求并向客户端返回响应。我们可以在服务端的 message 事件回调函数中读取客户端的请求，并根据请求返回相应的响应。
-- -------------------- ---- -------
------------------------------ ------- -- -
------------------------ ------------
----- ------- - -----------------------
-- ------------- --- ---------- -
-------------- ---------------------
- ---- -- ------------- --- ------- -
------------------------
----- -------
---------- -----------
----
-
---在上面的示例中，我们处理了客户端发送的 message 请求和 ping 请求，并分别返回相应的响应。
客户端
客户端使用 WebSocket 也很简单，我们只需要创建 WebSocket 对象并连接到服务端，然后就可以通过对象的 send 方法向服务端发送数据。
-- -------------------- ---- -------
--------- -----
----- ----------
------
----- ----------------
---------------- ------------
-------
------
------ ----------- -----------------
------- ------------------------------
--- -------------------
--------
----- -- - --- ---------------------------------
----- -------- - ------------------------------------
----- ---------- - ---------------------------------------
----- ---------- - ---------------------------------------
--------------------------- ------- -- -
-------------------------
---
------------------------------ ------- -- -
------------------------ ------------
----- -- - -----------------------------
----- ---- - ------------------------------------
---------------------
-------------------------
---
------------------------------------ ------- -- -
----- ------- - -----------------
-----------------
---------------- - ---
---
---------
-------
-------在上面的示例中，我们使用 HTML 和 JavaScript 来创建了一个简单的实时通信页面。当用户在页面上输入消息并点击发送按钮时，客户端会将消息发送到服务端，并将服务端返回的数据显示在页面上。
总结
本文介绍了如何在 Deno 中使用 WebSocket 来构建实时 Web 应用，包括服务端的监听客户端的连接、处理客户端的消息和响应客户端的请求，以及客户端向服务端发送数据等。实时 Web 应用是当前 Web 应用开发中非常重要的一部分，希望本文能对读者有所启发。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/64e8277ef6b2d6eab339e75a