Heim > Artikel > Backend-Entwicklung > Best Practices für Echtzeit-Datenüberwachung und -visualisierung mit PHP und MQTT
Best Practices für Echtzeit-Datenüberwachung und -visualisierung mit PHP und MQTT
Zusammenfassung:
In diesem Artikel wird vorgestellt, wie Sie PHP- und MQTT-Protokolle verwenden, um Echtzeit-Datenüberwachung und -visualisierung zu implementieren. Wir werden MQTT für die Nachrichtenübermittlung und PHP für die Verarbeitung von Nachrichten und das Rendern von Daten verwenden. Mithilfe der Anleitung in diesem Artikel erfahren Sie, wie Sie ein einfaches Echtzeit-Datenüberwachungssystem aufbauen und die Daten visuell anzeigen.
Einführung:
Mit der Popularisierung des Internets können wir über verschiedene Sensoren und Geräte eine große Menge an Echtzeitdaten erhalten. Wie wir diese Daten überwachen und visualisieren können, damit wir sie besser verstehen und Entscheidungen treffen können, ist zu einer zentralen Frage geworden. Dieser Artikel konzentriert sich auf Best Practices für die Echtzeit-Datenüberwachung und -visualisierung mit PHP und MQTT.
1. Was ist das MQTT-Protokoll?
MQTT (Message Queuing Telemetry Transport) ist ein leichtes, offenes und einfach zu implementierendes Messaging-Protokoll. Es eignet sich für die Übertragung über Netzwerke, geringe Bandbreite und instabile Netzwerkumgebungen und eignet sich sehr gut für IoT-Szenarien. MQTT verwendet ein Publish-Subscribe-Modell zur Übermittlung von Nachrichten, das sich durch geringen Ressourcenverbrauch und geringe Latenz auszeichnet.
2. MQTT-Server erstellen
Bevor wir das MQTT-Protokoll verwenden, müssen wir einen MQTT-Server erstellen. Es stehen viele Open-Source-MQTT-Server zur Auswahl, z. B. Mosquitto, EMQ X usw. Hier nehmen wir Mosquito als Beispiel zur Einführung.
Zuerst installieren Sie den Mosquitto-Server. Sie können es über die Befehlszeile oder die grafische Oberfläche installieren. Informationen zu bestimmten Methoden finden Sie in der offiziellen Dokumentation von Mosquitto. Nachdem die Installation abgeschlossen ist, starten Sie den Mosquitto-Server.
3. Verwenden Sie PHP, um eine Verbindung zum MQTT-Server herzustellen.
Um das MQTT-Protokoll in PHP zu verwenden, müssen wir die MQTT-Client-Bibliothek von PHP verwenden. Hier verwenden wir die Bibliothek phpmqtt/phpmqtt. Sie können diese Bibliothek über Composer installieren:
composer require phpmqtt/phpmqtt
Nach Abschluss der Installation können wir über den folgenden Code eine Verbindung herstellen und das Thema des MQTT-Servers abonnieren:
<?php require("vendor/autoload.php"); use PhpMqttClientMqttClient; $client = new MqttClient("mqtt://localhost:1883"); $client->connect(); $client->subscribe("topic_name", function (string $topic, string $message){ // 处理接收到的消息 // 在这里可以对接收到的消息进行处理,如存储到数据库等 }); while (true) { $client->loop(true); }
Im Code erstellen wir zuerst ein MqttClient-Objekt und dann Verwenden Sie die Verbindungsmethode, um eine Verbindung zum Mosquitto-Server herzustellen. Als nächstes abonnieren wir ein Thema mithilfe der subscribe-Methode. In der Rückruffunktion, die die Nachricht empfängt, können wir die empfangene Nachricht verarbeiten. Abschließend können Sie weiterhin MQTT-Nachrichten abhören, indem Sie die Schleifenmethode in einer Schleife aufrufen.
4. Datenvisualisierung
Sobald wir uns erfolgreich mit dem MQTT-Server verbunden und die relevanten Themen abonniert haben, können wir mit der Visualisierung der Daten beginnen. Hier verwenden wir die Chart.js-Bibliothek zum Rendern von Diagrammen.
Führen Sie zunächst die Chart.js-Bibliotheksdatei ein:
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
Dann erstellen Sie ein Canvas-Element in HTML, um das Diagramm anzuzeigen:
<canvas id="myChart" width="400" height="400"></canvas>
Als nächstes können wir den folgenden Code verwenden, um die Daten abzurufen und das Diagramm darzustellen:
var ctx = document.getElementById('myChart').getContext('2d'); var myChart = new Chart(ctx, { type: 'line', data: { labels: [], // x轴上的标签 datasets: [{ label: '实时数据', // 数据集的标签 data: [], // 数据值 fill: false, // 是否填充 borderColor: 'rgb(75, 192, 192)', tension: 0.1 // 曲线的张力 }] }, options: { responsive: true, animation: false, scales: { x: { display: true // 其他相关配置 }, y: { display: true // 其他相关配置 } } } }); // 定义一个数组,用于存储接收到的数据 var dataArr = []; // 在消息回调函数中更新图表数据 client.subscribe("topic_name", function (topic, message) { var data = parseFloat(message); dataArr.push(data.toFixed(2)); if (dataArr.length > 10) { dataArr.shift(); } // 更新图表数据 myChart.data.labels = Array.from({length: dataArr.length}, (_, i) => i + 1); myChart.data.datasets[0].data = dataArr; myChart.update(); });
Im obigen Code erstellen wir zunächst ein Chart-Objekt und legen den Diagrammtyp auf Liniendiagramm fest. Dann definieren wir ein Array dataArr, um die empfangenen Daten zu speichern. In der Nachrichtenrückruffunktion fügen wir die empfangenen Daten zum dataArr-Array hinzu und aktualisieren die Diagrammdaten. Abschließend aktualisieren wir die Diagrammanzeige, indem wir die Update-Methode aufrufen.
Fazit:
In diesem Artikel haben wir die Best Practices für die Verwendung von PHP- und MQTT-Protokollen vorgestellt, um eine Datenüberwachung und -visualisierung in Echtzeit zu erreichen. Durch den Aufbau eines MQTT-Servers, die Verwendung der PHP-Bibliothek zum Herstellen einer Verbindung zum Server und das Abonnieren von Themen sowie die Verwendung der Chart.js-Bibliothek zum Zeichnen von Diagrammen können wir schnell ein einfaches Echtzeit-Datenüberwachungssystem erstellen und die Daten visuell anzeigen. Ich hoffe, dass dieser Artikel für die Entwicklung der Echtzeit-Datenüberwachung und -visualisierung hilfreich sein wird.
Das obige ist der detaillierte Inhalt vonBest Practices für Echtzeit-Datenüberwachung und -visualisierung mit PHP und MQTT. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!