Node.js 中的 WebSocket 库详解

WebSocket 是一种 web 通信协议,它可以使浏览器与服务器之间进行实时交互,无需通过轮询或 HTTP 长连接手段。Node.js 中有很多优秀的 WebSocket 库可供选择,其中最流行的是 ws 库。在本文中,我们将详细讨论 ws 库的用法和应用场景。

安装和基本用法

通过 npm 可以方便地安装 ws 库:

--- ------- --

接下来,我们创建一个服务器并监听 WebSocket 连接:

----- --------- - --------------

----- --- - --- ------------------ ----- ---- ---

-------------------- ---- -- -
  ---------------- ------ ------------
  ---------------- --------- -- -
    --------------------- ------- -- ------------
  ---
---

在客户端使用 WebSocket 对象连接到服务器:

----- -- - --- ---------------------------------

--------- - -- -- -
  ---------------------- -- ---------
  -------------- ---------
--

------------ - --------- -- -
  --------------------- ------- -- ------------------
--

运行服务器并打开客户端,你会看到如下输出:

--- ------ ---------
-------- ------- -- ----- ------

ws 库的基本用法和其他 WebSocket 库类似,我们接下来将详细介绍其高级用法和应用场景。

WebSocket 支持的协议和扩展

WebSocket 协议定义了标准化的握手流程和数据传输格式。ws 库支持的协议和扩展如下:

  • WebSocket 协议 version 8
  • WebSocket 协议 version 13
  • Permessage Deflate 扩展

WebSocket 协议的 version 8 和 version 13 是 WebSocket 的两个主要版本,它们具有互操作性。Permessage Deflate 扩展允许在传输时进行压缩,可有效减少数据传输量。你可以使用以下代码明确启用协议和扩展:

----- --------- - --------------

----- --- - --- ------------------
  ----- -----
  ------------------ -
    ------------------- -
      -- --- -----------------------------------------------------------
      -- --- ---- ---------
      ---------- -----
      --------- --
      ------ -
    --
    ------------------- -
      ---------- -- - ----
    --
    -- ----- ------- ---------
    ------------------------ ----- -- -------- -- ---------- ------
    ------------------------ ----- -- -------- -- ---------- ------
    -------------------- --- -- -------- -- ---------- ------
    -------------------- --- -- -------- -- ---------- ------
    -- ----- ------- --------- -- ------- -------
    ----------------- --- -- ------ ---- ----------- --- -----
    ---------- ---- -- ---- --- ------ ----- ----- --------
                     -- ------ --- -- -----------
  -
---

在实际应用中,你需要根据实际需求合理配置协议和扩展。

WebSocket 连接管理

ws 库提供了完善的 WebSocket 连接管理 API,你可以通过以下方法管理 WebSocket 连接:

  • WebSocket.Server.clients:获取连接到当前服务器的所有 WebSocket 连接。
  • WebSocket#close([code[, reason]]):关闭 WebSocket 连接并发送关闭码和原因。
  • WebSocket#terminate():立即关闭 WebSocket 连接。
  • WebSocket#ping([data[, mask[, cb]]]):向另一端发送 ping 帧。
  • WebSocket#pong([data[, mask[, cb]]]):向另一端发送 pong 帧。

例如,我们可以通过以下代码实现向所有连接发送消息:

----- --------- - --------------

----- --- - --- ------------------ ----- ---- ---

--- ------- - ---

-------------------- ---- -- -
  -----------------

  ---------------- --------- -- -
    --------------------- ------- -- -------------
  ---

  -------------- -- -- -
    ------- - ----------------------- -- ------ --- ----
  ---
---

-- ---- ------- -- --- -------
-------------- -- -
  -------------------- -- -
    -- -------------- --- --------------- -
      -------------- -----------
    -
  ---
-- ------

通过 WebSocket.Server.clients 属性获取所有连接,通过 WebSocket#send() 方法向所有连接发送消息。

应用场景

WebSocket 可以应用在很多场景中,例如实时推送、实时聊天、多人协作等。在这里,我们介绍一个基于 WebSocket 的实时协作演示代码。

--------- -----
------
------
  ----- ----------------
  --------------- -------------
  -------
    ------ -
      ------ ------
      ------- ------
      ------- --- ----- -----
      ----------------- ------
    -
  --------
