Simple MQTT Client for Android

Repository del progetto su GitHub: 
https://github.com/emanbuc/Ionic_MQTT_Client

Il protocollo MQTT permette di connettere dispositivi IoT agli hub senza utilizzare i client sviluppati dai diversi produttori. Il protocollo MQTT può essere utilizzato in dispositivi IoT di ogni tipo grazie alle numerose implementazioni del protocollo disponibili praticamente per tutte le piattaforme di sviluppo e per tutti i diversi linguaggi di programmazione. Inoltre per i microcontrollori con risorse limitate tipo Arduino, ESP8266 STM32, ecc… il protocollo MQTT rappresenta molto spesso il metodo di connessione migliore tra quelli disponibili.

MQTT Broker

Esistono diversi broker MQTT gratuiti. Alcuni sono già operativi online, mentre altri devono essere installati su un server per poterli utilizzare. Per fare qualche prova è possibile utilizzare broker MQTT gratuito pubblico offerto da http://www.mqtt-dashboard.com/

Per applicazioni più mature si possono utilizzare i gateway MQTT presenti nei servizi Hub dei maggiori produttori. Ad esempio Azure IoT Hub supporta il protocollo MQTT.

MQTT Client su App mobile multipiattaforma

Il protocollo MQTT è implementato in diverse librerie open source.  Volendo realizzare un client multipiattaforma la soluzione più semplice è utilizzare una piattaforma di sviluppo tipo Ionic, Titanium, Xamarin …  Per questo progetto ho scelto di utilizzare Ionic.

A questo punto il passo successivo è trovare una libreria javascript o un plugin Cordova che implementi il protocollo MQTT.

Facendo un po’ di ricerche ho trovato due progetti sembrano interessanti:

Plugin MQTT Cordova

https://github.com/arcoirislabs/cordova-plugin-mqtt
https://www.npmjs.com/package/cordova-plugin-mqtt

Nota: la componente nativa del plugin per adesso è disponibile solo per Android, quindi l’applicazione non funzionerà sulle altre piattaforme. L’autore ha scritto sul sito che il supporto per iOS sarà aggiunto in futuro.

Client MQTT completamente in Javascript:

http://www.eclipse.org/paho/clients/js/ 
https://github.com/eclipse/paho.mqtt.javascript

nota: Questa libreria è la stessa utilizzata per il client web hivemq

App Ionic con plugin Cordova

1._ Creare una nuova applicazione Ionic partendo da uno dei template standard (vedi Ionic Getting Started)

$ npm install -g cordova ionic
$ ionic start myApp tabs

2. Aggiungere plugin MQTT e piattaforma Android

ionic plugin add https://github.com/arcoirislabs/cordova-plugin-mqtt.git
ionic platform add android
ionic build android

3. Aggiungere un client MQTT all’applicazione demo predefinita

Il modo più veloce (anche se poco elegante) per iniziare ad utilizzare il protocollo MQTT è aggiungere alcune funzioni ad uno dei controller giù presenti nell’applicazione predefinita. Il minimo di funzioni che serovno sono:

  • Connessione al broker MQTT
  • Invio di un messaggio
  • Registrazione su un “topic” e gestione evento di ricezione messaggio

Per velocizzare il più possibile lo sviluppo ho aggiunto alcuni pulsanti in fondo alla schermata principale dell’applicazione di esempio creata da Ionic

 

ionic_mqtt_demo
L’applicazione dimostrativa “Tabs” creata da ionic con i nuovi pulsati del client MQTT

Ad esempio questa è una versione molto rudimentale della funzione di connessione al broker:

$scope.connect= function(){
   cordova.plugins.CordovaMqTTPlugin.connect({
     url:"tcp://broker.mqttdashboard.com", //a public broker used for testing purposes only. Try using a self hosted broker for production. 
     port:1883, 
     clientId:"MY_CLIENT_ID_20160814",
     connectionTimeout:3000,
     willTopicConfig:{
       qos:2,
       retain:true,
       topic:"ebtest",
       payload:"Messaggio di prova"
    },
    username:"uname",
    password:'pass',
    keepAlive:60,
    success:function(s){
      console.log("connect success");
    },
    error:function(e){
      console.log("connect error");
    },
    onConnectionLost:function (){
      console.log("disconnect");
    }
 })
 };

Client MQTT Javascript (web client HiveMQ)

Per verificare il corretto funzionamento della nostra app abbiamo bisogno si un altro client connesso allo stesso broker. Oltre al broker, mqttdashboard.com mette a disposizione anche un client di test javascript utilizzabile dalla pagina web http://www.hivemq.com/demos/websocket-client/

Connettendo il client web e la nostra app Android allo stesso “topic” sul broker mqttdashboard.com è possibile verificare se la nostra applicazione sia in grado di  inviare e ricevere correttamente i messaggi.

Test su dispositivo Android

Il plugin Cordova funzionerà solo se la app viene eseguita su un dispositivo Android (o all’interno di un emulatore).  Per test è debug è necessario utilizzare gli strumenti dell’SDK Android.

1)_ Abilitare debug USB su  dispositivo Android 

2) Connettere lo smartphone

3) Attivare modalità USB MTP (sul mio Nexus 5 è necessario farlo altrimenti il debugger non si connette)

3) test connessione dispositivo al debugger:

 

adb device

Lo smartphone dovrebbe comparire nella lista dei dispositivi connessi

adb_devices
Elenco dispositivi Android connessi

4) Esecuzione app sullo smartphone:

ionic run android

L’applicazione viene copiata e lanciata sullo smartphone.

Dopo la connessione il client invia e riceve messaggi pubblicati sul “topic” ebtest. Per testare il corretto funzionamento è sufficiente avviare un altro client e connetterlo allo stesso topic . In questo modo entrambi i client possono pubblicare e ricevere messaggi.

hive_MQ_test
Webclient MQTT connetto al topic “ebtest”
messaggio_da_client_web
L’applicazione dimostrativa “Tabs” creata da ionic modificata per integrare il nostro client minimale MQTT

 

Annunci

Rispondi

Inserisci i tuoi dati qui sotto o clicca su un'icona per effettuare l'accesso:

Logo WordPress.com

Stai commentando usando il tuo account WordPress.com. Chiudi sessione / Modifica )

Foto Twitter

Stai commentando usando il tuo account Twitter. Chiudi sessione / Modifica )

Foto di Facebook

Stai commentando usando il tuo account Facebook. Chiudi sessione / Modifica )

Google+ photo

Stai commentando usando il tuo account Google+. Chiudi sessione / Modifica )

Connessione a %s...