PublishAndSubscribe < AFNOG

Tags: view all tags

%SLIDESHOWSTART%
---+ Setting up and !IoT
<h1 align="center">Session 4: Sending real measurement data to Cayenne and</h1> <h1 align="center">receiving commands and executing them on the hardware</h1> <h1 align="center">Uli Raich</h1> <h1 align="center">formally CERN, Geneva, Switzerland</h1>

---++ 
---+ The Cayenne MQTT protocol

In the last lecture we have seen the command message sent by Cayenne:
| <img alt="cayenneCmdMsg2.png" height="340" src="%ATTACHURL%/cayenneCmdMsg2.png" title="cayenneCmdMsg2.png" width="566" /> | <img alt="cayenneCredentialsCmp.png" height="444" src="%ATTACHURL%/cayenneCredentialsCmp.png" title="cayenneCredentialsCmp.png" width="776" /> |
At first glance the Cayenne message looks pretty unreadable but comparing it to the Cayenne credentials gives us some insight
---++ 
---+ Trying the protocol with MQTTfx

The MQTTfx client allows you to <br /><br />
   * manually configure a Cayenne client creating a connection profile. <br /><br />This profile contains the Cayenne credentials<br /><br />
      * Cayenne user name<br /><br />
      * Cayenne password<br /><br />
      * Cayenne client_id<br /><br />
   * connect to the Cayenne MQTT broker at mqtt.mydevices.com
   * publish messages in Cayenne MQTT format
   * Subscribe to and receive Cayenne cmd messages and answer them
---++ 
---+ Starting MQTTfx

<img alt="mqttfxBaseWindow.png" height="547" src="%ATTACHURL%/mqttfxBaseWindow.png" title="mqttfxBaseWindow.png" width="862" />

---++ 
---+ Setting up the profile

<img alt="mqttfxCredentials.png" height="507" src="%ATTACHURL%/mqttfxCredentials.png" title="mqttfxCredentials.png" width="838" />

---++ 
---+ Copy Cayenne credentials

<img alt="mqttfxcredFromCayenne.png" height="839" src="%ATTACHURL%/mqttfxcredFromCayenne.png" title="mqttfxcredFromCayenne.png" width="1123" />

---++ 
---+ Connecting to Cayenne

Once the profile is created you can connect to Cayenne with the “connect” button.<br /><br />You should see the “offline” note in on your Cayenne device page go away<br /><br />Once connected we can start sending messages to Cayenne

---++ 
---+ Publish a message on Cayenne

Cayenne MQTT expects topics of the following form:<br /><br />v1/username/things/clientID/data/channel<br /><br />This tells Cayenne that “data” are going to be sent. <br /><br />Replace “username” with your Cayenne user name and<br /><br />“clientID” with the client ID of your device <br /><br />We will send dummy temperature data to channel 0.<br /><br />Therefore “channel” must be replaced by “0”.

---++ 
---+ The payload

The payload (the actual data) has the following form:<br /><br />type,unit=value<br /><br />In our case:<br /><br />Type (temperature): temp<br /><br />Unit (Celsius): c<br /><br />Value: 29.3 (typical Ugandan temperature)<br /> <br />Our payload therefore becomes:<br /><br />Temp,c=29.3

---++ 
---+ Publish the data message

<img alt="mqttfxPublish.png" height="460" src="%ATTACHURL%/mqttfxPublish.png" title="mqttfxPublish.png" width="986" />

---++ 
---+ MQTTfx data seen in Cayenne

<img alt="mqttfxPubCayenne.png" height="839" src="%ATTACHURL%/mqttfxPubCayenne.png" title="mqttfxPubCayenne.png" width="1123" />

---++ 
---+ Subscribing to cmd messages

In order to see the command messages e.g. those<br /><br />sent by the push button we must first subscribe to them. <br /><br />The format of a subscription is:<br /><br />v1/username/things/clientID/cmd/channel<br /><br />Since our push button is connected to channel 3<br /><br />this is what we define as channel<br />.<br />v1/88253c70-76e9-11e9-9636-f9904f7b864b/things/<br />1ce44ea0-76ea-11e9-b4eb-6bf2c2412b24/cmd/3

