MQTT a través de WebSocket en una aplicació React

Bloc

MQTT a través de WebSocket en una aplicació React

Recentment he hagut d'utilitzar MQTT a través de WebSocket en una aplicació web React per obtenir una ubicació en directe d'una API. Aquí teniu la meva solució. He intentat que el mòdul MQTT sigui el més funcional possible.

El mòdul de servei MQTT

He utilitzat el paquet mqtt npm, amb el qual podeu instal·lar npm instal·lar mqtt comandament. Aquest és el mòdul MQTT que he creat:

import mqtt from 'mqtt'; const websocketUrl = 'wss://:443/mqtt'; const apiEndpoint = '/'; function getClient(errorHandler) { const client = mqtt.connect(websocketUrl); client.stream.on('error', (err) => { errorHandler(`Connection to ${websocketUrl} failed`); client.end(); }); return client; } function subscribe(client, topic, errorHandler) { const callBack = (err, granted) => { if (err) { errorHandler('Subscription request failed'); } }; return client.subscribe(apiEndpoint + topic, callBack); } function onMessage(client, callBack) { client.on('message', (topic, message, packet) => { callBack(JSON.parse(new TextDecoder('utf-8').decode(message))); }); } function unsubscribe(client, topic) { client.unsubscribe(apiEndpoint + topic); } function closeConnection(client) { client.end(); } const mqttService = { getClient, subscribe, onMessage, unsubscribe, closeConnection, }; export default mqttService;

#react # mqtt-client #javascript

levelup.gitconnected.com

MQTT a través de WebSocket en una aplicació React

Recentment he hagut d'utilitzar MQTT a través de WebSocket en una aplicació web React per obtenir una ubicació en directe d'una API. Aquí teniu la meva solució. He intentat que el mòdul MQTT sigui el més funcional possible. El mòdul de servei MQTT he utilitzat el paquet mqtt npm, que podeu instal·lar amb l'ordre npm install mqtt. Aquest és el mòdul MQTT que he creat: