物联网仿真系统基于MQTT实现微信小程序开发

恒网迅通

已于 2024-08-23 17:12:25 修改

阅读量139

点赞数 2

分类专栏：虚拟仿真系统文章标签：物联网

于 2024-08-23 16:32:05 首次发布

版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。

本文链接：https://blog.csdn.net/lin_yu_cheng/article/details/141468785

版权

虚拟仿真系统专栏收录该内容

3 篇文章 0 订阅

订阅专栏

在当今这个数字化与智能化飞速发展的时代，物联网（IoT）技术作为连接物理世界与数字世界的桥梁，正逐步渗透到我们生活的方方面面。从智能家居到智慧城市，从工业控制到农业监测，物联网技术的应用极大地提升了生产效率和生活质量。而MQTT（Message Queuing Telemetry Transport）作为一种轻量级的消息传输协议，因其高效、可靠、易于实现的特点，在物联网领域得到了广泛应用。

在这里插入图片描述

前言

本章讲解的是通过MQTT读取物联网虚拟仿真系统设备数据，开发微信小程序作为用户交互界面，让用户能够轻松实现对仿真设备的远程控制与数据读取

在这里插入图片描述

01

接线组成系统

拉入温湿度传感器，光照度传感器，PM2.5传感器，风扇，灯泡，LED屏，窗帘和网关，并接好线。

在这里插入图片描述

02

虚拟仿真系统MQTT模式

登录物联网虚拟仿真客户端，开启MQTT模式

在这里插入图片描述

打开模拟实验后，连接虚拟仿真系统的服务器和用户名密码，主题自拟。

在这里插入图片描述

03

虚拟仿真系统MQTT测试

一、建立通信，创建主题打开MQTTX进行测试，新建连接

在这里插入图片描述

添加订阅，推送主题和订阅主题

在这里插入图片描述

二、读取与控制查看订阅消息

在这里插入图片描述

上发消息至虚拟仿真系统实现控制（此时控制灯泡亮起）

在这里插入图片描述

04

虚拟仿真系统MQTT测试

一、导入MQTT库,了解前端三剑客创建好项目后，找到创建项目的目录，进入utils文件将MQTT库导入。

在这里插入图片描述

前端三件套（JS,WXSS或CSS,WXML或HTML）文件

在这里插入图片描述

二、设计页面 wxml创建组件组件，以及设计组件结构

在这里插入图片描述

wxss进行布局调整外观文本和按钮可以自由调整

在这里插入图片描述

wxss进行布局调整外观文本框和滑杆都为容器，设定为居中

在这里插入图片描述

三、js进行MQTT通信订阅与发送第一步：调用MQTT库

在这里插入图片描述

第二步：连接MQTT

在这里插入图片描述

第三步：订阅虚拟仿真推送主题，并打印出来

在这里插入图片描述

第四步：解析JSON数值，并打印出来

在这里插入图片描述

在这里插入图片描述

第五步：实现控制

灯泡，风扇控制

在这里插入图片描述

实现LED屏文本输出

在这里插入图片描述

窗帘控制（滑动条）

在这里插入图片描述

05

演示效果

在这里插入图片描述

关注

2
点赞
踩
2

收藏

觉得还不错? 一键收藏
0
评论
物联网仿真系统基于MQTT实现微信小程序开发

本章讲解的是通过MQTT读取物联网虚拟仿真系统设备数据，开发微信小程序作为用户交互界面，让用户能够轻松实现对仿真设备的远程控制与数据读取
复制链接

扫一扫

专栏目录

评论

被折叠的条评论为什么被折叠?

到【灌水乐园】发言

查看更多评论

添加红包

成就一亿技术人!

hope_wisdom

发出的红包

实付元

使用余额支付

点击重新获取

扫码支付

钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。