参考文档:

[1] https://www.hivemq.com/blog/mqtt-client-library-mqtt-js/

[2] https://www.tabnine.com/code/javascript/functions/mqtt/MqttClient/on

[3] https://docs.cloudplugs.com/kb/Developer-Guides/MQTT-API/Javascript-Examples

[4] https://blog.51cto.com/olivetree/1621128?winzoom=1

[5] https://www.emqx.com/zh/blog/mqtt-js-tutorial


1. 新建uniapp项目

2. 安装mqtt

npm install mqtt@3.0.0 --save

3. 创建一个mqtt客户端

// 改变client
// #ifdef H5
var preStr = "wss://";
var mqtt = require('mqtt'); //改变mqtt,h5可以直接写'mqtt'
// #endif
// #ifdef MP-WEIXIN||APP-PLUS
var preStr = "wxs://";
var mqtt = require('mqtt/dist/mqtt.js'); //小程序必须写'mqtt/dist/mqtt.js'
// #endif var client = mqtt.connect(preStr + url,MQTT_OPTIONS);//mqtt.connect([url], options)
/**
* connect、error、reconnect、message、end、close都是回调函数
* 在相应的状态自然会调用
*/
client.on('connect', function() {
console.log('MQTT client is connected');
}).on('error', (e) => {
console.log('MQTT error:', e);
}).on('reconnect', function() {
console.log('MQTT client is reconnect...');
}).on('message', function(topic, message) {
console.log('topic:', topic);
console.log("message: ", message.toString());
}).on('end',function(){
console.log('MQTT client is end');
}).on('close', function() {
console.log('MQTT connection closed, now exiting.');
}); /**
* topic, msg 是根据文档定义的
* 先订阅,再发布
*/
client.subscribe(topic);
client.publish(topic, msg);

/* 退订主题 */
client.unsubscribe(topic);

uniapp中mqtt的基本使用的更多相关文章

  1. Uni-app中Class绑定与Style绑定

    为了节约性能,我们将Class与Style的表达式通过compiler硬编码到uni-app中 支持语法和转换效果如下: Class支持语法: <view :class="{ acti ...

  2. uniapp中引入less文件

    uniapp入门遇到的问题记录 在uniapp中从外部import less文件的话,首先需要在 工具>插件安装 中安装支持less语法的插件,然后在.vue文件中引入  @import url ...

  3. uni-app中组件的使用

    组件基本知识点: uniapp中:每个页面可以理解为一个单页面组件,这些单页面组件注册在pages.json里,在组件关系中可以看作父组件. 自定义可复用的组件,其结构与单页面组件类似,通常在需要的页 ...

  4. uni-app中当uni.navigateTo传的参数为object时,通过传递的不同参数,在显示单页面内通过v-if判断显示出对应的内容(可实现多页面效果)

    通过uni-app中当uni.navigateTo传的参数为object时,通过传递的不同参数,在显示单页面内通过v-if判断显示出对应的内容(可实现多页面效果) 起始页跳转到对应页面,并传递参数(o ...

  5. uni-app中websocket的使用 断开重连、心跳机制

    前言 最近关于H5和APP的开发中使用到了webSocket,由于web/app有时候会出现网络不稳定或者服务端主动断开,这时候导致消息推送不了的情况,需要客户端进行重连.查阅资料后发现了一个心跳机制 ...

  6. 如何在Uni-app中通过腾讯IM SDK实现社交应用和直播互动等功能

    Uni-app想开发社交应用.IM.店铺客服.嵌入式社交模块.在线直播互动,这些功能Uni-app官方也没提供SDK,怎么办呢?找IM老大腾讯云啊,今天我们就在Uni-app中把腾讯云即时通讯TXIM ...

  7. uniapp中拿到base64转blob对象,或base64转bytes字节数组,io操作写入字节流文件bytes

    1. uniAPP中拿到附件的base64如何操作,如word文件 /*** 实现思路:* 通过native.js的io操作创建文件,拿到平台绝对路径* 再通过原生类进行base64解码,拿到字节流b ...

  8. eslint配置介绍-如何在uniapp中配置eslint

    eslint uniapp-eslint及vue-eslint配置 ESLint 是一个开源的 JavaScript 代码检查工具.可以让程序员在编码的过程中发现问题而不是在执行的过程中. 1. es ...

  9. uni-app 中实现 onLaunch 异步回调后执行 onLoad 最佳实践

    前言 好久没写博客了,由于公司业务需要,最近接触uiapp比较多,一直想着输出一些相关的文章.正好最近时间富余,有机会来一波输出了. 问题描述 在使用 uni-app 开发项目时,会遇到需要在 onL ...

随机推荐

  1. 什么,你还使用 webpack?别人都在用 vite 搭建项目了

    一.vite 到底是干嘛的? vite 实际上就是一个面向现代浏览器,基于 ES module 实现了一个更轻快的项目构建打包工具. vite 是法语中轻快的意思. vite 的特点: 1.轻快的冷服 ...

  2. UML快速概述 - All you need to know about UML

    UML 是统一建模语言的缩写,就像使用一组图表来可视化软件建模的蓝图(或设计计划).它不仅可以让您彻底评估整个概念,还可以确保团队中的每个人都在同一页面上.   UML 图可以组织成两个不同的组. 结 ...

  3. 计算机网络:HTTP

    计算机网络基础:HTTP 先验知识 HTTP和其他协议的关系 通过下图,了解IP协议,TCP协议,DNS服务在使用HTTP协议通信过程中各自发挥的作用: 服务器处理流程 接受客户端连接 ------& ...

  4. 第31篇-方法调用指令之invokevirtual

    invokevirtual字节码指令的模板定义如下: def(Bytecodes::_invokevirtual , ubcp|disp|clvm|____, vtos, vtos, invokevi ...

  5. 【二食堂】Beta - Scrum Meeting 7

    Scrum Meeting 7 例会时间:5.19 18:30~18:50 进度情况 组员 当前进度 今日任务 李健 1. 文本区域的前后端对接完成,bug已经修复issue2. 自定义关系的添加与删 ...

  6. the Agiles Scrum Meeting 4

    会议时间:2020.4.12 20:00 1.每个人的工作 今天已完成的工作 yjy:基本完成广播功能,修复bug issues:小组任务1-增量开发组 Bug:冲刺 wjx:继续实现注销功能的后端 ...

  7. 创建线程 出现SIGSEGV crash

    在Opwrt平台上测试ok的一个网络传输延时测试demo程序移植到Android平台后,运行出现莫名其妙的SIGSEGV crash. 仔细检查过源码,特别是指针等后未发现问题. --------- ...

  8. 转载: XILINX GT的基本概念

    https://zhuanlan.zhihu.com/p/46052855 本来写了一篇关于高速收发器的初步调试方案的介绍,给出一些遇到问题时初步的调试建议.但是发现其中涉及到很多概念.逐一解释会导致 ...

  9. Luogu P1084 疫情控制 | 二分答案 贪心

    题目链接 观察题目,答案明显具有单调性. 因为如果用$x$小时能够控制疫情,那么用$(x+1)$小时也一定能控制疫情. 由此想到二分答案,将问题转换为判断用$x$小时是否能控制疫情. 对于那些在$x$ ...

  10. Swift-技巧(一)缩放并填充图片

    摘要 直接操作图片来实现它的缩放或者填充多余空间,首选 UIGraphicsBeginImageContext 函数来实现,它就相当于一个画布,你甚至可以用它来涂鸦. 最近有一个需求,就是将图片先等比 ...