My static website generator using poole https://www.xythobuz.de
您最多选择25个主题 主题必须以字母或数字开头,可以包含连字符 (-),并且长度不得超过35个字符

mqtt_web.md 1.7KB

title: MQTT Webinterface description: Using Bootstrap and JavaScript for universal controls parent: smarthome position: 400 git: https://git.xythobuz.de/thomas/lights-web github: https://github.com/xythobuz/mqtt-lights-web date: 2022-08-14

comments: true

Both my ESP-Env sensors and actors as well as the Node-RED automation are interfacing to the network using MQTT.

This allows easy control using for example the mosquitto_pub MQTT command line client. With these four commands I’m overriding my Node-RED controlled bathroom light automation.

mosquitto_pub -h $HOSTNAME -u $USERNAME -P $PASSWORD -t bathroom/force_light -r -m none
mosquitto_pub -h $HOSTNAME -u $USERNAME -P $PASSWORD -t bathroom/force_light -r -m big
mosquitto_pub -h $HOSTNAME -u $USERNAME -P $PASSWORD -t bathroom/force_light -r -m small
mosquitto_pub -h $HOSTNAME -u $USERNAME -P $PASSWORD -t bathroom/force_light -r -m off

At the same time the environment sensors also publish their measurements to the corresponding MQTT topics.

To have a central place where these settings can be viewed and changed, not only for me but also for guests, I decided to write a small interactive web interface. It interfaces to the MQTT broker using WebSockets. Unfortunately this only seems to work with Chromium, not Firefox.

You can find the source code on my Gitea. I also added the installation and setup instructions to my ansible scripts.