---++ 
---+ Subscribing in MQTTfx

<img alt="mqttfxSubscribe.png" height="460" src="%ATTACHURL%/mqttfxSubscribe.png" title="mqttfxSubscribe.png" width="986" />

---++ 
---+ Clicking the button

<img alt="mqttfxCmd.png" height="690" src="%ATTACHURL%/mqttfxCmd.png" title="mqttfxCmd.png" width="1187" />

---++ 
---+ Cayenne is waiting for a response

<img alt="mqttfxWaiting.png" height="774" src="%ATTACHURL%/mqttfxWaiting.png" title="mqttfxWaiting.png" width="1108" />

---++ 
---+ Treating the command

Normally we would treat the command by acting on the hardware.<br /><br />If this was successful we would inform Cayenne that the new value was set:<br /><br />Format:<br /><br />v1/88253c70-76e9-11e9-9636-f9904f7b864b/things/<br />1ce44ea0-76ea-11e9-b4eb-6bf2c2412b24/data/3<br /><br />and the topic would be the new value: in this case: 1

---++ 
---+ Sending the response

<img alt="mqttfxResponse.png" height="440" src="%ATTACHURL%/mqttfxResponse.png" title="mqttfxResponse.png" width="934" />

---++ 
---+ The switch shows “on”

<img alt="mqttfxButtonOn.png" src="%ATTACHURL%/mqttfxButtonOn.png" title="mqttfxButtonOn.png" />

---++ 
---+ The Cayenne MQTT client

With this information we understand how the Cayenne MQTT client works:<br /><br />
   * In its begin method it gets the Cayenne credentials and saves them<br /><br />
      * It sets up a root topic string<br /><br />self.rootTopic = "v1/%s/things/%s" % (username, clientid)<br /><br />
      * It connects to !WiFi and then to the Cayenne MQTT <br /><br />broker using the tcp protocol<br /><br />
      * It subscribes to the cmd topic
---++ 
---+ Cayenne MQTT client publish

When you publish measurement data with<br /><br />
   * celsiusWrite(channel,value)
   * humidityWrite(channel,value)
   * hectrPascalWrite(channel,value)
   * etc.
The root topic string is completed to a full data topic including the channel information<br /><br />The corresponding data type and the unit (this information is hard coded into the call:

for celsiusWrite the data type is “temp” and the unit is “c”)

as well as the value as used to create the payload string<br />This information is published

---+ Measurement types

A big number of data types is defined in the Cayenne MQTT protocol<br />Have a look at the docs under”Supported data types”:

https://mydevices.com/cayenne/docs/cayenne-mqtt-api/#cayenne-mqtt-api-mqtt-messaging-topics <br /><br />

Only the most basic ones are implemented in our client:

<img alt="cayenneDataTypes.png" height="165" src="%ATTACHURL%/cayenneDataTypes.png" title="cayenneDataTypes.png" width="494" />

---++ 
---+ Measurement units

The same is true for the units, here are the ones defined in the client:

<img alt="cayenneUnits.png" height="260" src="%ATTACHURL%/cayenneUnits.png" title="cayenneUnits.png" width="356" />

---++ 
---+ Combining measurement and publishing

In session 2 we have seen how to readout sensors and control actuators<br /><br />Now we have seen how to publish and how to subscribe to Cayenne messages<br /><br />We have to combine those two in order to create a full cayenne !IoT node.

---++ 
---+ SHT30 on Cayenne(1)

<img alt="cayenneSHT30Publish1.png" height="535" src="%ATTACHURL%/cayenneSHT30Publish1.png" title="cayenneSHT30Publish1.png" width="696" />

---++ 
---+ SHT30 on Cayenne(2)

<img alt="CayenneSHT30Publish.png" height="487" src="%ATTACHURL%/CayenneSHT30Publish.png" title="CayenneSHT30Publish.png" width="680" />

---++ 
---+ Cayenne MQTT client subscribe

This is a little more tricky:<br /><br />We have to create a callback function

and register it with the Cayenne MQTT client<br /><br />When the push button or slider on Cayenne

are activated this function will be called<br /><br />The function must find out from which channel

the request is coming, and which are the data<br /><br />It must then act on the hardware correspondingly<br /><br />The Cayenne MQTT client sends a response message

