Getting Started with ESP8266 and MQTT

Being able to control an Arduino remotely really ups our automation game. In the beginning, it was buttons and potentiometers and from there, we graduated to Infra Red remote control.

With the widespread availability of IoT (Internet of Things) functionality, we now have Internet connectivity to our Arduino compatible microcontrollers. One method is to setup our Arduino as a web server, and Jason Coon’s ESP8266 webserver is a prime example.

Another option is a messaging protocol called MQTT (Message Queuing Telemetry Transport) which provides a lightweight method of controlling IoT devices, and in this case an ESP8266 based microcontroller.

This tutorial goes through the steps of setting up an Android phone and an ESP8266 based WeMOS D1 Mini with MQTT controls to turn the internal LED of the ESP8266 on and off.

The WeMOS D1 Mini is available on Amazon or aliexpress for betwee $2 to $5.

WeMOS D1 Mini features include:

• Gnd
• 3.3V
• Tx/Rx
• 1 – Analog input
• 11 – Digital I/O
• 4MB Flash
• WiFi @ 2.4GHz

Setting up the WeMOS D1 Mini

There are several tutorials online for installing an ESP8266 board, which is basically:

1. Start Arduino and open Preferences window.
2. Enter https://arduino.esp8266.com/stable/package_esp8266com_index.json into Additional Board Manager URLs field. We can add multiple URLs, separating them with commas.
3. Open Boards Manager from Tools > Board menu and find esp8266 platform.
4. Select the version we need from a drop-down box.
5. Click install button.
6. Don’t forget to select our ESP8266 board from Tools > Board menu after installation.

MQTT Overview (from mqtt.org)

MQTT stands for Message Queuing Telemetry Transport. It is a publish/subscribe, extremely simple and lightweight messaging protocol, designed for constrained devices and low-bandwidth, high-latency or unreliable networks. The design principles are to minimize network bandwidth and device resource requirements whilst also attempting to ensure reliability and some degree of assurance of delivery.  MQTT uses a server (or broker) to relay information to/from MQTT client devices, such as an Arduino or other Internet enabled control panel.

We can setup an MQTT messaging networking without any web components, such as HTML/CSS/Javascript and so on.

Here is an example of several MQTT clients sending and receiving information to/from an MQTT Broker:

Transmitted information takes the form of a Topic that we can publish or subscribe to along with a Payload that contains the information published.

Topics are in character format and could be:

• LED
• Lights/LED1
• Home/Bedroom/Light

The payload is in a byte format and can contain numeric values as well as character information. Sample payload could be:

• 0, 1
• 0 through 255
• On, Off
• {name: “John”, age: 31, city: “New York”}

When a payload is received, it is accompanied by a length value and can then be converted to an appropriate format such as a string or an integer, or deserialized with a JSON routine as in the case with the last example.

Downloading MQTT for Android

To demonstrate this, we’ll need to download an MQTT client as well as a broker. In this case, we’ll use these two Android applications for this demonstration:

• IoT MQTT Panel
• Mqtt Broker App

Setting up Networking

Before configuring the broker and client, we need to decide which network configuration we’ll be using. For the sake of portability, and consistency, I’ll setup my Android phone as a wifi hotspot. In doing so, it will always disable the wifi client and assign itself an IP address of 192.168.43.1. The phone will then assign IP addresses from 192.168.43.2 to 192.168.43.254 (I think) for our connected devices, such as ESP8266’s when they are connected to this network. 

Set that up and document the SSID and password/key, which will be used in our Arduino sketch:

Configuring the MQTT broker

Download the ‘MQTT Broker’ application from the Android store and:

1. Configure it with authentication.
2. Set the username and password.
3. Default TCP port is 1883.
4. Save the configuration.
5. If wifi is already running, then we can start the broker.

Once we have configured the broker, saved the configuration and started the broker on the phone, we should see an IP address of 0.0.0.0.

The next time we want to run the MQTT broker:

• Start the wifi hotspot.
• Run the MQTT broker application.
• Load the confguration.
• Start the Broker.

Configuring IoT MQTT Panel

This is the application that we use to control our ESP8266. In this case, we’re going to configure a simple control panel for the first example:

mqtt-LED-synchronous.ino

Once we have our network and MQTT broker configurations documented, we can then move onto the MQTT device to be managed and data to be exchanged. We’ll define a device by the name of LED and then define the topic and payload message to be transmitted.

For this example, we’ll  use a topic of:

• LED1

The payload will either be:

• 0 or 1

First, we need to configure our Control Panel with the following information:

• Connection name (such as the broker we’re talking to).
• Client ID (can be left blank and will be automatically filled in).
• IP Address of the broker (my phone), which is 192.168.43.1.
• TCP Port number and protocol. Typically port 1883 and TCP.
• We need to add an initial device which we can call ‘LED’.
• Under advanced options, we need to add our Username and Password to connect to the broker.

Once we’ve saved this, we can then edit our initial device and add a widget that will be configured to publish a Topic and Payload. When the widget is activated, it will publish the Topic/Payload, which will then be picked up by our ESP8266 running the MQTT sketch.

1. Click on ‘My Phone’.
2. Click on ‘Add Panel’.
3. Select ‘Switch’.

Once we have selected switch, we can then add the Topic and Payload information:

Once saved, we should see the following, as long as:

1. Tethering on our phone is running.
2. We have loaded our MQTT Broker Configuration.
3. We have started the MQTT Broker on our phone.
4. Then pressed the round connect button in the top right of the screen.

Now, we should be able to compile mqtt-LED-synchronous.ino on our ESP8266.

It took me several tries to get it all working, so we need to make sure we perform everything in correct order. If it’s all configured and running correctly, we should be able to turn the internal LED of our ESP8266 off and on by repeatedly pressing the switch widget.

Oh, and I had to unplug and plug the ESP8266 back into the USB port in order to get the wifi running and to wait a minute or so for it to initialize.

Scaling Up

In my case, I have several different types of lanterns, such as mqtt-fire2012 lanterns, mqtt-mesh lanterns and more. To control all of these lanterns, I give each type a unique device ID as well as a a separate topic prefix for each family of devices. I’ll then use a combo box widget to select 1 or all of the lanterns within that device type to control. Configuring Topic Prefixes is discussed in the following article: