uniapp开发微信小程序连接mqtt
2023-06-13 09:15:55 时间
下载mqtt
npm i mqtt@2.18.8
存储mqtt客户端到vuex
// mqtt module
import mqtt from 'mqtt'
const CONNECT_MQTT = 'CONNECT_MQTT'
const SERVER_IP = ''
const SERVER_PORT = ''
const SERVER_PATH = 'mqtt'
// 连接地址
const SERVICE = `${SERVER_IP}:${SERVER_PORT}/${SERVER_PATH}`
// 连接配置项
const options = {
wsOptions: {},
protocolVersion: 4, //MQTT连接协议版本
keepalive: 60,
clean: true,
clientId: CLIENT_ID,
reconnectPeriod: 1000, //1000毫秒,两次重新连接之间的间隔
connectTimeout: 30 * 1000,
resubscribe: true ,//如果连接断开并重新连接,则会再次自动订阅已订阅的主题(默认true)
}
const state = () => ({ mqttClient: null })
const actions = {
[CONNECT_MQTT]({ commit, state }) {
// 连接mqtt 监听常用事件
let client = mqtt.connect('wx://' + service + options)
client.on('connect', () => {
}).on('error', () => {
}).on('reconnect', () => {
}).on('message', () => {
}).on('close', () => {
})
commit(CONNECT_MQTT, client)
}
}
const mutations = {
[CONNECT_MQTT](state, client) {
state.mqttClient = client
}
}
根组件中连接mqtt
import { mapActions } from 'vuex'
import { CONNECT_MQTT } from '@/store/actionTypes'
export default {
onLaunch: function() {
this.CONNECT_MQTT()
},
methods: {
...mapActions('mqtt', [CONNECT_MQTT])
}
}
相关文章
- 【愚公系列】2022年09月 微信小程序-获取WIFI信息
- 微信小程序提交订单支付
- 基于微信小程序云开发(校园许愿墙app)2.0稳定版,以发布上线
- 微信小程序函数处理之保姆级讲解
- 【说站】字体设计符号组合多功能微信小程序源码
- 【说站】微信头像制作小程序源码 微信流量主系列
- 微信开发步骤_微信小程序快速入门
- 微信小程序官方组件展示之画布canvas源码
- 微信小程序设置全局分享
- jboss安装与配置_微信最新版下载并安装
- tmTypecho---基于微信小程序weTypecho的版本进行魔改
- AI爽文创作微信小程序来了,网友:算法菜鸡回到清朝当一品大员
- 微信小程序显示用户搜索历史记录功能实现
- 微信小程序中的支付宝支付
- 手把手教你用 SpringBoot 开发微信公众号后台
- 开发一个微信小程序(6):查询天气-添加最近3日天气
- 开发一个微信小程序(7):查询天气-添加热门城市
- 在微信小程序上做一个「博客园年度总结」:解决前端获取接口数据太慢的一种思路
- 傻妞插件-千寻对接傻妞微信机器人框架详细教程
- 微信终端跨平台组件 mars 系列(二) - 信令传输超时设计
- 微信小程序直播开发实战
- ChatGPT如何接入到微信公众号支持国内服务器
- 微信小程序开发—小程序对接Django—6详解手机开发
- 微信小程序 wx.navigateTo无法 跳转的原因详解手机开发
- 微信小程序:全局配置app.json详解编程语言
- 的应用Linux下的微信:新的通讯方式(微信linux)
- 微信小程序实现Redis连接新技术的开启(微信小程序连接redis)
- 微信世界的8亿子民:你的父母如何躲过谣言,你的亲人怎样不受传销欺骗?
- 手续费提价谁的锅?微信、民生银行争锋相对
- 微信游戏打飞机游戏制作(java模拟微信打飞机游戏)