npm 包 mqtt-service 使用教程

前言

MQTT(Message Queuing Telemetry Transport)是一种消息传输协议,已经成为物联网应用的标准之一。在前端领域,MQTT 协议常常被用于与物联网设备进行双向通信。mqtt-service 是一款基于 MQTT 协议的 npm 包,使得前端开发者可以便捷地进行 MQTT 通信。本文将介绍如何使用 mqtt-service 完成 MQTT 通信。

安装

使用 npm 进行安装:

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

基本设置

在使用 mqtt-service 之前,我们需要进行一些基本的设置,确保连接正确的 MQTT 服务器,并正确发送和接收数据。

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

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

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

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

在上面的代码中,我们首先使用 mqttService.connect() 方法连接到 MQTT 服务器。连接成功后,可以使用 mqttService.subscribe() 方法订阅主题,使用 mqttService.publish() 方法发布消息。

接收指定时间内的最新消息

在某些场景下,我们可能需要接收某个主题在指定时间内发布的最新的一条消息。mqtt-service 提供了 mqttService.getLastMessageByTime() 方法,可以用于实现该功能。具体用法如下所示:

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

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

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

在上面的代码中,我们通过订阅主题,接收到所有的消息。然后,在 5 秒后,使用 mqttService.getLastMessageByTime() 方法获取主题 some/topic 在过去 5 秒内发布的最新一条消息。该方法的第二个参数为时间范围,单位为毫秒。

订阅时仅接收新消息

在默认情况下,mqtt-service 订阅主题后,会接收到历史消息和新消息。如果我们想仅接收新消息,可以通过设置 mqttService.subscribe() 方法的 option 参数来实现。具体用法如下所示:

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

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

在上面的代码中,我们设置了 onlyReceiveNew: true,表示仅接收新消息。

MQTT 连接状态监测

mqtt-service 提供了 mqttService.isConnected() 方法,可以用于监测 MQTT 连接状态。具体用法如下所示:

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

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

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

在上面的代码中,我们每隔 1 秒使用 mqttService.isConnected() 方法检测一次 MQTT 连接状态。

示例代码

下面是一个完整的示例代码,用于订阅主题 some/topic 并循环发送消息:

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

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

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

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

总结

通过本文的介绍,我们可以看到 mqtt-service 的使用非常简单,但是通过它我们可以快速地实现 MQTT 通信。在实际开发中,可能会有更多的场景需要考虑。我们也可以通过 mqtt-service 提供的其他 API,配合一些开源的 MQTT 中间件,来满足我们的需求。

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


