Open in app

Sign in

Write

Sign in

Installing Mosquitto and Zigbee2mqtt on Raspberry Pi 4

<rawat.s>
8 min readJun 9, 2020

--

‍‍‍‍‍‍ ‍‍ ‍‍‍‍‍‍ ‍‍‍‍‍‍ ‍‍

บทความนี้เป็นบันทึกช่วยจำสำหรับขั้นตอนในการติดตั้ง Mosquitto MQTT Broker และ Zigbee2MQTT ซึ่งเป็น ZigBee-MQTT Bridge เพื่อนำมาใช้กับบอร์ด Raspberry Pi 4 Model B นำมาใช้งานและเป็นส่วนหนึ่งของการสร้างระบบควบคุมประเภท “สมาร์ทโฮม” (Smart Home) ในเบื้องต้น และเรียนรู้การเขียนโค้ดสำหรับวัตถุประสงค์ดังกล่าว เช่น การใช้ WebSockets สำหรับภาษา JavaScript

Zigbee2mqtt Architecture (Source: https://github.com/koenkk/zigbee2mqtt)

‍‍‍‍‍‍ ‍‍ ‍‍‍‍‍‍ ‍‍‍‍‍‍ ‍‍

การทำตามขั้นตอนในบทความนี้ จะต้องมีอุปกรณ์ฮาร์ดแวร์ เพื่อสาธิตหรือทดสอบการทำงานของระบบ

  • บอร์ด Raspberry Pi 4 Model B + microSD + 5V power supply
  • โมดูล TI CC2531 Zigbee-USB Adapter
  • อุปกรณ์ Smart Home ที่เชื่อมต่อและควบคุมได้โดยใช้โพรโทคอล Zigbee (ดูรายการอุปกรณ์ที่สามารถเลือกมาใช้งานได้ และรองรับการใช้ร่วมกับ Zigbee2mqtt)

ถ้าไม่มีบอร์ด RPi 4B ก็สามารถใช้ RPi 3B หรือ RPi 3B+ แทนได้เช่นกัน

‍‍‍‍‍‍ ‍‍ ‍‍‍‍‍‍ ‍‍‍‍‍‍ ‍‍

ตัวอย่างอุปกรณ์ ZigBee Devices ที่ได้เลือกนำมาทดสอบ

RPi + Mosquitto + Zigbee2MQTT

‍‍‍‍‍‍ ‍‍ ‍‍‍‍‍‍ ‍‍‍‍‍‍ ‍‍

เป้าหมายคือ การนำคอมพิวเตอร์บอร์ดเดี่ยว (Single-Board Computer: SBC) อย่างเช่น Raspberry Pi (RPi) ในกรณีนี้ได้ลองใช้ RPi 4 Model B ( 2GB RAM ) มาติดตั้งซอฟต์แวร์ Eclipse Mosquitto เพื่อทำหน้าที่เป็น MQTT Broker หรือตัวกลางในการรับส่งข้อมูลด้วยโพรโทคอล MQTT v3.1.1 (OASIS Standard) และใช้งานร่วมกับ Zigbee2mqtt เพื่อทำหน้าที่เป็น Zigbee Gateway ให้กับอุปกรณ์ภายในบ้านที่สามารถสื่อสารและควบคุม โดยใช้โพรโทคอล Zigbee

ขั้นตอนการติดตั้ง Raspberry Pi OS / Raspbian OS

‍‍‍‍‍‍ ‍‍ ‍‍‍‍‍‍ ‍‍‍‍‍‍ ‍‍‍‍‍‍‍‍ ‍‍ ‍‍‍‍‍‍ ‍‍‍‍‍‍ ‍‍

การดำเนินการในส่วนแรก ขอเขียนโดยสรุปดังนี้ (ถ้าผู้อ่านมีความคุ้นเคยกับการใช้งานบอร์ด RPi มาบ้างแล้ว ก็สามารถข้ามไปได้)

1. ดาวน์โหลด Image File สำหรับ Raspberry Pi OS (aka Raspbian OS) และที่ได้นำมาใช้คือ 2020–05–27-raspios-buster-lite-armhf.zip จากนั้นทำขั้นตอน unzip ให้ได้ไฟล์ .img และใช้โปรแกรมเช่น Win32DiskImager (สำหรับระบบปฏิบัติการ Windows) หรือ Raspberry Pi Imager เขียนข้อมูลจากไฟล์ดังกล่าวไปยังการ์ดหน่วยความจำ microSD (แนะนำให้ใช้ขนาดอย่างน้อย 8 GB)

2. เมื่อทำขั้นตอนเขียนข้อมูล (Write) เสร็จแล้วจะมองเห็นไดร์ฟชื่อ boot จากนั้นให้สร้างไฟล์เปล่า (Empty File) ชื่อ ssh ไว้ในไดร์ฟดังกล่าว เราจะใช้งานบอร์ด RPi แบบ headless ผ่านทาง SSH (Secure Shell) — แต่ถ้าสะดวกที่ใช้งาน RPi แบบต่อ HDMI ไปยังจอภาพ และ USB Keyboard & Mouse ก็ทำได้เช่นกัน

3. ให้เชื่อมต่อบอร์ด RPi ทางพอร์ต RJ45 เข้ากับระบบเครือข่ายของเรา และเสียบการ์ด microSD แล้วบูทระบบ (ป้อนไฟเลี้ยง)

4. ในกรณีที่ทำงานแบบ headless ให้ใช้โปรแกรมตรวจหาดูว่า บอร์ด RPi ในระบบเครือข่ายตรงกับ IP Address หมายเลขใด จากนั้นเปิดโปรแกรมใช้งาน เช่น Putty หรือ Tera Term ที่สามารถเชื่อมต่อกับ RPi ด้วย SSH ได้ ระบุหมายเลข IP Address ของบอร์ด RPi และพอร์ต 22 เพื่อทำขั้นตอน Login โดยใช้ชื่อ pi และรหัสผ่าน raspberry

$ sudo raspi-config

5. ทำคำสั่งเพื่อตั้งค่าการใช้งาน เช่น ขยายขนาดของ Filesystem ให้เต็มความจุของ microSD, ตั้งชื่อ hostname ของระบบ, ตั้งรหัสผ่านใหม่สำหรับผู้ใช้ pi, เปลี่ยน Timezone เป็น Asia/Bangkok และตั้งค่าใช้งาน Wi-Fi เป็นต้น และทำคำสั่งเพื่ออัปเดตรายการไฟล์ต่าง ๆ ของระบบ (ดาวน์โหลดข้อมูลจากอินเทอร์เน็ต)

sudo apt-get update -y
sudo apt-get upgrade -y
sudo apt-get dist-upgrade -y

ลองมาดูข้อมูลของระบบที่พร้อมใช้งานแล้ว มีตัวอย่างจากการทำคำสั่งดังนี้

$ uname -a
Linux rpi4 4.19.118-v7l+ #1311 SMP Mon Apr 27 14:26:42 BST 2020 armv7l GNU/Linux$ cat /etc/os-release
PRETTY_NAME="Raspbian GNU/Linux 10 (buster)"
NAME="Raspbian GNU/Linux"
VERSION_ID="10"
VERSION="10 (buster)"
VERSION_CODENAME=buster
ID=raspbian
ID_LIKE=debian
HOME_URL="http://www.raspbian.org/"
SUPPORT_URL="http://www.raspbian.org/RaspbianForums"
BUG_REPORT_URL="http://www.raspbian.org/RaspbianBugs"

การติดตั้ง Mosquitto

‍‍‍‍‍‍ ‍‍ ‍‍‍‍‍‍ ‍‍‍‍‍‍ ‍‍

ให้ทำคำสั่งเพื่อตรวจสอบดูก่อนว่า มีซอฟต์แวร์ที่เกี่ยวข้องกับชื่อ “mosquitto” ใน Repository สำหรับ RPi หรือไม่ และจากข้อความตัวอย่าง เราจะเห็นว่า มีรายการที่เกี่ยวข้องอยู่หลายรายการ

$ sudo apt-cache search mosquittolibmosquitto-dev - MQTT version 3.1/3.1.1 client library, development files
libmosquitto1 - MQTT version 3.1/3.1.1 client library
libmosquittopp-dev - MQTT version 3.1 client C++ library, development files
libmosquittopp1 - MQTT version 3.1/3.1.1 client C++ library
mosquitto - MQTT version 3.1/3.1.1 compatible message broker
mosquitto-clients - Mosquitto command line MQTT clients
mosquitto-dev - Development files for Mosquitto

ทำคำสั่งเพื่อติดตั้งโปรแกรม Mosquitto ทั้งแบบ Server และแบบ Clients

$ sudo apt install mosquitto mosquitto-clients libmosquitto-dev

ตามด้วยคำสั่งเพื่อตรวจสอบดูเวอร์ชันของ Mosquitto ที่ได้ติดตั้งใช้งาน (v1.5.7) และได้ข้อความเอาต์พุตตามตัวอย่างต่อไปนี้

1591592353: mosquitto version 1.5.7 starting
1591592353: Using default config.
1591592353: Opening ipv4 listen socket on port 1883.
1591592353: Error: Address already in use

จากข้อความตัวอย่าง จะเห็นได้ว่า Mosquitto เริ่มทำงานแล้ว (โดยใช้การตั้งค่าแบบ default)

ถัดไปเป็นตัวอย่างการกำหนดรูปแบบการใช้งานของ Mosquitto Configuration โดยให้แก้ไขไฟล์ต่อไปนี้ (ในตัวอย่างนี้ เราใช้คำสั่ง nano เป็น Command-line Editor)

$ sudo nano /etc/mosquitto/mosquitto.conf

ให้เพิ่มบรรทัดต่อไปนี้ ต่อท้ายลงในไฟล์ดังกล่าว แล้วบันทึกการแก้ไขแล้วจบการทำงานของ nano editor (กดคีย์ Ctrl+O ตามด้วย Ctrl+X)

# default listener
port 1883# additional listener for websockets
listener 9001
protocol websocketsallow_anonymous false
password_file /etc/mosquitto/passwd

จากตัวอย่างเราได้กำหนดการใช้งานดังนี้

  • เปิดใช้พอร์ต 1883 สำหรับ MQTT (แต่ไม่ได้ใช้งานผ่าน SSL/TLS)
  • เปิดใช้พอร์ต 9001 สำหรับโพรโทคอล WebSockets (แต่ไม่ได้ใช้งานผ่าน SSL/TLS)
  • ไม่อนุญาตให้เชื่อมต่อโดยไม่มีการระบุชื่อผู้ใช้และรหัสผ่าน (บังคับให้มี User Authentication)

คำแนะนำ: ถ้าใช้งาน Mosquitto เป็น Public MQTT Broker แนะนำให้เปิดใช้งานผ่าน SSL/TLS เท่านั้น เพื่อเพิ่มระดับความปลอดภัย แต่จะไม่ขอกล่าวถึงในรายละเอียดสำหรับบทความนี้

เราต้องการให้โปรแกรมที่ทำหน้าที่เป็น Mosquitto Client ต้องระบุชื่อผู้ใช้และรหัสผ่าน ดังนั้นเราจึงสร้างผู้ใช้สำหรับ Mosquitto ก่อนจะใช้งาน โดยทำคำสั่งดังนี้ (พิมพ์รหัสผ่านที่ต้องการใช้สองครั้ง)

$ sudo mosquitto_passwd -c /etc/mosquitto/passwd "zigbee2mqtt"

ในตัวอย่างนี้เราใช้ชื่อ zigbee2mqtt และรหัสผ่านที่เหมือนกัน เมื่อสร้างผู้ใช้ ได้สำเร็จแล้ว จะมีรายการเพิ่มขึ้นอีกหนึ่งบรรทัดในไฟล์ /etc/mosquitto/passwd

เมื่อแก้ไขไฟล์ต่างๆ แล้ว เราจะต้องทำคำสั่งให้ Mosquitto เริ่มต้นทำงานใหม่ ดังนี้

$ sudo service mosquitto restart

และทำคำสั่งเพื่อตรวจสอบสถานะการทำงานตามลำดับ

$ service mosquitto status
ตัวอย่างข้อความเมื่อทำคำสั่ง service mosquitto status

‍‍‍‍‍‍ ‍‍ ‍‍‍‍‍‍ ‍‍‍‍‍‍ ‍‍

ถัดไปลองส่งข้อความ (Publish) ไปยัง Mosquitto MQTT Broker โดยทำคำสั่งหนึ่งบรรทัดดังนี้

$ mosquitto_pub -d -h localhost -p 1883 -u zigbee2mqtt -P zigbee2mqtt -q 1 -t test -m 'test'

คำอธิบาย:

-d แสดงข้อความสำหรับ Debug
-h ระบุชื่อ MQTT Server (ในกรณีเราใช้ localhost ของเราเอง)
-p ระบุหมายเลขพอร์ต (MQTT port)
-u ระบุชื่อผู้ใช้ (Username)
-P ระบุรหัสผ่านสำหรับผู้ใช้ (Password)
-q ระบุระดับของ QoS (มีระดับ 0, 1, 2)
-t ระบุชื่อหัวข้อ (Topic Name)
-m ระบุข้อความ (Message Text)

ในกรณีตัวอย่างนี้ ถ้าสามารถส่งข้อความ test ในหัวข้อ test ได้สำเร็จ จะเห็นข้อความเอาต์พุตในลักษณะต่อไปนี้

Client mosqpub|9525-rpi4b-2gb sending CONNECT
Client mosqpub|9525-rpi4b-2gb received CONNACK (0)
Client mosqpub|9525-rpi4b-2gb sending PUBLISH (d0, q1, r0, m1, 'test', ... (4 bytes))
Client mosqpub|9525-rpi4b-2gb received PUBACK (Mid: 1)
Client mosqpub|9525-rpi4b-2gb sending DISCONNECT

ถ้าไม่ระบุชื่อหรือรหัสผ่านให้ถูกต้อง จะได้ข้อความตอบกลับดังนี้ (ถูกปฏิเสธการเชื่อมต่อ)

Connection Refused: not authorized.
Error: The connection was refused.

ถ้าเราต้องการจะปิด Mosquitto service ไม่ให้ทำงานโดยอัตโนมัติเมื่อเปิดระบบ ก็ให้ทำคำสั่งดังนี้

$ sudo service mosquitto stop
$ sudo systemctl disable mosquitto.service

แต่ถ้าจะตั้งค่าให้ทำงานโดยอัตโนมัติเหมือนเดิม ก็ทำคำสั่ง

$ sudo systemctl enable mosquitto.service
$ sudo service mosquitto start

ถึงตอนนี้ เราก็สามารถใช้ Mosquitto เป็น (Private) MQTT Broker โดยใช้บอร์ด RPi ในระบบเครือข่าย LAN/WLAN ของเราได้แล้ว

การติดตั้ง Zigbee2mqtt

‍‍‍‍‍‍ ‍‍ ‍‍‍‍‍‍ ‍‍‍‍‍‍ ‍‍‍‍‍‍‍‍ ‍‍ ‍‍‍‍‍‍ ‍‍‍‍‍‍ ‍‍

เนื่องจาก Zigbee2mqtt ทำงานด้วย Nodejs เราจะต้องติดตั้ง Nodejs โดยเลือกใช้เวอร์ชัน v12.x สำหรับ RPi โดยทำคำสั่งดังนี้ (และทำคำสั่งติดตั้งโปรแกรม เช่น git และ curl เป็นต้น)

$ sudo apt -y install curl git wget make g++ gcc$ curl -sL https://deb.nodesource.com/setup_12.x | sudo -E bash -$ sudo apt -y install nodejs

ตรวจสอบดูว่า Nodejs ที่ได้ติดตั้งนั้นเป็นเวอร์ชันใด โดยทำคำสั่งดังนี้

$ node -v
v12.18.0

จากนั้นให้ดาวน์โหลดซอร์สโค้ดของ Zigbee2MQTT จาก github แล้วทำขั้นตอน Build โดยทำคำสั่งตามลำดับต่อไปนี้ (อ้างอิงจากเอกสาร “Running Zigbee2mqtt”)

$ sudo git clone https://github.com/Koenkk/zigbee2mqtt.git /opt/zigbee2mqtt$ sudo chown -R pi:pi /opt/zigbee2mqtt

$ cd /opt/zigbee2mqtt && npm ci

จากนั้น ก่อนเริ่มเปิดใช้งาน Zigbee2mqtt จะต้องตั้งค่าการใช้งานก่อนดังนี้

$ nano /opt/zigbee2mqtt/data/configuration.yaml

แก้ไขไฟล์ตามตัวอย่างดังนี้

# Home Assistant integration (MQTT discovery)
homeassistant: false# allow new devices to join
permit_join: true# MQTT settings
mqtt:
  # MQTT base topic for zigbee2mqtt MQTT messages
  base_topic: zigbee2mqtt
  # MQTT server URL
  server: 'mqtt://localhost:1883'
  # MQTT server authentication, uncomment if required:
  user: zigbee2mqtt
  password: zigbee2mqtt# Serial settings
serial:
  # Location of CC2531 USB sniffer
  port: /dev/ttyACM0
  # Disable Green LED
  disable_led: true# Advanced settings
advanced:
  # Regenerate ZigBee network key
  network_key: GENERATE

จากตัวอย่างนี้ เราจะเห็นว่า Zigbee2mqtt ส่งและรับข้อความ (Pub/Sub) กับ Mosquitto ในเครื่องคอมพิวเตอร์เดียวกัน โดยใช้ชื่อหัวข้อเป็น zigbee2mqtt อีกทั้งจะต้องระบุชื่อผู้ใช้และรหัสผ่านที่เราได้สร้างไว้สำหรับ Mosquitto อีกด้วย

ในแง่ของความความปลอดภัย เมื่ออุปกรณ์ของเราได้เชื่อมต่อกับ Zigbee2mqtt ได้แล้ว ก็ให้แก้ไข permit_join เป็น false เพื่อป้องกันไม่ให้อุปกรณ์อื่นที่ไม่ได้รับอนุญาต เข้ามา join เครือข่ายของเรา

เมื่อได้แก้ไขไฟล์ เรียบร้อยแล้ว ถัดไปจะต้องใช้อุปกรณ์ TI CC2531 USB Dongle ที่ได้ติดตั้งเฟิร์มแวร์ เพื่อใช้เป็น Zigbee Coordinator เอาไว้แล้ว

รายละเอียดเกี่ยวกับอุปกรณ์และขั้นตอนการใช้งาน TI CC2531 USB Dongle สามารถอ่านได้จากบทความ “Smart Home with Zigbee2mqtt: Using CC2531 USB Stick as ZigBee Coordinator”

ตัวอย่างอุปกรณ์: บอร์ด RPi 4 + CC2531 USB Adapter

‍‍‍‍‍‍ ‍‍ ‍‍‍‍‍‍ ‍‍‍‍‍‍ ‍‍

ให้เสียบอุปกรณ์ที่พอร์ต USB ของบอร์ด RPi ตรวจสอบดูว่า สามารถมองเห็นอุปกรณ์หรือไม่ โดยทำคำสั่งต่อไปนี้ ถ้าพร้อมใช้งาน จะมองเห็นอุปกรณ์หมายเลข “0451:16a8” และโดยทั่วไปจะมองเห็นได้ที่พอร์ต /dev/ttyACM0

$ lsusb | grep Texas
Bus 001 Device 003: ID 0451:16a8 Texas Instruments, Inc.

จากนั้นทำคำสั่งเพื่อลองให้โปรแกรม Zigbee2mqtt เริ่มต้นทำงาน

$ cd /opt/zigbee2mqtt && npm start

แต่ถ้ากดปุ่ม Ctrl+C จะจบการทำงานของคำสั่งดังกล่าว

โดยทั่วไปแล้ว เราต้องการให้ Zigbee2mqtt เริ่มทำงานโดยอัตโนมัติ (เช่นเดียวกับ Mosquitto) เมื่อเปิดระบบใช้งาน ดังนั้นให้สร้างไฟล์ต่อไปนี้

$ sudo nano /etc/systemd/system/zigbee2mqtt.service

แล้วเพิ่มบรรทัดดังนี้ บันทึกลงในไฟล์

[Unit]
Description=zigbee2mqtt
After=network.target

[Service]
ExecStart=/usr/bin/npm start
WorkingDirectory=/opt/zigbee2mqtt
StandardOutput=inherit
StandardError=inherit
Restart=always
User=pi

[Install]
WantedBy=multi-user.target

จากนั้นทำคำสั่งเพื่อเริ่มต้นใช้งาน

$ sudo systemctl enable zigbee2mqtt.service
$ sudo systemctl start zigbee2mqtt

ตรวจสอบสถานะ โดยทำคำสั่งดังนี้ ซึ่งจะได้สถานะเป็น active (running)

$ service zigbee2mqtt status

ปัญหาที่อาจเกิดขึ้นได้: เมื่อโปรแกรม zigbee2mqtt เริ่มต้นทำงาน และพยายามเข้าใช้งานอุปกรณ์ USB CC2531 Dongle ภายใต้ชื่อที่กำหนดไว้ เช่น /dev/ttyACM0 แต่ไม่สามารถเชื่อมต่อได้ อาจมีสาเหตุดังนี้

  • ชื่ออุปกรณ์ไม่ถูกต้อง
  • มีโปรแกรมอื่นทำงานอยู่แล้วกำลังเปิดใช้งานอุปกรณ์ดังกล่าว เช่น ModemManager
  • ถ้าตรวจสอบดูว่าแล้ว มีการเปิดใช้งาน ModemManager เอาไว้ ให้ยกเลิกการใช้งาน โดยทำคำสั่งดังนี้ sudo apt-get purge modemmanager

การทดสอบเพื่อเชื่อมต่อกับอุปกรณ์ ZigBee

‍‍‍‍‍‍ ‍‍ ‍‍‍‍‍‍ ‍‍‍‍‍‍ ‍‍

ถัดไปเราจะต้องหาอุปกรณ์ Zigbee Device มาทดสอบ และสำหรับวัตถุประสงค์นี้ เราได้ลองใช้กับอุปกรณ์ MiJia WSDCGQ01LM Temperature & Humidity Sensor ภายใต้แบรนด์ Xiaomi

เมื่อใส่แบตเตอรีแล้ว ให้กดปุ่มที่ตัวอุปกรณ์ดังกล่าว ค้างเอาไว้อย่างน้อย 5 วินาที หลังจากนั้นอุปกรณ์ จะเริ่มค้นหา Zigbee Coordinator ในบริเวณรอบ และขอเชื่อมต่อ (Join) เข้าสู่เครือข่ายดังกล่าว

ข้อความเอาต์พุตต่อไปนี้ ได้จากการทำงานของ Zigbee2mqtt (สามารถดูได้จากไฟล์ log.txt ภายใต้ /opt/zigbee2mqtt/data/log/) เมื่ออุปกรณ์ WSDCGQ01LM Sensor Device สามารถเชื่อมต่อได้สำเร็จ

zigbee2mqtt:info  2020-06-08 08:18:05: Device '0x00158d00xxxxxxxx' is supported, identified as: Xiaomi MiJia temperature & humidity sensor (WSDCGQ01LM)zigbee2mqtt:info  2020-06-08 08:18:05: MQTT publish: topic 'zigbee2mqtt/bridge/log', payload '{"type":"pairing", "message":"interview_successful", "meta":{"friendly_name":"0x00158d00xxxxxxxx", "model":"WSDCGQ01LM", "vendor":"Xiaomi", "description":"MiJia temperature & humidity sensor", "supported":true}}'

หลังจากนั้น อุปกรณ์จะส่งข้อความไปยัง Zigbee Coordinator และ Zigbee2mqtt จะได้รับความแล้วส่งต่อเป็นข้อความแบบ JSON ไปยัง Mosquitto MQTT Broker ตามลำดับ

zigbee2mqtt:info  2020-06-08 08:25:01: MQTT publish: topic 'zigbee2mqtt/0x00158d00xxxxxxxx', payload '{"battery":100, "voltage":3005, "temperature":31.64, "humidity":36.93, "linkquality":139}'

อีกหนึ่งตัวอย่างอุปกรณ์คือ Xiaomi ZNCZ02LM Smartplug เมื่อเสียบปลั๊กแล้วกดปุ่มของอุปกรณ์ค้างไว้ (Long Press) แล้วปล่อย (แต่ถ้ากดแบบ Short Press เป็นการเปิดหรือปิดการจ่ายไฟฟ้าให้โหลด) เป็นการเริ่มต้นขอเข้าร่วมเครือข่าย และเราจะเห็นข้อความใน Log File ตามตัวอย่างนี้

zigbee2mqtt:info  2020-06-08 14:55:46: MQTT publish: topic 'zigbee2mqtt/0x00158d00yyyyyyyy', payload '{"state":"OFF", "power":0, "voltage":null, "consumption":0, "temperature":40, "linkquality":81}'

ถ้าเราอยากทราบสถานะการทำงานของ Zigbee2mqtt ที่เกิดขึ้นผ่านทาง MQTT Broker เราก็สามารถทำคำสั่งต่อไปนี้ เพื่อคอยรับข้อความ (Subscribe)

$ mosquitto_sub -h localhost -t "zigbee2mqtt/#" -v -u zigbee2mqtt -P 'zigbee2mqtt'

การนำข้อมูลมาแสดงบนหน้าเว็บด้วย WebSockets

‍‍‍‍‍‍ ‍‍ ‍‍‍‍‍‍ ‍‍‍‍‍‍ ‍‍

หลังจากที่เราสามารถทำให้ระบบทำงานได้แล้ว ถัดไปเป็นการสาธิตวิธีการรับข้อมูลจาก Mosquitto MQTT Broker โดยใช้ WebSockets แล้วนำมาแสดงผลบนหน้าเว็บ

เราจะใช้ไลบรารี mqttws31 ในภาษา JavaScript ที่ช่วยในการเชื่อมต่อผ่าน WebSockets และส่ง MQTT Message ไปยัง MQTT Broker ได้

ในตัวอย่างนี้ เราต้องการนำข้อมูลจาก WSDCGQ01LM Temperature & Humidity Sensor มาแสดงผลบนหน้าเว็บ ซึ่งจะข้อมูล 4 ส่วน คือ

  • battery: ปริมาณแบตเตอรี่ที่เหลืออยู่ (หน่วยเป็นเปอร์เซ็นต์)
  • voltage: ระดับแรงดันของแบตเตอรี่ (หน่วยเป็นมิลลิโวลต์)
  • temperature: ค่าอุณหภูมิ (หน่วยเป็นองศาเซลเซียส)
  • humidity: ค่าความชื้นสัมพัทธ์ (หน่วยเป็นเปอร์เซ็นต์)

เราจะต้องทราบหมายเลขอุปกรณ์เพื่อเจาะจงในการรับข้อมูล หรือที่เรียกว่า “Friendly Name” สำหรับ Zigbee2mqtt ยกตัวอย่างเช่น 0x00158d00xxxxxxxx และนำไปใช้ระบุชื่อหัวข้อสำหรับ MQTT ในกรณีที่เราต้องการรับข้อมูลด้วยวิธี MQTT Subscribe เช่น zigbee2mqtt/0x00158d00xxxxxxxx

มาลองดูตัวอย่างโค้ดดังนี้ (ใช้เพื่อการสาธิตการทำงานเท่านั้น)

<!DOCTYPE HTML>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<style>
  * { box-sizing: border-box; }
  .column {
    float: left;
    padding: 10px;
    width: 24.8%;
    height: 24vw;
    background-color: #32871f;
    color: white;
    text-align: center;
    margin: 10px 0.1%;
    font-family: arial;
  }
  .row:after {
    content: "";
    display: table;
    clear: both;
  }
  .head {
    font-size: 3vw;
    height: 3vw;
  }
  .value {
    font-size: 4vw;
    color: #cfff0f;
    height: 4vw;
  }
  .unit {
    font-size: 3vw;
  }
</style>
<script src="mqttws31.min.js" type="text/javascript"></script>
<script src="jquery-3.5.1.min.js" type="text/javascript"></script><script type="text/javascript">
// see: https://www.eclipse.org/paho/clients/js/
// see: https://cdnjs.cloudflare.com/ajax/libs/paho-mqtt/1.0.1/mqttws31.min.js
// see: https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.1/jquery.min.jsvar mqtt_host     = '192.168.1.10'; // MQTT server
var mqtt_port     = 9001;           // MQTT port (websockets)
var mqtt_username = 'zigbee2mqtt';  // MQTT username
var mqtt_passwd   = 'zigbee2mqtt';  // MQTT password
var mqtt_topic    = 'zigbee2mqtt/0x00158d00xxxxxxxx'; // topicvar id = Math.floor(Math.random()*1000000);
var client = new Paho.MQTT.Client(mqtt_host, Number(mqtt_port), "clientId" + id.toString() );function processMessage(msg) {
  try {
    json_data = JSON.parse(msg);
    return json_data;
  } catch (e) {
    return null;
  }
}client.onConnectionLost = function (e) {
  console.log("Connection Lost: "+ e.errorMessage);
}client.onMessageArrived = function (e) {
  var msg = e.payloadString;
  console.log("Message received: "+ msg);
  data = processMessage( msg );
  if (data) {
    console.log( data );
    $('#battery').text( data['battery'] );
    $('#voltage').text( data['voltage'] );
    $('#temperature').text( data['temperature']  );
    $('#humidity').text( data['humidity']  );
  } else {
    console.log( msg );
  }
}function onConnect(){
  console.log("Connected!");
  client.subscribe(mqtt_topic);
}function mqtt_connect() {
  client.connect( {
    useSSL: false,
    userName: mqtt_username,
    password: mqtt_passwd,
    onSuccess: onConnect,
  } );
}
</script>
</head>
<body>
  <script> mqtt_connect(); </script>
  <div class="row">
    <div class="column">
      <p class="head">Battery Level</p>
      <p class="value" id="battery">???</p>
      <p class="unit">%</p>
    </div>
    <div class="column">
      <p class="head">Battery Voltage</p>
      <p class="value" id="voltage">???</p>
      <p class="unit"> mV</p>
    </div>
    <div class="column">
      <p class="head">Temperature</p>
      <p class="value" id="temperature">???</p>
      <p class="unit"> &deg; C</p>
    </div>
    <div class="column">
      <p class="head">Humidity</p>
      <p class="value" id="humidity">???</p>
      <p class="unit"> %RH</p?
    </div>
  </div>
</body>

เมื่อมีการเปลี่ยนแปลงค่าอุณหภูมิหรือความชื้นสัมพัทธ์ หรือกดที่ปุ่มของอุปกรณ์ จะมีการอัปเดทข้อมูลบนหน้าเว็บโดยอัตโนมัติ

ตัวอย่างหน้าเว็บที่สามารถรับข้อมูลมาแสดงผลได้

โดยสรุป เราได้เรียนรู้การติดตั้งใช้งานซอฟต์แวร์สำหรับ Raspberry Pi เพื่อทำให้เราสามารถเชื่อมต่อกับตัวอย่างอุปกรณ์ Smart Home Zigbee Devices ได้ และสามารถเชื่อมต่อเพื่อรับข้อมูลสถานะของอุปกรณ์ผ่านทาง MQTT Broker แล้วนำมาแสดงผลบนหน้าเว็บได้ และหวังว่า จะเป็นตัวเลือกหนึ่งสำหรับการเรียนรู้เกี่ยวกับฮาร์ดแวร์ ซอฟต์แวร์ และการฝึกเขียนโค้ดเพื่อใช้ประโยชน์จากระบบดังกล่าวต่อไป

Embedded Systems
Raspberrypi
Mqtt
Mosquitto
Zigbee2mqtt

--

--

<rawat.s>
<rawat.s>

Written by <rawat.s>

236 Followers
2 Following

I'm Thai and working in Bangkok/Thailand.

No responses yet

Help

Status

About

Careers

Press

Blog

Privacy

Terms

Text to speech

Teams