-------
------
  ---- -----------------
  ----
  -------
    ---- -----
    ------ ----------- ----------------
  --------
  ----
  ------- --------------------------------

  --------
    ----- -- - --- ---------------------------------

    ----- ------ - ---------------------------------
    ------------ - ----
    ------------- - ----
    ------------------- - ---- ----- ------
    ----- --- - ------------------------

    ----- ----------- - ----------------------------------------
    ------------------- - -- -- -
      ------------------------ -------- ------- ----
    --

    ----- --------- - --------------------------------------
    ----------------- - --- -- -
      -- ---------- --- --- -
        ------------------------ -------- ------- ------ --------------- ----
      -
    --

    ----- ----- - ---------------------------------
    --------------------------

    --- --------- - ------
    --- ----- - --
    --- ----- - --

    ------------------ - --- -- -
      --------- - -----
      ----- - ----------
      ----- - ----------
    --

    ------------------ - --- -- -
      -- ----------- -
        ----- - - ----------
        ----- - - ----------
        ----------------
        ----------------- -------
        ------------- ---
        -------------

        ------------------------ -------- ------- ------ ------ -- - ----
        ----- - --
        ----- - --
      -
    --

    ---------------- - -- -- -
      --------- - ------
    --

    ------------ - --------- -- -
      ----- ---- - -------------------------
      ------ -------------- -
        ---- --------
          ---------------- -- ------------- ---------------
          ------
        ---- -------
          -------------------- --- ------ --- --------
          ------
        ---- -------
          ----- - ------ ------ -- - - - -----
          ----------------
          ----------------- -------
          ------------- ---
          -------------
          ------
      -
    --
  ---------
-------
-------

服务端代码:

----- --------- - --------------

----- --- - --- ------------------ ----- ---- ---

--- ------- - ---
--- --------- - ---

-------------------- ---- -- -
  -----------------

  ---------------- --------- -- -
    ----- ---- - --------------------
    ------ -------------- -
      ---- --------
        --------- - ---
        ------------------------ -- ----------------------
        ------
      ---- -------
        ------- - -----------
        ------------------------ -- ---------------------------- -------- ------- ------ ------- -----
        ------
      ---- -------
        ---------------------
        ------------------------ -- ----------------------
        ------
    -
  ---

  -------------- -- -- -
    ------- - ----------------------- -- ------ --- ----
  ---

  ------------------------ -- -
    ------------------------ -------- ------- ------- ----
  ---
---

这是一个简单的实时白板示例,你可以在浏览器中打开多个窗口,在不同画板上演示绘画操作。在这个示例中,我们使用 JSON.stringify()JSON.parse() 方法将数据转换为字符串格式,以方便传输。

总结

本文介绍了 ws 库的基本用法、协议和扩展、WebSocket 连接管理以及应用场景。WebSocket 是一种基于标准化协议的 web 通信协议,它可以实现实时通信、多人协作等功能,是 Web 开发中常用的技术。通过这篇文章,读者可以学到如何在 Node.js 中使用 WebSocket,以及如何应用 WebSocket 实现实时协作功能。

来源:JavaScript中文网 ,转载请联系管理员! 本文地址:https://www.javascriptcn.com/post/647eea9648841e9894e98ca9


