How to connect data to CloudMQTT using
Quectel 3G Shield / 3G Module (Chapter 1 / ตอนที่ 1)
>> ดูสินค้า ETEE059 3G Shield (UC20-G) <<
![เชอมตอ CloudMQTT ผาน 3G 01](https://blog.thaieasyelec.com/wp-content/uploads/2020/08/146_เชอมตอ_CloudMQTT_ผาน_3G_01.png)
ในบทความนี้จะกล่าวถึงการนำ 3G Shield มาใช้เป็นตัวรับ/ส่ง ข้อมูลกับ MQTT Broker ซึ่งโดยมากเรามักจะเห็นการใช้งาน MQTT ในระบบ Internet Of Thing (IoTs) กับ WiFi เป็นหลัก แต่สำหรับบทความนี้ จะเป็นการนำเอา MQTT มาใช้บน 3G Shield ซึ่งน่าจะช่วยตอบโจทย์กับผู้ใช้บางกลุ่มที่ต้องการใช้ Internet ในที่ห่างไกล ยากแก่การเชื่อมต่อระบบเข้ากับ WiFi
จะขอเเบ่งรายละเอียดออกเป็น 3 ตอนดังนี้
ตอนที่ 1 เริ่มต้นด้วยเรื่องสมัครใช้งาน CloudMQTT + การสร้าง MQTT Server + ทดลอง Sub Pup แบบง่ายๆด้วย Smart Phone
ตอนที่ 2 การใช้งาน MQTT กับ 3G Shield >> คลิกอ่านบทความที่นี่
ตอนที่ 3 การสร้าง Dash Board แบบง่ายๆ ด้วย Application MQTT Dash บน Android >> คลิกอ่านบทความที่นี่
สมัครใช้งาน CloudMQTT
ในขั้นต้น เราจำเป็นจะต้องหา MQTT Server หรือ MQTT Broker สำหรับทดลองใช้งานและรับ/ส่งข้อมูลก่อน ในบทความนี้เราจึงแนะนำให้ใช้ CloudMQTT เป็น Server สำหรับทดลอง เนื่องจากใช้งานง่ายและทดลองใช้ได้ฟรี 10 Clients
- เริ่มจากการสมัครใช้งานที่ https://www.cloudmqtt.com
![เชอมตอ CloudMQTT ผาน 3G 01](https://blog.thaieasyelec.com/wp-content/uploads/2020/08/146_เชอมตอ_CloudMQTT_ผาน_3G_01-1.png)
- คลิกที่ Control Panel
![เชอมตอ CloudMQTT ผาน 3G 02](https://blog.thaieasyelec.com/wp-content/uploads/2020/08/146_เชอมตอ_CloudMQTT_ผาน_3G_02.png)
- ไปที่หัวข้อ Sign up และกรอก E-mail เพื่อสมัครใช้งาน จากนั้นกดปุ่ม Sign up
![เชอมตอ CloudMQTT ผาน 3G 03](https://blog.thaieasyelec.com/wp-content/uploads/2020/08/146_เชอมตอ_CloudMQTT_ผาน_3G_03.png)
- รอรับ E-mail จากระบบและเข้าไปยัง Link ที่ระบบส่งมาให้เพื่อกรอกข้อมูลชื่อ, ที่อยู่ และตั้งค่า password แล้วกด Submit
![](https://blog.thaieasyelec.com/wp-content/uploads/2020/08/146_เชอมตอ_CloudMQTT_ผาน_3G_04.png)
เป็นอันเสร็จสิ้นการสมัครขอใช้งาน CloudMQTT
สร้าง MQTT Server
- เมื่อสมัครใช้งาน CloudMQTT เป็นที่เรียบร้อย ให้เข้าไปที่หัวข้อ Control Panel และคลิกที่ปุ่ม Create
![เชอมตอ CloudMQTT ผาน 3G 05](https://blog.thaieasyelec.com/wp-content/uploads/2020/08/146_เชอมตอ_CloudMQTT_ผาน_3G_05.png)
- ตั้งชื่อ Instance, เลือก Data Center และ Plan (สามารถตั้งชื่อเพียงอย่างเดียวก็ได้ นอกนั้นใช้ Default) จากนั้นกด Create
![เชอมตอ CloudMQTT ผาน 3G 06](https://blog.thaieasyelec.com/wp-content/uploads/2020/08/146_เชอมตอ_CloudMQTT_ผาน_3G_06.png)
- เพียงเท่านี้เราก็จะได้ MQTT สำหรับใช้งานแล้วครับ
![เชอมตอ CloudMQTT ผาน 3G 07](https://blog.thaieasyelec.com/wp-content/uploads/2020/08/146_เชอมตอ_CloudMQTT_ผาน_3G_07.png)
- เมื่อเราคลิกที่ปุ่ม Details ก็จะปรากฎหน้า Instance info ของเราขึ้นมา ซึ่งเป็นข้อมูลที่เราจะต้องนำไปใช้อ้างอิงเพื่อส่ง Data เข้ามายัง MQTT Server เช่น Server, User, Port, Password
![เชอมตอ CloudMQTT ผาน 3G 08](https://blog.thaieasyelec.com/wp-content/uploads/2020/08/146_เชอมตอ_CloudMQTT_ผาน_3G_08.png)
![เชอมตอ CloudMQTT ผาน 3G 09](https://blog.thaieasyelec.com/wp-content/uploads/2020/08/146_เชอมตอ_CloudMQTT_ผาน_3G_09.png)
- จากนั้นเข้าไปยังหัวข้อ Websocket UI
![เชอมตอ CloudMQTT ผาน 3G 10](https://blog.thaieasyelec.com/wp-content/uploads/2020/08/146_เชอมตอ_CloudMQTT_ผาน_3G_10.png)
- ในส่วนของ Websocket UI จะเป็นส่วนที่ใช้แสดงข้อมูลที่ Client Publish Message เข้ามา และส่วนที่ใช้ Broker Publish Message ออกไปให้ Client ซึ่งถ้าหาก Client ได้ Subscribe Topic นั้นๆ เอาไว้ก็จะได้รับ Message นั้น
![เชอมตอ CloudMQTT ผาน 3G 11](https://blog.thaieasyelec.com/wp-content/uploads/2020/08/146_เชอมตอ_CloudMQTT_ผาน_3G_11.png)
ทดลอง Sub Pup แบบง่ายๆด้วย Smartphone กันก่อน
ก่อนที่จะทดลองให้ MQTT กับ 3G Shield เรามาลองทดสอบ Publish และ Subscribe กันด้วย Application บนมือถือของเรากันก่อน เพื่อทดสอบว่า เราสามารถใช้งาน MQTT Broker ได้จริง
- ใช้ Smart Phone ที่ใช้ระบบปฎิบัติการ Android เข้าไปยัง Play Store
![เชอมตอ CloudMQTT ผาน 3G 12](https://blog.thaieasyelec.com/wp-content/uploads/2020/08/146_เชอมตอ_CloudMQTT_ผาน_3G_12.png)
- ค้นหา Application MyMQTT
![เชอมตอ CloudMQTT ผาน 3G 13](https://blog.thaieasyelec.com/wp-content/uploads/2020/08/146_เชอมตอ_CloudMQTT_ผาน_3G_13.jpg)
- ทำการติดตั้ง Application
![เชอมตอ CloudMQTT ผาน 3G 14](https://blog.thaieasyelec.com/wp-content/uploads/2020/08/146_เชอมตอ_CloudMQTT_ผาน_3G_14.png)
- เปิด Application MyMQTT ขึ้นมา
![เชอมตอ CloudMQTT ผาน 3G 15](https://blog.thaieasyelec.com/wp-content/uploads/2020/08/146_เชอมตอ_CloudMQTT_ผาน_3G_15.png)
- เมื่อเปิด Application ขึ้นมาแล้วให้เข้าไปที่หัวข้อ Setting
![เชอมตอ CloudMQTT ผาน 3G 16](https://blog.thaieasyelec.com/wp-content/uploads/2020/08/146_เชอมตอ_CloudMQTT_ผาน_3G_16.png)
- ตั้งค่า server, port, user, password ตามค่าที่ CloudMQTT กำหนด ซึ่งสามารถดูได้จากหัวข้อ Overview ของ CloudMQTT แล้วกด Save
![เชอมตอ CloudMQTT ผาน 3G 17](https://blog.thaieasyelec.com/wp-content/uploads/2020/08/146_เชอมตอ_CloudMQTT_ผาน_3G_17-1024x453.png)
- เมื่อกรอกข้อมูลครบแล้ว ตัว application จะแสดงสถานะเชื่อมต่อกับ Server
![เชอมตอ CloudMQTT ผาน 3G 18](https://blog.thaieasyelec.com/wp-content/uploads/2020/08/146_เชอมตอ_CloudMQTT_ผาน_3G_18.png)
- ไปที่หัวข้อ Publish
![เชอมตอ CloudMQTT ผาน 3G 19](https://blog.thaieasyelec.com/wp-content/uploads/2020/08/146_เชอมตอ_CloudMQTT_ผาน_3G_19.png)
- ทดลอง Publish Message ไปยัง Broker
– เปิดหน้า Websocket UI ที่ CloudMQTT
![เชอมตอ CloudMQTT ผาน 3G 20](https://blog.thaieasyelec.com/wp-content/uploads/2020/08/146_เชอมตอ_CloudMQTT_ผาน_3G_20-1024x513.png)
– ที่ Application MyMQTT กำหนด Topic เป็น “test” และ Message เป็น “hello” Publish เป็นจำนวน 10 ครั้ง
– เมื่อกด Button Publish ก็จะมี Message ไปปรากฏบน CloudMQTT ทั้งหมด 10 ครั้ง
ทดลอง Subscribe
– เข้าไปที่หัวข้อ Subscribe
![เชอมตอ CloudMQTT ผาน 3G 21](https://blog.thaieasyelec.com/wp-content/uploads/2020/08/146_เชอมตอ_CloudMQTT_ผาน_3G_21.png)
– Add Topic ที่ต้องการ Subscribe ในที่นี้ ทดลอง Subscribe topic ชื่อ led แล้วกด Add
![เชอมตอ CloudMQTT ผาน 3G 22](https://blog.thaieasyelec.com/wp-content/uploads/2020/08/146_เชอมตอ_CloudMQTT_ผาน_3G_22.png)
![เชอมตอ CloudMQTT ผาน 3G 23](https://blog.thaieasyelec.com/wp-content/uploads/2020/08/146_เชอมตอ_CloudMQTT_ผาน_3G_23.png)
– ไปยังหัวข้อ Dashboard
![เชอมตอ CloudMQTT ผาน 3G 24](https://blog.thaieasyelec.com/wp-content/uploads/2020/08/146_เชอมตอ_CloudMQTT_ผาน_3G_24.png)
– เปิดหน้า Websocket UI ที่ CloudMQTT กำหนด Topic เป็นคำว่า led แล้วกำหนด Message เป็นคำว่า on แล้ว คลิก Send
– จะสังเกตุเห็นว่า ข้อความจาก Topic “led” จะไปปรากฏอยู่บนหน้า Dashboard ของ Application MyMQTT
![เชอมตอ CloudMQTT ผาน 3G 25](https://blog.thaieasyelec.com/wp-content/uploads/2020/08/146_เชอมตอ_CloudMQTT_ผาน_3G_25-1024x346.png)
– และ เมื่อทดลองส่ง Topic “ledx” ที่ Dashboard ของ Application MyMQTT จะไม่ได้รับ Message เนื่องจากที่ Application ไม่ได้ Subscribe Topic “ledx” เอาไว้