猜你喜欢

  • npm 包 vebt 使用教程

    引言 前端工程化是前端开发中非常重要的一环,其中构建工具和包管理工具是重要的工具之一。npm 是前端最常用的包管理工具之一,它提供了海量的 npm 包供前端开发者使用。

    3 年前
  • npm包result-monad的使用教程

    前言 前端应用中经常需要处理异步操作,例如从后端请求数据或者通过浏览器的API获取用户输入。针对这样的需求,JavaScript社区中出现了很多处理异步操作的库。 在使用异步库时,开发者常常需要手动处...

    3 年前
  • npm 包 memoized-member 使用教程

    前言 在前端开发中,我们经常需要对数据进行相应的处理,为了提高代码的效率和性能,我们通常会使用一些缓存技术。在 JavaScript 中,我们可以使用 memoization 技术来提高方法的效率,从...

    3 年前
  • npm包 object-assign-all 使用教程

    在前端开发中,我们常常需要对对象进行合并操作。虽然ES6提供了Object.assign方法实现对象合并,但是在某些情况下,我们需要更加方便和灵活地进行对象合并操作。

    3 年前
  • npm 包 react-scroll-to-element 使用教程

    前言 在 Web 开发过程中,我们时常需要实现页面内平滑滚动到指定元素的功能。虽然我们可以通过手写 JavaScript 来实现,但这样需要写大量的 DOM 操作代码,非常繁琐。

    3 年前
  • npm 包 uip 使用教程

    简介 uip 是一款能够帮助我们构建前端 UI 组件库的 npm 包,通过它我们可以快速地创建符合需求的 UI 组件库。uip采用 React 开发,主要面向 React 应用。

    3 年前
  • npm 包 generator-stenciljs 使用教程

    Stencil 是一个可以创建 Web Components 的工具,它可以使得开发不同框架的 Web Components 更加简单。而 generator-stenciljs 是一个基于 Yeom...

    3 年前
  • npm 包 react-globally 使用教程

    介绍 react-globally 是一个 React 应用中全局状态管理的库。它允许你在应用程序中创建一个全局的状态管理器,使得状态能够被任何组件访问和使用。它的设计目的是使得应用程序更容易管理和扩...

    3 年前
  • npm 包 just-location 使用教程

    随着前端技术的发展和应用场景的扩大,前端开发的复杂度也越来越高。为了提高开发效率和代码质量,我们常常需要使用一些现成的工具或库来辅助开发。而 npm 就是一个非常流行的 Node.js 包管理器,拥有...

    3 年前
  • npm 包 openui5-runtime 使用教程

    简介 openui5-runtime 是一个用于开发前端界面的 JavaScript 库,它提供了各种 UI 组件、技术服务和工具,可以让开发者快速地创建高质量的 Web 应用程序。

    3 年前
  • npm 包 gulp-run-seq-unique 使用教程

    在前端开发中,快速构建工具是必不可少的,而 gulp 是目前其中非常受欢迎的一个构建工具。而在使用 gulp 进行构建过程中,流程的串行执行是一个很重要的问题,这就需要用到 gulp-run-seq-...

    3 年前
  • npm 包 i18n-gettext 使用教程

    本文将介绍 npm 包 i18n-gettext 的使用方法,i18n-gettext 是一个国际化的工具,可以帮助前端开发者将应用程序国际化。通过本文,你将学到如何使用 i18n-gettext 实...

    3 年前
  • npm 包 json-convert-csv 使用教程

    简介 json-convert-csv 是一个 Node.js 模块,可以将 JSON 数据转换为 CSV 格式的数据,同时也支持将 CSV 数据转换为 JSON 格式的数据。

    3 年前
  • npm 包 is-anagram 使用教程

    在前端开发中,有很多常见的字符串操作,比如判断两个单词是否是异位词(anagram)。虽然这个操作不是很复杂,但是在代码中写一个功能完整、容错性好的方法仍然需要一些时间和精力,往往显得冗余。

    3 年前
  • npm 包 ngw-generic-forms 使用教程

    简介 ngw-generic-forms 是一个基于 Angular 的表单生成器,能够快速地生成各种类型的表单,提高前端开发效率。它提供了丰富的表单元素组件,支持自定义表单元素组件,能够满足各种复杂...

    3 年前
  • npm 包 rizzle 使用教程

    npm 包 rizzle 使用教程 前言 在前端开发过程中,经常需要进行数据可视化,而数据可视化的展示形式又非常多样化。除了使用 chart.js 等大型开源项目外,也可以使用 rizzle 这个轻量...

    3 年前
  • npm 包 personity-logo 使用教程

    简介 personity-logo 是一个用于生成个性化品牌 logo 的 npm 包。它使用了机器学习的技术,可以根据输入的品牌名称、颜色和类型等信息,智能生成一种独特的品牌 logo。

    3 年前
  • npm 包 react-native-qiyekun-nativemodule 使用教程

    简介 react-native-qiyekun-nativemodule 是一个能够在 React Native 中直接调用原生模块代码的 npm 包。它封装了常用的原生模块功能,可以方便地实现本地化...

    3 年前
  • npm 包 t-machine 使用教程

    在前端领域中,我们经常需要进行调试、测试、代码分析等操作。这些操作通常需要针对不同的项目进行不同的操作,而这时候使用 npm 包就尤为方便。t-machine 就是一款非常好用的 npm 包,可以帮助...

    3 年前
  • npm 包 veams-plugin-logger 使用教程

    在前端开发中,我们需要经常处理大量的日志信息。然而,手动输出日志信息不仅繁琐且容易出错,因此我们需要借助辅助工具来完成这个任务。 veams-plugin-logger 是一个 NPM 包,它提供了一...

    3 年前

相关推荐

    暂无文章