美文网首页
topology-vue实现MQTT数据通信(2)

topology-vue实现MQTT数据通信(2)

作者: 喜欢走弯路的人 | 来源:发表于2022-05-19 11:23 被阅读0次

一、设置websocket或mqtt

1、点击画布空白地方,在右边属性面板,设置整个图文属性的“消息通信”

2、mqtt服务器:http://tools.emqx.io/

属性面板中消息通信数据要与mqtt服务器通信数据保持一致,如下图所示:

包括:URL地址,用户名,密码,订阅主题通配符Topics,其中Client ID是自动生成,不需要做配置

设置连接地址、用户名、密码、认证消息 设置订阅主题通配符Topics

二、实现数据通信

topology 是一个挂载在 window 下的对象

设置好连接地址、用户名、密码、订阅主题通配符、认证消息后,在数据初始化时设置:window.topology.data.socketEvent = true  客户端会主动监听服务器消息

当客服端与MQQT服务端连接成功后,可监听数据变化,并对数据进行修改:

window.topology.on('mqtt', (e) => {

  e = JSON.parse(e.message + '');

    console.log(e);

});

实现数据通信

相关文章

网友评论

      本文标题:topology-vue实现MQTT数据通信(2)

      本文链接:https://www.haomeiwen.com/subject/ggkfprtx.html