Mobile app with MQTT backend on Bluemix

This article will show how you can connect your Evothings app to the IBM Bluemix cloud via their MQTT service called IoT Foundation. But let’s start with some background information around protocols. If you are impatient you can skip down!

Protocols overview

In the IoT world there are a few messaging protocols competing for attention, mainly XMPP, CoAP, MQTT, DDS and AMQP. These five different protocols all have their own strengths and weaknesses.

• AMQP is an advanced message queue protocol and is focused on work queues with transactions. It is typically used between servers and not as data collection protocols with the actual IoT devices.
• XMPP is most often used in end user applications for accessing systems, it’s not designed for constrained networking.
• DDS is a data centric broker-less advanced protocol used a lot in the industry for distributed real-time mission critical communication, especially for control. It’s also not specifically designed for many small IoT devices in constrained networks, but rather well defined connected systems with several interconnected parts.
• CoAP and MQTT both deal with actual communication with the IoT devices, typically for collecting data. This means they are both designed to be efficient in low power constrained networking environments.

CoAP is a new IETF standard document transfer protocol that was designed for use with very simple electronic devices, allowing them to interoperate with HTTP. The idea behind CoAP is basically to map HTTP concepts to a binary efficient representation, and run it over UDP to support constrained networks and devices. CoAP also supports multicast and encryption with DTLS (based on TLS). Using HTTP-CoAP gateways IoT devices can be used with REST patterns through regular HTTP making resources available under a URI and accessible through HTTP methods such as GET, PUT, POST, and DELETE.

Before going into MQTT (also see wikipedia) – of the above five protocols CoAP and MQTT are typically the two most interesting protocols to support in Evothings mobile apps and they are complimentary since they differ quite a lot.

This article shows how to get going with MQTT today in Evothings apps using the IBM Bluemix. IoT Foundation service.

Why MQTT is important

MQTT (Message Queue Telemetry Transport) was created 15 years ago and is fairly mature and very simple. It’s a binary publish/subscribe brokered protocol running over TCP using standard SSL for encryption.

There is also a variant of MQTT called MQTT-SN (MQTT For Sensor Networks) which is even more lightweight and can operate over UDP or other network standards like ZigBee. MQTT is an OASIS standard as of version 3.1.1 released in 2014. MQTT-SN is currently not an established standard, but you can read an interesting article here.

MQTT hits a “sweet spot” of being simple while still having a reasonable feature set and working well in constrained networking environments. In combination with MQTT-SN for really constrained devices it fits IoT scenarios really well.

There has however been critique published, and subsequently rebuttals have been made.

From my limited perspective the conclusion is that yes, MQTT is simple, but that is by design. And yes, it can still be improved, perhaps most importantly in error handling and QoS 1/2 functionality. But fact remains – MQTT is the leading open IoT protocol at the moment.

Two client libraries

From Javascript, there are two good MQTT client implementations in JavaScript, the “Paho” library which lives in the Eclipse Paho project and MQTT.js hosted and maintained on github. Both support the latest version of MQTT 3.1.1 and thus also websockets.

In this article we are using the Paho library and will probably try the other library in the followup article.

The Painter Example

Our example app is a trivial interactive painting app where the paint operations are shared over MQTT. Each user connects and subscribes to the same topic – and when a user is painting with the finger on the canvas we publish a simple JSON payload describing a painted line from (x,y) to (x2,y2) in a specific color, for each touchmove event.

When the app receives messages it paints them. Note that even the original painter will only paint the line when it’s received as a message. This means as the active painter you get a sense of the latency involved.

The app uses the MQTT server at IBM Internet Of Things Foundation, or IBM IoTF for short. This is IBM’s backbone for their IoT cloud services and it is included in IBM’s Bluemix platform. Below I will describe how you can sign up and get a 30 day test period for free without entering any credit card.

Get a Bluemix Account

After Feb 8th 2016 when my Bluemix trial account expires :) you will not be able to run the app out-of-the-box against my account. So if you want to try this with your own Bluemix or if it’s after february, you need to do the following to get signed up with Bluemix and get an MQTT service up and running:

• Sign up here.
• Then confirm your email by clicking the link in the email you got, and if you end up on the Bluemix login pageyour email address is your login id.
• When logged in, click “CATALOG” in the top menu. Then check the “Internet of Things” checkbox under Services in the left side filter. Then click on Internet of Things Foundation.
• With the Free plan selected etc, just press “CREATE” on the far right side. This will create the IoTF service for you and when you get back to the dashboard you should see 1 service.
• Now, clicking on the IoTF service you find some “steps” to follow, click the “Launch dashboard” box. Now you have arrived at the dashboard for the MQTT service itself.
• At the top you can see “Organization ID: xxxx”.Take note of that id, we will enter it into the application below.
• Now we need to generate an API key. Click on the “Access” tab. Then click on “API Keys”. Finally click on “Generate API Key” shown at the bottom. Copy the information shown and save it somewhere.

Ok, now we have a user and password we can use in our mobile app to connect to the MQTT server.

Running the app

Now let’s get our app running. I presume you have gotten started with Evothings Workbench, then you just need to:

• Git clone our demo repository to your laptop, or just download and unzip it.
• Locate the folder mqtt-bluemix-painter and drag the index.html file from there and drop it onto the “My Apps” tab in the Workbench. It should then be added to the list.

Before starting the app you need to edit it and enter proper credentials if you signed up for your own Bluemix account above. Open the app.js file and modify lines 10-13 in app.js with the correct settings:

var orgId = '8q7k23'; 
// This is your organization id in your Bluemix account

var userName = 'a-8q7k23-r3eqe3bunc'; 
// This is the API key from the IoTF service

var password = 'W5UlH3X7-)v8F-ngD7';  
// This is the authentication token for the key

Now if your Workbench is connected with one or more devices you should be able to just click the RUN button to get the app started.

The app should hopefully say “Connected!” on your device. Feel free to use the “CONNECT” button to reconnect if you are disconnected, at the moment the example does not try to keep the connection alive via ping. You can also open up the Javascript Workbench using the top right Tools-button. This enables you to see what the app is logging when its running.

Now start painting with your finger, each connected device should paint its own color.

Conclusion

Using MQTT is easy and the publish/subscribe model often fits IoT scenarios nicely. When running with the Paho library against Bluemix I have noticed it sometimes fails to connect giving the error message AMQJS0008I Socket closed. I suspect that it may be a timing issue in the secure websocket handshake.

Hope you found this article interesting, download Evothings Studio today and start hacking your own MQTT powered app!