猜你喜欢

  • Flexbox 如何实现中间放大的效果

    在前端开发中,我们经常需要实现一些特殊布局效果。其中之一就是中间放大的效果。本文将介绍如何使用 Flexbox 实现这一效果。 Flexbox 简介 Flexbox 是 CSS3 中新增的一种布局方式...

    1 年前
  • ESLint 报错:'Unexpected block statemente surrounding arrow body' 的解决方法

    在前端开发中,编写高质量的代码非常重要,ESLint是一个非常好用的代码检查工具,可以帮助我们发现代码中潜在的问题并指出改进方案。但是有时候我们在使用ESLint的过程中,会遇到一些报错,比如'Une...

    1 年前
  • Kubernetes 中如何实现应用的自动扩缩容?

    随着互联网的快速发展,应用的流量和负载也越来越大,如何高效地管理应用的资源、实现自动化的扩缩容成为了前端工程师必须掌握的技能之一。Kubernetes 作为一款自动化容器管理工具,可以帮助前端工程师快...

    1 年前
  • ECMAScript 2020 给 JavaScript 带来了哪些重要更新?

    ECMAScript(简称 ES)是 JavaScript 的标准化版本,它定义了一系列规范来规定 JavaScript 应该如何运行。自1997年JavaScript第一次成为ECMAScript标...

    1 年前
  • 如何使用 Chai 和 Mocha 测试 GraphQL API

    GraphQL 已经成为现代 Web 开发中最受欢迎的 API 标准之一。 它通过使用类型强制的查询语言和自定义类型返回数据,将客户端和服务器端解耦。 本文将介绍如何使用 Mocha、Chai 和 G...

    1 年前
  • Babel 解析器原理及如何把 Node.js 与 Babel 结合使用

    Babel 是一个 JavaScript 编译器,它把 ES6+ 的 JavaScript 代码转换成向后兼容的 JavaScript 代码,使得我们在写 JavaScript 代码时不用考虑浏览器或...

    1 年前
  • ECMAScript 2019 & TypeScript 3.4:JavaScript 和 TypeScript 新特性

    随着 JavaScript 和 TypeScript 的普及,前端开发者们也越来越关心新特性的出现。在 2019 年,ECMAScript 2019 和 TypeScript 3.4 两个版本相继发布...

    1 年前
  • ES2021:如何使用最佳实践进行循环处理

    循环处理是前端开发中经常会用到的操作,而在 ES2021 中,有一些新的语法和方法可以让我们更加方便、高效地进行循环处理。在本文中,我们将介绍一些 ES2021 的新功能,以及如何使用最佳实践进行循环...

    1 年前
  • 响应式设计中的 H5 完美适配问题及实践

    随着移动设备的普及和使用频率的提高,响应式设计已经成为了各种网站和应用程序的必备设计元素。但是,对于 H5 页面而言,由于其特殊性和复杂性,响应式设计的实现相对困难。

    1 年前
  • Serverless 应用中的自动化部署和持续集成

    什么是 Serverless 应用? Serverless 应用是一种新型的应用架构,简单来说就是在应用部署时不需要关注服务器的管理。在 Serverless 应用中,应用程序的各个部分会自动部署在云...

    1 年前
  • 使用 Koa2 和 JWT 来保护 API 安全

    在现代 Web 应用程序中,API 是相当重要的组成部分,因为它是前端应用程序和后端服务器之间的桥梁。但是,开发者们往往会面临如何保护 API 安全的问题。本文将介绍如何使用 Koa2 和 JWT 来...

    1 年前
  • Cypress 自动化测试:如何模拟用户登录

    在前端开发中,测试是一个非常重要的环节。自动化测试可以帮助我们快速验证我们的代码是否工作正常,提高测试效率和代码质量。Cypress 是一个非常好用的自动化测试库,本文将介绍如何使用 Cypress ...

    1 年前
  • PM2 与 Redis 配合实现 Node.js 进程的状态同步

    在 Node.js 开发中,我们通常使用 PM2 管理进程,同时在分布式系统中,我们需要实现进程的状态同步。本文将介绍如何使用 PM2 配合 Redis 实现 Node.js 进程的状态同步,以及如何...

    1 年前
  • 如何使用 LESS 编写浏览器兼容性样式

    在前端开发中,不同浏览器的兼容性问题是我们需要特别考虑的一点。使用 LESS 编写样式不仅可以使样式的维护更加方便,还可以通过一些技巧来解决浏览器兼容性问题。本篇文章将介绍如何使用 LESS 编写浏览...

    1 年前
  • Mongoose 中文档更新的详细说明

    Mongoose 是一个 Node.js 库,用于在 MongoDB 中创建模型和查询数据。它是一个非常流行的 ORM(Object-Relational Mapping)工具,能够帮助我们在 Jav...

    1 年前
  • 解决 Node.js 中长时间运行占用 CPU 过高的问题

    在 Node.js 应用开发中,常常出现长时间运行且占用 CPU 过高的情况,这会对服务器性能造成影响。本文将介绍如何解决这个问题,并提供参考示例代码及实践指导。 问题分析 通常情况下,Node.js...

    1 年前
  • 如何正确用 Sass 编译 module.less

    Sass 是一种 CSS 预处理器,它能够扩展 CSS 的功能并提供更好的代码组织和可读性。在前端开发中,Sass 可能是使用最广泛的预处理器之一。如果你正在使用 Sass 并尝试编译一个 modul...

    1 年前
  • Material Design 中使用 ToolBar+TabLayout 实现高级搜索效果

    Material Design 是一种设计语言,由 Google 提出,旨在为移动应用和 Web 应用提供一种现代化和统一化的视觉和用户体验。其中,ToolBar 和 TabLayout 是 Mate...

    1 年前
  • 在Angular应用程序中实现国际化

    随着全球化的不断深入,构建一个跨越国界的网站或应用程序已经不再是一个可选的选项,而是一个必须的需求。国际化是一种为了让你的应用能够在不同的地方使用而进行的过程。在本文中,我们将讨论在Angular应用...

    1 年前
  • Vue.js 如何实现无限级分类

    在网站或应用程序中,无限级分类是一种常见的需求。例如,将产品分类或文章归档按照树形结构展示。Vue.js 是一种非常流行的 JavaScript 前端开发框架,本文将介绍如何使用 Vue.js 实现无...

    1 年前

相关推荐

    暂无文章