WebSocket 是一种基于 TCP 的协议,它允许客户端和服务器之间进行双向通信。在前端开发中,WebSocket 常用于实时数据传输、即时通讯等场景。在本文中,我们将介绍在 Deno 中如何进行 WebSocket 编程,以及如何进行实时数据传输的示例。
安装 Deno
如果你还没有安装 Deno,请先前往 官网 下载安装。安装完成后,运行以下命令验证安装:
---- ---------
如果输出了 Deno 的版本号,则说明安装成功。
创建 WebSocket 服务器
在 Deno 中,我们可以使用标准库中的 ws
模块来创建 WebSocket 服务器。首先,我们需要创建一个 HTTP 服务器,并在该服务器上设置 WebSocket 监听器。在 app.ts
文件中编写以下代码:
------ - ----- - ---- --------------------------------------- ------ - ---------------- ---------------------- --------------------- - ---- ---------------------------------- ----- ------ - ------- ----- ---- --- -------------------------------------- --- ----- ------ --- -- ------- - -- -------- --- ------ - ----- - ----- -- ---------- -- ---------- ------- - - ---- ----------------- ----- ---------- ---------- -------- -- ---------------------- ------------ ----- -- - --------------------- -- ------ ---------- --------- ----- ------------- ------- --- --- --- - ---- - ------------- ------- ---- ----- ------- ------ --- - - ----- -------- ------------------- ----------- ------------- - ------------------- ------------ --- ----- ------ -- -- --- - -- ------- -- --- --------- - ----------------------------- ---- ----- ------------ - ---- -- --- ---------- ----------- - ------------------------------- ---- - ---- -- -------------------------- - ----- -- ----- - --- ----------------------------- ------ - ---- -- --------------------------- - ------------------------------ ---- - - -
在以上代码中,我们创建了一个 HTTP 服务器,并监听 8080 端口。当访问该 HTTP 服务器的 /ws
路径时,将会创建一个 WebSocket 连接。在 handleWebSocket
函数中,我们处理客户端发送的消息,并通过 ws.send
方法向客户端发送消息。
创建 WebSocket 客户端
在浏览器端,我们可以使用原生的 WebSocket
对象来创建 WebSocket 连接。在 index.html
中,我们创建一个按钮,点击该按钮即可向服务器发送消息,并在页面上显示服务器响应的消息。
--------- ----- ------ ------ ----- --------------- -- ---------------- ------------ ------- ------ ------- ----------------- ---------------- --- ---------------------- -------- ----- ------ - --- ------------------------------------ ------------- - -- -- - ------------------- ------------ -- ---------------- - ------- -- - ----- ----------- - --------------------------------------- ----- -- - ----------------------------- ------------ - ----------- ---------------------------- -- ------------------------------------------------------------ -- -- - ------------------- -------- --- --------- ------- -------
在以上代码中,我们创建了一个 WebSocket 对象,并指定连接的地址为 ws://localhost:8080/ws
。当 WebSocket 连接成功时,我们在控制台输出 socket connected
。当收到服务器发送的消息时,我们将该消息添加到页面上的消息列表中。点击发送按钮时,我们使用 socket.send
方法向服务器发送消息。
运行示例代码
在以上代码编写完成后,我们可以在命令行界面中分别进入到 app.ts
和 index.html
文件所在的目录,并运行以下命令启动服务器:
---- --- ----------- ------
然后在浏览器中打开 index.html
文件,即可看到一个包含发送按钮和消息列表的页面。在页面上点击发送按钮时,将会向服务器发送消息,并将服务器响应的消息显示在页面上。
总结
本文介绍了如何在 Deno 中进行 WebSocket 编程,并提供了一个实时数据传输的示例。在实际开发中,WebSocket 可以用于实现实时聊天、订单状态更新等功能。如果你想进一步深入学习 WebSocket 相关的知识,建议阅读 WebSocket MDN 文档。
来源:JavaScript中文网 ,转载请注明来源 本文地址:https://www.javascriptcn.com/post/664c0783d3423812e4adcba1