User Tools

Site Tools


iot:tutorial:mqtt

Differences

This shows you the differences between two versions of the page.

Link to this comparison view

Both sides previous revisionPrevious revision
Next revision
Previous revision
iot:mqtt [2020/06/11 13:12] – [WebHMI as MQTT Broker] atolstoviot:tutorial:mqtt [2020/10/21 08:42] (current) – [MQTT Protocol] atolstov
Line 1: Line 1:
-======= IoT  =======  
-Nowadays, the number of devices from which you can get various data is growing.  
-The solution to the problem of their interaction is the concept of the Internet of Things (IoT).  The concept is to unify devices into a network for some reason and then integrate them into larger networks. 
 ===== MQTT Protocol ===== ===== MQTT Protocol =====
 MQTT today has become an intermediary in IoT communication.  MQTT today has become an intermediary in IoT communication. 
-It is supported by integration controller WebHMI and 7bit brand products such as Synapse, AirPoint and AirGate.+It is supported by integration controller WebHMI ([[:mqtt|About how to use MQTT on WebHMI]]) and 7bit brand products such as Synapse, AirPoint and AirGate.
 ==== What is MQTT? ==== ==== What is MQTT? ====
 It is a lightweight, open and affordable protocol.  It is a lightweight, open and affordable protocol. 
Line 11: Line 8:
 To understand, look at this diagram.  To understand, look at this diagram. 
  
-{{ :wiki:mqtt:mqtt_diagram.png?nolink |}}+{{ iot:mqtt:mqtt_diagram.png?direct |}}
  
 There is no need in direct connection which is quite fragile and entails overhead. So, the broker is the gamechanger.   There is no need in direct connection which is quite fragile and entails overhead. So, the broker is the gamechanger.  
Line 23: Line 20:
 To start, firstly go to “Settings” to make sure that “MQTT Server” is turned on. To start, firstly go to “Settings” to make sure that “MQTT Server” is turned on.
  
-{{ ::wiki:mqtt:server:webhmi_as_server_1.png?nolink |}}+{{ iot:mqtt:server:webhmi_as_server_1.png?direct |}}
  
 [[:mqtt|About how to use MQTT on WebHMI]] [[:mqtt|About how to use MQTT on WebHMI]]
  
  
-===== WebHMI as MQTT Publisher (Client) =====+===== WebHMI as MQTT Client (Publisher/Subscriber) =====
 There is a possibility to create a WebHMI connection to subscribe or publish MQTT messages. There is a possibility to create a WebHMI connection to subscribe or publish MQTT messages.
 This allows WebHMI register mapping with certain topics on any broker. So editing register value will trigger WebHMI to publish MQTT message and vice versa: if you have an active register, receiving the message from the broker will trigger changing the value. This allows WebHMI register mapping with certain topics on any broker. So editing register value will trigger WebHMI to publish MQTT message and vice versa: if you have an active register, receiving the message from the broker will trigger changing the value.
Line 45: Line 42:
     TCP Port: 1883     TCP Port: 1883
  
-{{ :wiki:mqtt:client:pc:протокол_связи_mqtt_на_webhmi_client_connection_settings.png?nolink |}}+{{ iot:mqtt:client:pc:протокол_связи_mqtt_на_webhmi_client_connection_settings.png?direct |}}
 After that, create a new register into that connection which will represent MQTT topic related to MQTT broker. After that, create a new register into that connection which will represent MQTT topic related to MQTT broker.
 Click "New register" and fill in the following settings: Click "New register" and fill in the following settings:
Line 54: Line 51:
     Address: iot-test (any name, it is MQTT topic to subcribe and to publish)     Address: iot-test (any name, it is MQTT topic to subcribe and to publish)
     Script alias: mqtt_publish       Script alias: mqtt_publish  
-{{ :wiki:mqtt:client:pc:протокол_связи_mqtt_на_webhmi_client_register_settings.png?nolink |}}+{{ iot:mqtt:client:pc:протокол_связи_mqtt_на_webhmi_client_register_settings.png?direct |}}
  
 Go to “Value” tab to change its type to “String”      Go to “Value” tab to change its type to “String”     
