您可以使用 JavaScript 处理任务。我有使用 JavaScript 在 Django 和 Django-REST 项目中实现 MQTT 协议的经验。你应该在你的前端文件(在我的例子中是 HTML)中嵌入一个 JavaScript 代码块。首先,您应该在文件中调用 Paho-MQTT jQuery 包。
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/paho-mqtt/1.0.2/mqttws31.min.js"></script>
然后添加这段代码。
#parameters
var hostname = "mqtt.eclipse.org"; #There are different brokers. You should enter the broker's hostname.
var port = 80; #The port number can be different based on a TLS or non-TLS connection.
var ClientID = "ClientID_" + parseInt(Math.random()*100);
#Create a client instance
var client = new Paho.MQTT.Client(hostname, Number(port), ClientID);
#Set callback handlers
client.onConnectionLost = onConnectionLost;
client.onMessageArrived = onMessageArrived;
#Connect the client
client.connect(
{onSuccess: onConnect}
);
#Called when client connects
function onConnect() {
#Once a connection has been established, make a subscription and send a message
console.log("onConnect");
client.subscribe("subTopic");
alert("Connected.");
}
#Called when the client loses its connection
function onConnectionLost(responseObject){
if(responseObject.errorCode != 0){
console.log("onConnectionLost:" + responseObject.errorMessage);
}
}
#Called when a message arrives
function onMessageArrived(message) {
console.log("Message arrived: topic=" + message.destinationName + ", message=" + message.payloadString);
if (message.destinationName == "subTopic") {
#Do something
}
通过使用代码,您的应用程序将连接到代理并收听一个或多个主题。这意味着您可以实时获取传感器的数据。这需要在您的硬件设备上发布传感器数据,例如 ESP 模块或 Raspberry PI。
您很可能希望从应用程序向执行器发送命令以打开或关闭它们。为此,您需要从您的应用程序中发布一些您的硬件将收听的消息。
假设您有一个切换开关,您想通过切换它来发布消息。
<label id="switch{{ device.unique_id }}" class="switch">
<input id="state{{ device.unique_id }}" type="checkbox" onclick="publish('{{ device.unique_id }}')">
<span class="slider round"></span>
</label>
上面的 HTML 块应该驻留在 django for 块中。然后你应该编写publish onclick 函数来在切换开关时调用它。您可以在下面看到此类函数的示例。
function publish(x) {
if(!client){
return;
}
var status = document.getElementById(x);
if (status.innerHTML == 'ON'){
status.innerHTML = 'OFF';
var message = new Paho.MQTT.Message("TurnOFF");
message.destinationName = "pubTopic";
client.send(message);
} else {
status.innerHTML = 'ON';
var message = new Paho.MQTT.Message("TurnON");
message.destinationName = "pubTopic";
client.send(message);
}
}
x 在发布函数中是嵌入在 HTML 文件中的 id。要接收您发布的消息,您应该在硬件设备上收听特定主题。