without our intervention

---++ 
---+ Registering the callback

<img alt="cayenneRegCallback.png" height="219" src="%ATTACHURL%/cayenneRegCallback.png" title="cayenneRegCallback.png" width="690" />

---++ 
---+ Parsing the command message

<img alt="cayenneCallback.png" height="249" src="%ATTACHURL%/cayenneCallback.png" title="cayenneCallback.png" width="634" />

The callback gets a tuple with topic and payload as parameter<br />The !CayenneMessage class helps with parsing the message

---++ 
---+ The !CayenneMessage class

<img alt="cayenneMsgClass.png" height="399" src="%ATTACHURL%/cayenneMsgClass.png" title="cayenneMsgClass.png" width="644" />
---++ <img alt="cayenneMsg.png" height="47" src="%ATTACHURL%/cayenneMsg.png" title="cayenneMsg.png" width="548" />

---++ 
---+ Analogue to Digital Conversion

Often real world signals are analogue in nature.

Before treating them digitally we must convert them to digital values<br /><br />This is done by an Analogue to Digital Converter<br /><br />The ESP8266 has a 10 bit ADC on chip, the ESP32 has 3 12 bit ADCs<br /><br />To demonstrate this we use a photo resistor reading the light intensity.

---++ 
---+ Photo resistor and LED

The photo resistor and the 1 k&Omega; resistor form a voltage divider<br /><br />The LED can be switched on by program and changes the light <br /><br />Intensity seen by the photo resistor
| <img alt="photoresistorSchema.png" height="425" src="%ATTACHURL%/photoresistorSchema.png" title="photoresistorSchema.png" width="617" /> | <img alt="proto.png" height="195" src="%ATTACHURL%/proto.png" title="proto.png" width="250" /> |

---++ 
---+ ADC readout
| <p>The ADC and GPIO driver classes</p> <p>are already available in MicroPython.<br /><br />This makes readout a child’s game.</p> | <img alt="protoDriver.png" height="342" src="%ATTACHURL%/protoDriver.png" title="protoDriver.png" width="497" /> |
---++ 
---+ Prototype board on Cayenne

<img alt="cayenneProtoCode.png" height="469" src="%ATTACHURL%/cayenneProtoCode.png" title="cayenneProtoCode.png" width="765" />
---++ 

---++ 
---+ The prototype GUI

<img alt="cayenneProtoResult.png" height="766" src="%ATTACHURL%/cayenneProtoResult.png" title="cayenneProtoResult.png" width="1287" />
---+ 

---++ 
---+ History of Intensity Measurements

<img alt="cayenneProtoHistory.png" height="672" src="%ATTACHURL%/cayenneProtoHistory.png" title="cayenneProtoHistory.png" width="1273" />

---++ 
---+ A trigger in Cayenne

We will observe the light intensity a and switch a light on, if it gets too dark

<img alt="cayenneTrigger.png" height="942" src="%ATTACHURL%/cayenneTrigger.png" title="cayenneTrigger.png" width="1309" />

---++ 
---+ The trigger code

<img alt="triggerCode.png" src="%ATTACHURL%/triggerCode.png" title="triggerCode.png" />
---++ 
---+ A Qt app and Cayenne MQTT

The graphical user interface of Cayenne is fairly limited.<br /><br />Can we write an application with another GUI system interacting

with our devices connected to the Cayenne MQTT broker?<br /><br />Example: <br /><br />The !WeMos D1 buzzer.<br /><br />We want to play a song from a list of choices.

---++ 
---+ The Buzzer GUI

<img alt="QtBuzzer.png" height="330" src="%ATTACHURL%/QtBuzzer.png" title="QtBuzzer.png" width="463" />

---++ 
---+ The Cayenne MQTT C library

The Cayenne MQTT C library contains everything we need

to communicate with the Cayenne MQTT broker:<br /><br />
   * Network and !CayenneMQTTClient data structures defined in include files<br /><br />
   * !NetworkInit and !NetworkConnect to connect to the Network<br /><br />
   * !CayenneMQTTClientIni and !CayenneMQTTConnect <br /> <br />to connect to the Cayenne MQTT broker<br /><br />
   * !CayenneMQTTPublishDataInt to publish the song number
