在电子中使用MQTT.js(节点包)更新dom

Question

我是电子和node.js的新手，在mqtt上工作以更新DOM。我在mqtt上收到消息到我的main.js onmessage函数，我的main.js是

const { app, BrowserWindow } = require('electron')
var mqtt = require('mqtt')
var client = mqtt.connect("mqtt://localhost")
client.on("connect", function(){
client.subscribe("testtopic")
})
client.on("message", function(topic, message, packet){
document.getElementById("someId").innerHTML = message
})
function createWindow () {
const win = new BrowserWindow({webPreferences:{nodeIntegration: true}})
win.loadFile('index.html')
win.maximize()
}
app.whenReady().then(() => {
createWindow()
})

我想从我的onmessage回调中更新index.html中可用的元素。我无法访问它显示错误文档没有定义。如何实现这一点，或者我可以在我的index.html脚本中直接导入mqtt ?在这种情况下，为什么要使用node mqtt，我可以使用paho mqtt。请给出建议。

Answer 1

代码在"后端"不在浏览器中，因此无法访问DOM。

如果您希望更新DOM以响应MQTT消息，您有两个选择。

1. 在index.html文件中通过WebSockets实现MQTT，该MQTT将直接在页面中订阅代理，并将直接访问DOM。您可以在页面中使用MQTT.js或Paho客户端，但是您将需要一个专门配置为通过WebSockets支持MQTT的代理。

2. 看看在后端代码和加载的页面之间建立一些直接连接，下面的问题可能会对一些指针有所帮助:如何在电子中访问DOM元素?