-{{ :wiki:mqtt:client:pc:протокол_связи_mqtt_на_webhmi_client_register_settings_value.png?nolink |}}+{{ iot:mqtt:client:pc:протокол_связи_mqtt_на_webhmi_client_register_settings_value.png?direct |}}
 And click "Add" button. And click "Add" button.
-{{ :wiki:mqtt:client:pc:протокол_связи_mqtt_на_webhmi_client_register_settings_value_string.png?nolink |}}+{{ iot:mqtt:client:pc:протокол_связи_mqtt_на_webhmi_client_register_settings_value_string.png?direct |}}
  
 Now, it is time to change registers value manually and check the result response on another client such as Android app, PC clients such as "MQTT.fx" or another WebHMI. Now, it is time to change registers value manually and check the result response on another client such as Android app, PC clients such as "MQTT.fx" or another WebHMI.
  
 Let's check the response in MQTT.fx PC client. How to configure it will be shown later. Let's check the response in MQTT.fx PC client. How to configure it will be shown later.
-{{ :wiki:mqtt:client:pc:протокол_связи_mqtt_на_webhmi_client_register_value_manual_change.png?nolink |}}+{{ iot:mqtt:client:pc:протокол_связи_mqtt_на_webhmi_client_register_value_manual_change.png?direct |}}
  
 In the MQTT.fx will be shown caught changes in the subscribed topics. In the MQTT.fx will be shown caught changes in the subscribed topics.
-{{ :wiki:mqtt:client:pc:протокол_связи_mqtt_на_webhmi_mqttfx_subscribed_catch.png?nolink |}}+{{ iot:mqtt:client:pc:протокол_связи_mqtt_на_webhmi_mqttfx_subscribed_catch.png?direct |}}
  
 ===== Connect to WebHMI MQTT Broker with external client ===== ===== Connect to WebHMI MQTT Broker with external client =====
Line 74: Line 71:
 For example, freeware MQTT client “MQTT.fx” will be used. For example, freeware MQTT client “MQTT.fx” will be used.
 ---- ----
-{{:wiki:mqtt:client:pc:mqttfx_icon_256.png?nolink&200 |MQTT.fx}}+{{iot:mqtt:client:pc:mqttfx_icon_256.png?direct&200 |MQTT.fx}}
 \\  \\ 
 \\  \\ 
Line 81: Line 78:
 ---- ----
 To do this, let’s create a new connection with the following settings: To do this, let’s create a new connection with the following settings:
-{{ :wiki:mqtt:client:pc:протокол_связи_mqtt_на_webhmi_1.png?nolink |IMG}}+{{ iot:mqtt:client:pc:протокол_связи_mqtt_на_webhmi_1.png?direct |IMG}}
 Click on “+” in the lower left corner and set: Click on “+” in the lower left corner and set:
  
Line 92: Line 89:
 Let’s connect to WebHMI Broker by pressing the “Connect” button. Let’s connect to WebHMI Broker by pressing the “Connect” button.
  