---++ 
---+ The end of the show

There is still work for you during the exercises session to

make you !IoT node work with Sensor readout<br /><br />Publishing the result on Cayenne (for the SHT30)<br /><br />Subscribe to a command message from the Cayenne slider

to modify the settings of a colour component of your WS2812 rgb LED<br /><br />For further study please consult:<br /><br /> [[AFNOGWorkshop2019][https://afnog.iotworkshop.africa/do/view/AFNOG/AFNOGWorkshop2019]]<br /><br />You will find plenty examples on<br /><br /> [[https://github.com/uraich?tab=repositories]]
---++ 

%SLIDESHOWEND%

-- %USERSIG{UliRaich - 2019-05-15}%

---++ Comments

%COMMENT%

Attachments

Topic attachments
I	Attachment	History	Action	Size	Date	Who
png	CayenneSHT30Publish.png	r1	manage	67.3 K	2019-05-24 - 08:11	UliRaich
png	QtBuzzer.png	r1	manage	22.8 K	2019-05-24 - 08:15	UliRaich
png	cayenneCallback.png	r1	manage	37.0 K	2019-06-08 - 16:21	UliRaich
png	cayenneCmdMsg2.png	r1	manage	68.6 K	2019-05-24 - 07:38	UliRaich
png	cayenneCredentialsCmp.png	r1	manage	30.6 K	2019-06-08 - 16:11	UliRaich
png	cayenneDataTypes.png	r1	manage	33.1 K	2019-05-24 - 08:08	UliRaich
png	cayenneMsg.png	r1	manage	9.6 K	2019-06-09 - 13:57	UliRaich
png	cayenneMsgClass.png	r1	manage	59.5 K	2019-06-09 - 12:25	UliRaich
png	cayenneProtoCode.png	r1	manage	68.0 K	2019-06-09 - 14:07	UliRaich
png	cayenneProtoHistory.png	r1	manage	114.5 K	2019-06-09 - 12:28	UliRaich
png	cayenneProtoResult.png	r1	manage	115.8 K	2019-06-09 - 12:28	UliRaich
png	cayenneRegCallback.png	r1	manage	26.2 K	2019-06-08 - 16:21	UliRaich
png	cayenneSHT30Publish1.png	r1	manage	82.0 K	2019-05-24 - 08:11	UliRaich
png	cayenneTrigger.png	r1	manage	126.0 K	2019-06-09 - 12:30	UliRaich
png	cayenneUnits.png	r1	manage	24.3 K	2019-05-24 - 08:08	UliRaich
png	mqttfxBaseWindow.png	r1	manage	27.5 K	2019-05-24 - 07:38	UliRaich
png	mqttfxButtonOn.png	r1	manage	140.6 K	2019-05-24 - 07:38	UliRaich
png	mqttfxCmd.png	r1	manage	90.3 K	2019-05-24 - 07:38	UliRaich
png	mqttfxCredentials.png	r1	manage	60.2 K	2019-05-24 - 07:45	UliRaich
png	mqttfxPubCayenne.png	r1	manage	152.2 K	2019-05-24 - 07:53	UliRaich
png	mqttfxPublish.png	r1	manage	37.2 K	2019-05-24 - 07:39	UliRaich
png	mqttfxResponse.png	r1	manage	32.5 K	2019-05-24 - 07:39	UliRaich
png	mqttfxSubscribe.png	r1	manage	54.6 K	2019-05-24 - 07:39	UliRaich
png	mqttfxWaiting.png	r1	manage	143.4 K	2019-05-24 - 07:58	UliRaich
png	mqttfxcredFromCayenne.png	r1	manage	155.7 K	2019-05-24 - 07:45	UliRaich
png	photoresistorSchema.png	r1	manage	18.2 K	2019-06-09 - 12:25	UliRaich
png	proto.png	r1	manage	114.2 K	2019-06-09 - 12:25	UliRaich
png	protoDriver.png	r1	manage	31.4 K	2019-06-09 - 12:25	UliRaich
png	triggerCode.png	r1	manage	104.8 K	2019-06-09 - 14:15	UliRaich

Topic revision: r5 - 2019-06-09 - UliRaich