随着 web 技术的发展,实时通信已经成为了 web 应用程序中非常重要的一部分。使用 WebSocket 可以轻松地实现实时通信功能,而 Deno 的出现为我们提供了一种全新的实现方式。
Deno 是一个基于 V8 引擎构建的 JavaScript/TypeScript 运行时环境,兼容 node.js 的 API,但没有依赖性和沙盒环境。通过 Deno,我们可以在 JavaScript/TypeScript 环境下直接使用 WebSocket,从而实现实时通信。
WebSocket 简介
WebSocket 是一种在单个 TCP 连接上进行全双工通信的网络协议。它通过在服务器和客户端之间建立一个持久化的连接,使得服务器可以主动向客户端推送消息。相比传统的 HTTP 请求响应模式,WebSocket 可以更快地实现实时消息传输。
WebSocket 协议可以在浏览器端使用浏览器提供的 WebSocket API 实现,也可以使用服务器端的 WebSocket 实现。本文将介绍如何使用 Deno 自带的 WebSocket 实现实现 WebSocket 服务器。
Deno WebSocket API
Deno WebSocket API 实现了 WebSocket 服务器和客户端的功能。在服务器端,我们可以使用 Deno 自带的 WebSocket API 监听来自客户端的连接请求,并且与客户端建立一个双向通信的 WebSocket 连接。
在客户端,我们可以使用浏览器提供的 WebSocket API 连接到 WebSocket 服务器,并监听服务器发送的消息。
使用 Deno 实现 WebSocket 服务器
下面我们通过一个简单的例子,来演示如何使用 Deno 实现一个 WebSocket 服务器,并实现实时通信。
首先,在命令行中执行以下命令安装 Deno:
curl -fsSL https://deno.land/x/install/install.sh | sh
安装完成后,我们创建一个名为 server.ts
的文件,编写 WebSocket 服务器实现代码:
-- -------------------- ---- ------- ------ - ----- - ---- --------------------------------------- ------ - ---------------- ---------- - ---- ---------------------------------- ----- ------ - ------- ----- ---- --- -------------------------------------- --- ----- ------ --- -- ------- - -- -------- --- ----- -- ---------------- - ----- - ----- -- ---------- -- ---------- ------- - - ---- ----------------- ----- ---------- ---------- -------- ------------- ------ -- - ------------------- ------------- --- ----------- ----- -- ----- - -- ------- ----- --- --------- - ------------------- ---------- ------- -------------------- - - ------- - - --- - ---- - ------------- ----- ------ ------ --- - -
我们使用 serve
函数创建一个 HTTP 服务器,并监视来自 /ws
路径的 WebSocket 连接请求。对于接受到的 WebSocket 连接请求,我们使用 acceptWebSocket
函数接受并建立一个 WebSocket 通信连接,在连接成功后,通过 for await
循环读取来自客户端的消息,并将消息通过 send
函数向客户端发送。
然后,在命令行中执行以下命令运行服务器:
deno run --allow-net server.ts
服务器开始监听来自客户端的连接请求,打印如下结果:
http://localhost:8080/
我们使用浏览器访问 http://localhost:8080/
,打开控制台,并执行以下代码建立与服务器的 WebSocket 连接:
const ws = new WebSocket('ws://localhost:8080/ws'); ws.addEventListener('open', () => { console.log('websocket connected!'); ws.send('hello server'); }); ws.addEventListener('message', (event) => { console.log('websocket message:', event.data); });
WebSocket 连接成功后,我们向服务器发送消息,并在控制台中打印出发送的消息与服务器返回的消息。经过测试,我们可以看到控制台打印出如下结果:
websocket connected! websocket message: received: hello server
说明我们已经成功通过 WebSocket 进行了实时通信。
总结
本文介绍了如何使用 Deno WebSocket 实现实时通信。我们首先介绍了 WebSocket 协议的基本原理,然后对 Deno WebSocket API 进行了详细讲解。最后我们通过一个简单的例子演示了如何使用 Deno 实现 WebSocket 服务器和客户端,实现了实时通信功能,希望本文能够对大家有所帮助。
来源:JavaScript中文网 ,转载请注明来源 https://www.javascriptcn.com/post/648ae16948841e9894929fe4