Changes for page ThingsBoard
Last modified by Dilisi S on 2025/04/23 19:23
Summary
-
Page properties (1 modified, 0 added, 0 removed)
-
Attachments (1 modified, 23 added, 0 removed)
- hivemq-8.png
- dashboard-1.png
- dashboard-2.png
- dashboard-3.png
- dashboard-4.png
- dashboard-5.png
- device-provision-1.png
- device-provision-2.png
- emqx.png
- hivemq-10.png
- hivemq-9.png
- ins1.png
- integration-active.png
- telemetry-1.png
- telemetry-2.png
- thingsboard-1.png
- thingsboard-2.png
- thingsboard-3.png
- thingsboard-4.png
- thingsboard-5.png
- thingsboard-6.png
- timeseries-1.png
- timeseries-3.png
- timeseries-4.png
Details
- Page properties
-
- Content
-
... ... @@ -17,16 +17,161 @@ 17 17 The **NB series** devices end with the suffix **-NB**, and the **CB series** devices end with the suffix **-CB**. For example, **S31B-NB** is an **NB device**, and **S31-CB** is a **CB device**. 18 18 19 19 20 += 2. Prerequisites = 20 20 22 +To complete this tutorial, you need to have the following: 21 21 24 +* ThingsBoard cloud account 25 +* MQTT Broker (public or private) such as, 26 +** **[[HiveMQ Cloud>>https://www.hivemq.com]] - You can create a free account to try it or subscribe for a paid account. - We use HiveMQ Cloud as the MQTT broker to build example in this tutorial.** 27 +** [[emqx>>https://www.emqx.com/zh/mqtt/public-mqtt5-broker]] - The public MQTT server is only used for MOTT learning and testing, and should not be used in the production environment. 28 +** [[lns1.thingseye.io>>http://lns1.thingseye.io/]] - This is Dragino's MQTT broker, which requires a CA certificate to use. 22 22 23 -= 2. DataConverters=30 +== 2.1 ThingsBoard Cloud == 24 24 25 25 33 +Go to [[https:~~/~~/thingsboard.io/>>https://thingsboard.io/]] 34 + 35 +Click on the **Try it now**. 36 + 37 + 38 +[[image:thingsboard-1.png]] 39 + 40 + 41 +Select either the **North America** or **Europe** region. Here, we use the Europe region. 42 + 43 +[[image:thingsboard-2.png]] 44 + 45 + 46 +You can sign up with your **Google**, **GitHub**, **Facebook**, or **Apple** account. If not you can create an account with providing your **name**, **email address** and a **password**. 47 + 48 +Click on the **Sign up** button. 49 + 50 +[[image:thingsboard-3.png||height="651" width="500"]] 51 + 52 + 53 +You will be navigated to the following page. 54 + 55 +[[image:thingsboard-5.png||height="109" width="500"]] 56 + 57 + 58 +simultaneously, you will receive an email to confirm your email address. Click on the **Activate Your Account** button. 59 + 60 + 61 +[[image:thingsboard-4.png||height="249" width="500"]] 62 + 63 + 64 +Now losing to the account using your credentials: 65 + 66 + 67 +[[image:thingsboard-6.png||height="244" width="500"]] 68 + 69 + 70 +(% class="wikigeneratedid" %) 71 +== 2.2 HiveMQ Cloud == 72 + 73 +=== 2.2.1 HiveMQ Cloud === 74 + 75 + 76 +Go to [[https:~~/~~/www.hivemq.com>>https://www.hivemq.com]] 77 + 78 +Click on the **Start Free** button. 79 + 80 +[[image:hivwmq-1.png]] 81 + 82 + 83 +Click on the **Sign Up FREE Now** button in the **HIVEMQ CLOUD** section. 84 + 85 +[[image:hivemq-2.png]] 86 + 87 + 88 +Click on the **Sign Up** button. 89 + 90 +You can sign up with HiveMQ using your **GitHub**, **Google**, or **LinkedIn** account. 91 + 92 +If not, provide your **email address** and a **password** to create an account by clicking on the **Sign Up** button. 93 + 94 + 95 +[[image:hivemq-3.png]] 96 + 97 + 98 +You will receive an email to verify your email address. Click on the **Confirm my account** button. 99 + 100 + 101 +[[image:hivemq-4.jpg||height="889" width="400"]] 102 + 103 + 104 +You will be redirected to a page asking you to complete your profile. Once done, click the **Continue** button. 105 + 106 + 107 +[[image:hivemq-5.png||height="655" width="700"]] 108 + 109 + 110 +Select the CloudMQ Cloud plan you need. For testing purposes, select the **Serverless FREE** plan by clicking on the **Create Serverless Cluster** button. 111 + 112 + 113 +[[image:hivemq-6.png]] 114 + 115 + 116 +You will be navigated to the **Your Clusters** page. Click on the **Manage Cluster** button. 117 + 118 +[[image:hivemq-7.png]] 119 + 120 + 121 +In your cluster page, you can find some useful parameters you need to create a MQTT connection. 122 + 123 +**URL**: This is the host name. Click on the copy button to copy it. 124 + 125 +**Port**: 8883 126 + 127 + 128 +Click on the **Getting Started** tab to setup the username and the password as the connection credentials. 129 + 130 + 131 +[[image:hivemq-8.png]] 132 + 133 + 134 +In the '**Create Connection Credentials**' section, provide a **username** and **password**, then click the **Add** button. 135 + 136 + 137 +[[image:hivemq-9.png]] 138 + 139 + 140 + 141 +If everything is successful, you will see the following message. 142 + 143 + 144 +[[image:hivemq-10.png||height="206" width="500"]] 145 + 146 + 147 +You will need these MQTT connection parameters when configuring the MQTT integration in the '**Add Integration**' section. 148 + 149 + 150 +=== 2.2.2 emqx === 151 + 152 + 153 +The [[emqx>>https://www.emqx.com/zh/mqtt/public-mqtt5-broker]] public MQTT server is only used for MOTT learning and testing, and should not be used in the production environment. 154 + 155 + 156 +[[image:emqx.png||height="420" width="500"]] 157 + 158 + 159 +=== 2.2.3 Ins1.thingseye.io === 160 + 161 +[[lns1.thingseye.io>>http://lns1.thingseye.io/]] is the Dragino's MQTT broker, which requires a CA certificate file, Certificate file, and the Private key file to use. 162 + 163 +If customers need to use this MQTT connection with ThingsBoard, they need to contact the TE team to obtain three license files. 164 + 165 +[[image:ins1.png||height="310" width="500"]] 166 + 167 + 168 += 3. Data Converters = 169 + 170 + 26 26 In **ThingsBoard**, **Data Converters** are components used to transform incoming or outgoing data between different formats, typically to convert raw telemetry data from devices into a structured format that ThingsBoard can understand, or vice versa. 27 27 28 28 29 -== 2.1 Uplink ==174 +== 3.1 Uplink == 30 30 31 31 32 32 In the left navigation, click **Integrations center**, and then click **Data converters**. ... ... @@ -156,10 +156,9 @@ 156 156 157 157 [[image:data-converters-list.png]] 158 158 159 -(% class="wikigeneratedid" %) 160 160 161 161 162 -= 3. Add Integration =306 += 4. Add Integration = 163 163 164 164 165 165 In the left navigation, click **Integrations center**, and then click **Integrations**. ... ... @@ -225,14 +225,13 @@ 225 225 * **Topic:** tb/mqtt-integration-tutorial/sensors/+/telemetry (the + replaces any 'device name' and creates devices in the Entities -> Devices) 226 226 * **QoS:** 0-At most once 227 227 228 - 229 229 [[image:add-integration-connection.png||height="511" width="500"]] 230 230 231 231 232 232 Click on the **Advanced settings** button. 233 233 234 -* **Clean session:** NO235 -* **Retained**: NO377 +* **Clean session:** YES 378 +* **Retained**: YES 236 236 237 237 [[image:add-integration-connection-advanced-settings.png||height="510" width="500"]] 238 238 ... ... @@ -240,11 +240,10 @@ 240 240 Click on the **Check connection** button to verify the MQTT connection using the provided parameters. 241 241 242 242 243 - 244 244 [[image:check-connection.png||height="83" width="300"]] 245 245 246 246 247 -If the connection is successful, you will see the **Connected** message. 389 +If the connection is successful, you will see the **Connected** message. If not, check your connection parameters again. 248 248 249 249 250 250 [[image:connection-success.png||height="511" width="500"]] ... ... @@ -252,22 +252,190 @@ 252 252 253 253 Click on the **Add** button. 254 254 255 - 256 - 257 257 You should see that the newly added integration is listed on the **Integrations** page. 258 258 259 259 Since we haven't received data from a device yet, the integration **Status** is shown as **Pending.** 260 260 261 -[[image:integrations-list-added-pending.png]] 262 262 263 263 264 - = 5. Verifyingthereceiptof data from theevice =403 +[[image:new-integration-pending.png]] 265 265 266 266 267 - Ontheterminal,issuethefollowingMQTTcommandwhich simulatesthedeviceS31B-NB.406 += 5. Verifying the receipt of data from virtual devices = 268 268 408 + 409 +== 5.1 How does it work? == 410 + 411 + 412 +We use the Mosquitto MQTT client to simulate MQTT messages, acting as a virtual device. First, install the Mosquitto client on your computer from [[this link>>url:https://mosquitto.org/download/]]. The Mosquitto client publishes messages to the MQTT broker (HiveMQ) on a specified MQTT topic. ThingsBoard subscribes to these messages using the same topic. 413 + 414 +The Mosquitto client publishes messages on the topic v1/devices/[device_name]/telemetry. The [device_name]placeholder can be replaced with any device name, for example, 'S31B-NB'. Then, the MQTT topic would be v1/devices/S31B-NB/telemetry. 415 + 416 +On the ThingsBoard side, we configure the MQTT topic subscription as v1/devices/+/telemetry. The + wildcard represents any device name and allows ThingsBoard to automatically create (provision) a device with that name, such as S31B-NB, for example. 417 + 418 + 419 +**The new device is created the first time the MQTT topic is received. For subsequent MQTT topics with the same device name, no duplicate devices will be created.** 420 + 421 + 422 +For example, if you send two MQTT messages with different device names in the topic: 423 + 424 +1. v1/devices/**S31B-NB**/telemetry 425 +1. v1/devices/**LDS25-NB**/telemetry 426 + 427 +ThingsBoard will create two devices named **S31B-NB** and **LDS25-NB** in the **//Devices//** section. 428 + 429 + 430 +The MQTT payload format is as follows, which is common for all ~-~-NB and ~-~-CB series devices: 431 + 269 269 {{code language="none"}} 270 - mosquitto_pub -d -q 1 -h mqtt.eu.thingsboard.cloud -p 1883 -t v1/devices/S31B-NB/telemetry -u "24vk3w9h7sqdld1me5eh" -m "{temperature:20}"433 +{"temperature":10.4, "humidity":85} 271 271 {{/code}} 272 272 273 -If the integration was performed without errors, after the transmission of the first telemetry, a new device with the name “S31B-NB” will appear in the Devices → All. Also, you can verify the input and output data, respectively, before and after conversion in Data converters → UDP Uplink Converter NB/CB → Events. 436 + 437 +== 5.2 Sending messages == 438 + 439 + 440 +On the terminal, issue the following MQTT command which simulates the device S31B-NB. The message payload contains the fields temperature and humidity, which hold the values 10.4 and 85, respectively. This payload is also (technically) known as telemetry. 441 + 442 +{{code language="none"}} 443 +mosquitto_pub -d -q 1 -h 011731f7928xxxxx.s1.eu.hivemq.cloud -p 8883 -t "tb/mqtt-integration-tutorial/sensors/S31B-NB/telemetry" -u "xxxxx" -P "xxxxx" -m '{"temperature":10.4, "humidity":85}' 444 +{{/code}} 445 + 446 +If the integration was performed without errors, the status of the integration changes to 'Active' after the first telemetry transmission. 447 + 448 + 449 +[[image:integration-active.png]] 450 + 451 + 452 +Also, a new device named **S31B-NB** will appear under **//Entities -> Devices -> All//**. This means the first MQTT message triggers ThingsBoard to provision a device named **S31B-NB**. 453 + 454 + 455 +[[image:device-provision-1.png]] 456 + 457 + 458 +Click on the device S31B-NB on the devices list to see its details. 459 + 460 +Then go to the **Latest telemetry** tab. 461 + 462 +You can see the fields temperature and humidity with the values you previously sent using the MQTT message. 463 + 464 + 465 +[[image:telemetry-1.png]] 466 + 467 + 468 +Now, change the values of the fields and send the MQTT message again. For example, set temperature to 20 and humidity to 70. Observe how the values update in //Latest Telemetry//. 469 + 470 + 471 +[[image:telemetry-2.png]] 472 + 473 + 474 +Let's provision the second device named **LDS25-NB **with initial telemetry. Use the following MQTT message. 475 + 476 + 477 +{{code language="none"}} 478 +mosquitto_pub -d -q 1 -h 011731f7928541588a6cdfbbedfc63f4.s1.eu.hivemq.cloud -p 8883 -t "tb/mqtt-integration-tutorial/sensors/LDS25-NB/telemetry" -u "pradeeka" -P "Kalpani123@" -m '{"temperature":11, "humidity":87}' 479 +{{/code}} 480 + 481 +Now, refresh the **Devices** page, and you will see the second device, **LDS25-NB**, which was recently provisioned. 482 + 483 + 484 +[[image:device-provision-2.png]] 485 + 486 + 487 += 6. Creating a Dashboard = 488 + 489 +ThingsBoard **Dashboards** provide a powerful way to visualize and monitor real-time and historical data from connected devices. They allow users to create interactive, customizable panels displaying telemetry data, device status, and other key metrics. With a variety of widgets, including charts, maps, and tables, dashboards help users gain insights, track trends, and manage IoT deployments efficiently. 490 + 491 + 492 +This section guides you on how to create a dashboard to display temperature and humidity data from the device on a time-series chart. You may also use other widgets in ThingsBoard to display data according to your requirements. 493 + 494 + 495 +In **ThingsBoard**, from the left navigation menu, click **Dashboards**. Then, click the **+** button and select **Create new dashboard** from the dropdown menu. 496 + 497 + 498 +[[image:dashboard-1.png]] 499 + 500 + 501 +In the **Title** text box, enter **NB/CB Test Dashboard** as the title of the dashboard. 502 + 503 +Click on the **Add** button. 504 + 505 + 506 +[[image:dashboard-2.png||height="526" width="500"]] 507 + 508 + 509 +Click on the **Add widget / Add new widget** button. 510 + 511 + 512 +[[image:dashboard-3.png]] 513 + 514 + 515 +In the **Select widgets bundle** window, click **Charts**. 516 + 517 + 518 +[[image:dashboard-4.png||height="537" width="700"]] 519 + 520 + 521 + 522 +In the **Charts: select widget** window, click **Time series chart**. 523 + 524 + 525 +[[image:dashboard-5.png||height="525" width="700"]] 526 + 527 + 528 +Configure the **Time series chart** widget as follows: 529 + 530 +* **Datasource** - select S31B-NB device you provisioned. 531 +* **Series**: 532 +** **temperature** - you can see this key by default. 533 +** **humidity** - Click **Add series** button. Then add the **humidity** for the key and then type **%** as its unit. 534 +* Click on the **Add** button. 535 + 536 +[[image:timeseries-1.png||height="491" width="700"]] 537 + 538 + 539 +The time-series chart will appear in edit mode. Resize it by clicking and dragging the lower-right corner. 540 + 541 +Click the **Save** button to add the widget to the dashboard. 542 + 543 + 544 +[[image:timeseries-3.png||height="347" width="700"]] 545 + 546 + 547 +Now send the following MQTT messages from the terminal to simulate the data. 548 + 549 + 550 +{{code language="none"}} 551 +mosquitto_pub -d -q 1 -h 011731f7928xxxxx.s1.eu.hivemq.cloud -p 8883 -t "tb/mqtt-integration-tutorial/sensors/S31B-NB/telemetry" -u "xxxxx" -P "xxxxx" -m '{"temperature":20, "humidity":70}' 552 + 553 +mosquitto_pub -d -q 1 -h 011731f7928xxxxx.s1.eu.hivemq.cloud -p 8883 -t "tb/mqtt-integration-tutorial/sensors/S31B-NB/telemetry" -u "xxxxx" -P "xxxxx" -m '{"temperature":22, "humidity":71}' 554 + 555 +mosquitto_pub -d -q 1 -h 011731f7928xxxxx.s1.eu.hivemq.cloud -p 8883 -t "tb/mqtt-integration-tutorial/sensors/S31B-NB/telemetry" -u "xxxxx" -P "xxxxx" -m '{"temperature":18, "humidity":79}' 556 + 557 +{{/code}} 558 + 559 +The chart will update with the values in realtime, as shown in the below image. 560 + 561 + 562 +[[image:timeseries-4.png||height="316" width="700"]] 563 + 564 + 565 += 7. Configure NB-IoT Sensor = 566 + 567 + 568 +Now, let's experiment with sending data to ThingsBoard using a real NB-IoT device. For example, we will use the **S31B-NB**. 569 + 570 +First, configure the NB-IoT device with the necessary MQTT settings using AT commands. Below is a list of AT commands you can use. 571 + 572 + 573 +**AT Commands** 574 + 575 +* **AT+PRO=3,3 **~/~/ Use MQTT to connect to ThingsBoard. Payload Type set to 3. 576 +* **AT+SUBTOPIC=<MQTT topic>** 577 +* **AT+PUBTOPIC=<MQTT topic>** 578 +* **AT+CLIENT=null** 579 +* **AT+UNAME=<MQTT Username>** 580 +* **AT+PWD=<MQTT Password>** 581 +* **AT+SERVADDR=<Broker address, Port>** 582 + 583 +Test your uplink by pressing the ACT button for 1 second.
- hivemq-8.png
-
- Size
-
... ... @@ -1,1 +1,1 @@ 1 - 304.7 KB1 +268.7 KB - Content
- dashboard-1.png
-
- Author
-
... ... @@ -1,0 +1,1 @@ 1 +XWiki.pradeeka - Size
-
... ... @@ -1,0 +1,1 @@ 1 +271.1 KB - Content
- dashboard-2.png
-
- Author
-
... ... @@ -1,0 +1,1 @@ 1 +XWiki.pradeeka - Size
-
... ... @@ -1,0 +1,1 @@ 1 +112.2 KB - Content
- dashboard-3.png
-
- Author
-
... ... @@ -1,0 +1,1 @@ 1 +XWiki.pradeeka - Size
-
... ... @@ -1,0 +1,1 @@ 1 +141.3 KB - Content
- dashboard-4.png
-
- Author
-
... ... @@ -1,0 +1,1 @@ 1 +XWiki.pradeeka - Size
-
... ... @@ -1,0 +1,1 @@ 1 +803.7 KB - Content
- dashboard-5.png
-
- Author
-
... ... @@ -1,0 +1,1 @@ 1 +XWiki.pradeeka - Size
-
... ... @@ -1,0 +1,1 @@ 1 +476.1 KB - Content
- device-provision-1.png
-
- Author
-
... ... @@ -1,0 +1,1 @@ 1 +XWiki.pradeeka - Size
-
... ... @@ -1,0 +1,1 @@ 1 +265.7 KB - Content
- device-provision-2.png
-
- Author
-
... ... @@ -1,0 +1,1 @@ 1 +XWiki.pradeeka - Size
-
... ... @@ -1,0 +1,1 @@ 1 +213.9 KB - Content
- emqx.png
-
- Author
-
... ... @@ -1,0 +1,1 @@ 1 +XWiki.pradeeka - Size
-
... ... @@ -1,0 +1,1 @@ 1 +39.1 KB - Content
- hivemq-10.png
-
- Author
-
... ... @@ -1,0 +1,1 @@ 1 +XWiki.pradeeka - Size
-
... ... @@ -1,0 +1,1 @@ 1 +82.7 KB - Content
- hivemq-9.png
-
- Author
-
... ... @@ -1,0 +1,1 @@ 1 +XWiki.pradeeka - Size
-
... ... @@ -1,0 +1,1 @@ 1 +303.7 KB - Content
- ins1.png
-
- Author
-
... ... @@ -1,0 +1,1 @@ 1 +XWiki.pradeeka - Size
-
... ... @@ -1,0 +1,1 @@ 1 +28.8 KB - Content
- integration-active.png
-
- Author
-
... ... @@ -1,0 +1,1 @@ 1 +XWiki.pradeeka - Size
-
... ... @@ -1,0 +1,1 @@ 1 +64.2 KB - Content
- telemetry-1.png
-
- Author
-
... ... @@ -1,0 +1,1 @@ 1 +XWiki.pradeeka - Size
-
... ... @@ -1,0 +1,1 @@ 1 +191.9 KB - Content
- telemetry-2.png
-
- Author
-
... ... @@ -1,0 +1,1 @@ 1 +XWiki.pradeeka - Size
-
... ... @@ -1,0 +1,1 @@ 1 +185.1 KB - Content
- thingsboard-1.png
-
- Author
-
... ... @@ -1,0 +1,1 @@ 1 +XWiki.pradeeka - Size
-
... ... @@ -1,0 +1,1 @@ 1 +1.9 MB - Content
- thingsboard-2.png
-
- Author
-
... ... @@ -1,0 +1,1 @@ 1 +XWiki.pradeeka - Size
-
... ... @@ -1,0 +1,1 @@ 1 +901.1 KB - Content
- thingsboard-3.png
-
- Author
-
... ... @@ -1,0 +1,1 @@ 1 +XWiki.pradeeka - Size
-
... ... @@ -1,0 +1,1 @@ 1 +146.3 KB - Content
- thingsboard-4.png
-
- Author
-
... ... @@ -1,0 +1,1 @@ 1 +XWiki.pradeeka - Size
-
... ... @@ -1,0 +1,1 @@ 1 +122.1 KB - Content
- thingsboard-5.png
-
- Author
-
... ... @@ -1,0 +1,1 @@ 1 +XWiki.pradeeka - Size
-
... ... @@ -1,0 +1,1 @@ 1 +106.7 KB - Content
- thingsboard-6.png
-
- Author
-
... ... @@ -1,0 +1,1 @@ 1 +XWiki.pradeeka - Size
-
... ... @@ -1,0 +1,1 @@ 1 +119.3 KB - Content
- timeseries-1.png
-
- Author
-
... ... @@ -1,0 +1,1 @@ 1 +XWiki.pradeeka - Size
-
... ... @@ -1,0 +1,1 @@ 1 +179.1 KB - Content
- timeseries-3.png
-
- Author
-
... ... @@ -1,0 +1,1 @@ 1 +XWiki.pradeeka - Size
-
... ... @@ -1,0 +1,1 @@ 1 +174.2 KB - Content
- timeseries-4.png
-
- Author
-
... ... @@ -1,0 +1,1 @@ 1 +XWiki.pradeeka - Size
-
... ... @@ -1,0 +1,1 @@ 1 +159.0 KB - Content