node-red - 如何将 MQTT 数据发布到空白网页
问题描述
我想将通过 MQTT 接收的数据发布到空白 HTML 网页上,以便该网页的唯一内容是通过 MQTT 发送的原始 msg.payload。为此,我创建了以下流程。
我曾尝试使用 GET 和 POST 功能,也尝试过 websocket 功能,但没有运气,我希望有人能告诉我哪里出错了。预期的网页只是显示温度值的网页。
编辑:
解决方案
你似乎很亲近。一种简单的方法如下所示。
首先,将有效负载保存到流上下文变量中。我使用了注入节点,但您将替换为 MQTT 节点。
其次,您在节点中使用 HTTP 来触发将读取流上下文变量的流msg.payload
。
当您将浏览器指向端点/mytemp
时,您将看到温度。
[{"id":"6eba3ed8.e29ba","type":"tab","label":"Flow 4","disabled":false,"info":""},{"id":"a35c9258.340b1","type":"debug","z":"6eba3ed8.e29ba","name":"","active":true,"tosidebar":true,"console":false,"tostatus":false,"complete":"true","targetType":"full","x":570,"y":120,"wires":[]},{"id":"fb8bcf33.015ee","type":"http in","z":"6eba3ed8.e29ba","name":"/mytemp","url":"/mytemp","method":"get","upload":false,"swaggerDoc":"","x":180,"y":220,"wires":[["7bb7b19.2efd75"]]},{"id":"7bb7b19.2efd75","type":"change","z":"6eba3ed8.e29ba","name":"mytemp","rules":[{"t":"set","p":"payload","pt":"msg","to":"mytemp","tot":"flow"}],"action":"","property":"","from":"","to":"","reg":false,"x":340,"y":220,"wires":[["8b54468f.82d758","2b02d89.dfec028"]]},{"id":"8b54468f.82d758","type":"debug","z":"6eba3ed8.e29ba","name":"","active":true,"tosidebar":true,"console":false,"tostatus":false,"complete":"true","targetType":"full","x":550,"y":280,"wires":[]},{"id":"a691c7d8.da5d78","type":"inject","z":"6eba3ed8.e29ba","name":"","topic":"","payload":"21","payloadType":"num","repeat":"","crontab":"","once":false,"onceDelay":0.1,"x":190,"y":120,"wires":[["3af6ea2f.2c0476"]]},{"id":"3af6ea2f.2c0476","type":"change","z":"6eba3ed8.e29ba","name":"flow.mytemp","rules":[{"t":"set","p":"mytemp","pt":"flow","to":"payload","tot":"msg"}],"action":"","property":"","from":"","to":"","reg":false,"x":370,"y":120,"wires":[["a35c9258.340b1"]]},{"id":"2b02d89.dfec028","type":"http response","z":"6eba3ed8.e29ba","name":"","statusCode":"","headers":{},"x":570,"y":220,"wires":[]},{"id":"2f1ab064.3b768","type":"inject","z":"6eba3ed8.e29ba","name":"","topic":"","payload":"33","payloadType":"num","repeat":"","crontab":"","once":false,"onceDelay":0.1,"x":190,"y":160,"wires":[["3af6ea2f.2c0476"]]}]
推荐阅读
- java - 选择 webdriver 中包含文本的任何元素
- php - Laravel 5.8:插入数据库似乎不起作用
- javascript - 使用 Webpack 在开发中运行使用 `fs` 和 `sharp` 的 Next.js 脚本?
- pandas - 时间序列的数据操作
- python - 10,000 项复合的类斐波那契数列
- java - 从 Python 获取数据并使用 Java 和 Thymleaf 进行打印
- reactjs - 在反应中使用 Babel 运行 Webpack 时面临问题
- android - 使用 WordPress REST API 进行 Flutter 分页
- java - 更改移动字体时应用程序字体更改
- android - 我有一个代码,其中检索 json 数据,现在我想处理不同的异常