-{{ :wiki:mqtt:client:pc:протокол_связи_mqtt_на_webhmi_2.png?nolink |IMG}}+{{ iot:mqtt:client:pc:протокол_связи_mqtt_на_webhmi_2.png?direct |IMG}}
 If everything is fine than connection will be established, so that indicator became green. If everything is fine than connection will be established, so that indicator became green.
 ==== From Android client to WebHMI ==== ==== From Android client to WebHMI ====
 In the Google Play Market, there is a lot of MQTT Client apps. For example, it would be shown the connection with [[https://play.google.com/store/apps/details?id=com.app.vetru.mqttdashboard|MQTT Dashboard]]. In the Google Play Market, there is a lot of MQTT Client apps. For example, it would be shown the connection with [[https://play.google.com/store/apps/details?id=com.app.vetru.mqttdashboard|MQTT Dashboard]].
-{{ :wiki:mqtt:client:android:протокол_связи_mqtt_на_webhmi_android_app.jpg?nolink&300 |}}+{{ iot:mqtt:client:android:протокол_связи_mqtt_на_webhmi_android_app.jpg?direct&300 |}}
  
  
Line 103: Line 100:
 \\  \\ 
  
-{{ :wiki:mqtt:client:android:протокол_связи_mqtt_на_webhmi_android_app_add_broker.png?nolink&300 |}}+{{ iot:mqtt:client:android:протокол_связи_mqtt_на_webhmi_android_app_add_broker.png?direct&300 |}}
  
 So, let’s add WebHMI Broker by click “Add first broker” button. So, let’s add WebHMI Broker by click “Add first broker” button.
Line 113: Line 110:
  
  
-{{ :wiki:mqtt:client:android:протокол_связи_mqtt_на_webhmi_android_app_add_connection.png?nolink&300 |}}+{{ iot:mqtt:client:android:протокол_связи_mqtt_на_webhmi_android_app_add_connection.png?direct&300 |}}
  
 Then, click the “Save” button in the bottom centre position. Then, click the “Save” button in the bottom centre position.
Line 123: Line 120:
  
  
-{{ :wiki:mqtt:client:android:протокол_связи_mqtt_на_webhmi_android_app_add_topic.png?nolink&300 |}}+{{ iot:mqtt:client:android:протокол_связи_mqtt_на_webhmi_android_app_add_topic.png?direct&300 |}}
  
 To demonstrate how the function works, the "Standard" format will suffice. To demonstrate how the function works, the "Standard" format will suffice.
  
  
-{{ :wiki:mqtt:client:android:протокол_связи_mqtt_на_webhmi_android_app_edit_topic.png?nolink&300 |}}+{{ iot:mqtt:client:android:протокол_связи_mqtt_на_webhmi_android_app_edit_topic.png?direct&300 |}}
 Pick the “Text” type. Pick the “Text” type.
  
  
-{{ :wiki:mqtt:client:android:протокол_связи_mqtt_на_webhmi_android_app_select_topic_payload_format.png?nolink&300 |}}+{{ iot:mqtt:client:android:протокол_связи_mqtt_на_webhmi_android_app_select_topic_payload_format.png?direct&300 |}}
  
 Fill in the “Subscribe topic” form the “iot-test” value and then press “Copy” symbol near “Publish topic” to copy the topics name to this form also. Fill in the “Subscribe topic” form the “iot-test” value and then press “Copy” symbol near “Publish topic” to copy the topics name to this form also.
Line 138: Line 135:
  
  
-{{ :wiki:mqtt:client:android:протокол_связи_mqtt_на_webhmi_android_app_select_topic_payload_type.png?nolink&300 |}}+{{ iot:mqtt:client:android:протокол_связи_mqtt_на_webhmi_android_app_select_topic_payload_type.png?direct&300 |}}
 To test the connection, you can try to change the register’s value and check the smartphone's screen for the result. To test the connection, you can try to change the register’s value and check the smartphone's screen for the result.
  
  
-{{ :wiki:mqtt:client:android:протокол_связи_mqtt_на_webhmi_android_app_test_receive.png?nolink |}}+{{ iot:mqtt:client:android:протокол_связи_mqtt_на_webhmi_android_app_test_receive.png?direct |}}
  
 The text message was sent through the MQTT protocol to WebHMI broker and the sent to the Android app. The text message was sent through the MQTT protocol to WebHMI broker and the sent to the Android app.
  
  
-{{ :wiki:mqtt:client:android:протокол_связи_mqtt_на_webhmi_android_app_test_subscribe.png?nolink&300 |}}+{{ iot:mqtt:client:android:протокол_связи_mqtt_на_webhmi_android_app_test_subscribe.png?direct&300 |}}
 It also works in another direction and can be published from the smartphone.  It also works in another direction and can be published from the smartphone. 
  
  
  
- 
-===== Useful Applications ===== 
-Sharing links, strings, etc.  
-There are a lot of mobile apps to connect with, etc. 
  
  
iot/tutorial/mqtt.1591881145.txt.gz · Last modified: 2020/06/11 13:12 by atolstov

Donate Powered by PHP Valid HTML5 Valid CSS Driven by DokuWiki