Applicazione interattiva e completamente visiva che simula il funzionamento del protocollo MQTT. Questa applicazione è costruita con React e permette di:
- Creare Client: Puoi aggiungere sensori (Publisher) o dispositivi di monitoraggio (Subscriber).
- Impostare Topic: I client comunicano solo se i Topic corrispondono (supporta anche la wildcard
#). - Visualizzare il flusso: Quando invii un messaggio, vedrai l’animazione del pacchetto dati viaggiare dal Publisher al Broker, e dal Broker ai Subscriber pertinenti.
Come usare il simulatore:
- Clicca su “Invia Dati” in un riquadro Publisher (a sinistra).
- Osserva il pacchetto (pallino colorato) viaggiare verso il Broker centrale.
- Il Broker smista il messaggio.
- Se un Subscriber (a destra) è iscritto a quel Topic, riceverà il messaggio.
- Prova a cambiare i Topic per vedere come il Broker filtra i messaggi.
Come funziona questa simulazione
Ho progettato l’interfaccia per riflettere i 3 componenti principali del protocollo MQTT:
- I Publisher (Sinistra):
- Rappresentano sensori IoT o dispositivi che generano dati (es. un termometro o un interruttore della luce).
- Hanno un campo Topic. In MQTT, i messaggi non vengono inviati a un IP specifico, ma a un “argomento” (es.
casa/salotto/temp). - Hanno un campo Payload (il dato vero e proprio).
- Il Broker (Centro):
- È il server postale. Nella simulazione, non fa nulla finché non riceve un pacchetto.
- Quando riceve un messaggio (indicato dall’animazione del pacchetto in arrivo), consulta la sua lista interna per vedere “Chi è interessato a questo topic?”.
- Se trova corrispondenze, clona il messaggio e lo spedisce ai destinatari.
- I Subscriber (Destra):
- Rappresentano dashboard, app mobile o server di log.
- Ascoltano passivamente. Se il loro Topic Sottoscritto corrisponde al messaggio in arrivo, si illuminano e mostrano il dato.
- Wildcard: Ho implementato la logica della wildcard
#. Se imposti il topic di un Subscriber su#(come ho fatto di default per il “Server Logger”), esso riceverà tutti i messaggi, indipendentemente dal topic specifico.
Esperimenti da provare:
- Invia un messaggio dal Termometro (Topic:
casa/salotto/temp). Vedrai reagire sia il Tablet (che ascolta esattamente quel topic) sia il Logger (che ascolta tutto). - Crea un nuovo Publisher con un topic inventato (es.
giardino/irrigazione). Invia un messaggio. Vedrai il messaggio arrivare al Broker, ma il Broker lo scarterà (o lo manderà solo al Logger) perché il Tablet non sta ascoltando il canale “giardino”. - Cambia il topic del Tablet in
casa/#. Ora riceverà dati sia dalla cucina che dal salotto.