top of page

ลองเล่น Blynk 2.0 กับ ESP32

อัปเดตเมื่อ 27 มิ.ย. 2565



หลังจาก Blynk (legacy) ปิดตัวไปเมื่อไม่นานมานี้ และทางผู้พัฒนา Blynk แนะนำให้เปลี่ยนเป็นเวอร์ชั่นใหม่ (2.0) ในบทความนี้จึงจะมาแนะนำและลองเล่น Blynk 2.0 โดยใช้บอร์ด KidBright ที่ภายในใช้ ESP32 ในการทดลองส่ง-รับข้อมูลผมแสดงผลบนแอพฯ และเว็บ โดยทดลองทั้งการสั่งงานขาต่าง ๆ และใช้ Virtual Pin ส่งค่าอุณหภูมิขึ้นมาแสดงผล ใช้ Platform IO ในการพัฒนาโปรแกรม

โครงสร้างบอร์ด KidBright

บอร์ด KidBright เป็นบอร์ด ESP32 ที่มีเซ็นเซอร์ อุปกรณ์รับค่า และอุปกรณ์แสดงผล หลาย ๆ ตัวอยู่บนบอร์ด ทำให้สะดวกต่อการทดลอง โดยในบทความนี้เลือกใช้หลอดแอลดีอี WiFi และ IOT มาทดลองควบคุมเปิด-ปิด และใช้เซ็นเซอร์วัดอุณหภูมิ LM73 โครงสร้างและการต่อขากับ ESP32 (Internal Wiring) แสดงดังรูปที่ 1

รูปที่ 1 KidBright32 Advanced User Diagram

ตำแหน่งขาของอุปกรณ์ที่ใช้ทดลอง มีดังนี้

  • WiFi LED -> IO2

  • IOT LED -> IO12

  • LM73 -> SDA: 4, SCL: 5

ตำแหน่งขาเหล่านี้จะถูกนำไปใช้ตั้งค่าในเว็บ Blynk และเขียนโปรแกรมใน Platform IO ต่อไป

การใช้งาน Blynk 2.0 บนเว็บ

Blynk (legacy) การใช้งานทั้งหมดสามารถทำได้บนแอพฯ ในโทรศัพท์มือถอืได้เลย แต่สำหรับ New Blynk / Blynk 2.0 แนะนำให้สร้าง Templates และเพิ่มอุปกรณ์ในเว็บก่อน โดยมีขั้นตอนดังนี้

1) เข้าไปที่ https://blynk.cloud/ จากนั้นสมัครสมาชิก-เข้าสู่ระบบให้เรียบร้อย จากนั้นกดเมนู Templates แล้วกด New Tamplate

2) ใส่รายละเอียดของ Template โดยใส่ชื่อ Template เลือก Hardware และเลือก Connection Type แล้วกด Done

3) กำหนดขาที่ใช้งาน และช่องทางการรับส่งข้อมูล โดยกดที่ Datastreams แล้วกดปุ่ม New Datastreams

4) Datastreams ต้องสร้าง 3 ช่อง โดยแบ่งดังนี้

  1. Digital, Pin 2, Output สำหรับใช้ควบคุม WiFI LED

  2. Digital, Pin 12, Output สำหรับใช้ควบคุม IOT LED

  3. Virtual Pin, Pin V0 สำหรับใช้แสดงค่าอุณหภูมิ

Datastreams อันแรก WiFi LED กดเลือก Digital

5) ใส่ชื่อตรง Name เป็น WiFi_LED เลือก Pin เป็น 2 เลือก Pin Mode เป็น 3 แล้วกด Create

6) จะมี WiFi_LED ขึ้นมา ยังขาด IOT_LED และ V0 ที่ใช้แสดงค่าอุณหภูมิ กด New Datastream เพื่อสร้าง IOT_LED ตามขั้นตอน 4 ถึง 6 อีกครั้ง

7) สร้าง Virtual Pin, Pin V0 สำหรับใช้แสดงค่าอุณหภูมิ กด New Datastream เลือก Virtual Pin

8) ตั้งค่าดังนี้

  1. ตั้งชื่อ

  2. เลือก Virtual Pin เป็น V0

  3. Data Type มี int, double และ String สำหรับอุณหภูมิเป็นค่าทศนิยม จึงเลือกเป็น Double

  4. Units เลือก Celsius

  5. Max กำหนดค่าสูงสุดที่เป็นไปได้ แนะนำให้ใส่ 100

  6. Decimals กำหนดทศนิยม แนะนำให้เลือก #.# คือทศนิยม 1 ตำแหน่ง

แล้วกดปุ่ม Create

9) ได้ Datastreams มา 3 ชุด ตามรูป

10) สร้าง Dashboard บนเว็บ โดยกดไปที่เมนู Web Dashboard ด้านขวามี Widget ให้เลือก คลิกค้างที่ Switch แล้วลากมาใส่พื้นที่ทำงานด้านขวา แล้วกดรูปเฟืองเพื่อแก้ไขข้อมูล

11) แก้ไขข้อมูลของ Widget Switch ดังนี้

  1. ตั้งชื่อของสวิตช์ เนื่องจากสวิตช์นี้ใช้ควบคุม WiFi LED จึงตั้งเป็น WiFi LED

  2. Datastream เลือก WiFi_LED

  3. ON Value ใส่ 0

  4. OFF Value ใส่ 1

  5. กดปุ่ม Save

สำหรับหลอด LED บนบอร์ด KidBright เป็นแบบ Active LOW ดังนั้น 0 คือไฟติด, 1 คือไฟดับ จึงกำหนดให้ ON=0, OFF=1

12) เพิ่ม Widget Switch อีก 1 ชุด แล้วตั้งค่าสำหรับ IOT LED

13) เพิ่ม Widget Label สำหรับแสดงผลค่าอุณหภูมิ

14) ตั้งค่า Widget Label สำหรับแสดงผลค่าอุณหภูมิ ดังรูป

15) กดปุ่ม Save เพื่อบันทึก Template

16) เพิ่มอุปกรณ์ใหม่ กดเมนูรูปแว่นด้านซ้าย แล้วกดปุ่ม New Device

17) กดสร้างอุปกรณ์ใหม่จาก template

18) เลือก Template เป็น Template ที่สร้างไว้ ตั้งชื่อ Device Name ที่ต้องการสร้าง แล้วกด Create

19) เมื่อสร้าง Device Info เรียบร้อยแล้ว กดตรง Device Info ตรง FIRMWARE CONFIGURATION จะต้องนำไปใส่ในโค้ดในขั้นตอนต่อไป

อัพโหลดโปรแกรม

รู้จักและใช้งาน PlatformIO เบื้องต้น จากนั้นดำเนินการดังนี้

1) ดาวน์โหลดโค้ดโปรแกรมตัวอย่างจาก https://github.com/maxpromer/NewBlynkTest โดยกด Code > Download Zip

2) รอจนกว่าจะดาวน์โหลดเสร็จ แล้วแตกไฟล์ออกมา

3) เปิดโปรแกรม VS Code ที่ติดตั้ง Platform IO เปิดโปรเจคขึ้นมาโดยกด File > Open Folder...

4) เข้าไปในโฟลเดอร์ตามข้อ 2 แล้วกด Select Folder

5) เปิดไฟล์ main.cpp แล้วคัดลอก FIRMWARE CONFIGURATION ไปทับในบรรทัด 36 ถึง 38 จากนั้นแก้ชื่อ WiFi และรหัสผ่าน ในบรรทัดที่ 50 - 51

6) อัพโหลดโปรแกรม จากนั้นเปิด Serial Monitor ขึ้นมา หากแก้ไขข้อมูลถูกต้อง จะแสดง Ready ดังรูป

ทดลองสั่งงานจากบนเว็บ

ที่หน้าเว็บ หากอุปกรณ์สามารถเชื่อมต่อได้ สถานะอุปกรณ์บนเว็บจะขึ้นเป็น Online เมื่อทดลองกดปุ่ม WiFi LED จะสังเกตเห็นว่าสามารถควบคุมหลอดแอลอีดี WiFi ได้แล้ว หากกดปุ่ม IOT LED จะควบคุมเปิด-ปิดแอลอีดี IOT ได้ และมีค่าอุณหภูมิแสดงในช่อง Temperature อัพเดทค่าทุก ๆ 1 วินาที

การสั่งงานผ่านแอพฯ

การสั่งงานผ่านแอพฯ สามารถทำได้ผ่านแอพฯ Blynk IoT โดยติดตั้งได้จาก Google Play

หลังจากติดตั้ง จำเป็นต้องสร้างหน้า Dashboard บนแอพฯก่อน ตามขั้นตอนดังนี้

1) เปิด Blynk IoT เข้าสู่ระบบให้เรียบ จากนั้นกด ไอค่อนมุมขวาบน

2) กด Developer Mode

3) กดเลือก Template ที่สร้างไว้บนเว็บจากขั้นตอนก่อนหน้านี้

4) ระบบจะพามาหน้าจัดการ Dashboard กดเครื่องหมายบวกเพื่อเพิ่ม Widget

5) เพิ่มปุ่มควบคุม WiFi LED กดเลือก Button

6) กดที่รูป Button เพื่อตั้งค่า

7) ตั้งค่า Button ที่ใช้ควบคุม WiFi LED ดังนี้

  1. ตั้งชื่อ Widget

  2. DATASTREAM กำหนดเป็น WiFi_LED

  3. OVERRIDE HIGH/LOW เลือกเป็น ON

  4. VALUE กำหนดเป็น 1 และ 0 ตามลำดับ

  5. MODE เลือกเป็น SWITCH

  6. ON/OFF LABELS

เสร็จแล้วกดปุ่มย้อนกลับ

8) จะได้ปุ่มควบคุม WiFi LED แล้ว ทำตามขั้นตอน 6 - 8 อีกครั้งเพื่อเพิ่มปุ่ม IOT LED

9) เพิ่ม Widget: Value Display เพื่อใช้แสดงผลอุณหภูมิ

10) กดที่ Widget ใหม่ เพื่อตั้งค่า

11) ตั้งค่า Widget ใหม่ ดังนี้

  1. Name ใส่ชื่อของ Widget นี้ ตัวอย่างใช้แสดงค่าอุณหภูมิ จึงใส่ Temperature

  2. DATASTREAM กำหนดเป็น Temp

12) เพิ่ม Widget ครบ (ดังรูป) ให้กดปุ่มย้อนกลับ

12) กดปุ่มปิดหน้าต่าง Developer Mode

13) ได้หน้า Dashboard ที่สมบูรณ์

ทดลองสั่งงานจากแอพฯ

เมื่อทดลองกดปุ่ม WiFi LED จะเห็นว่าสามารถควบคุมหลอดแอลอีดี WiFi ได้ หากกดปุ่ม IOT LED จะควบคุมเปิด-ปิดแอลอีดี IOT ได้ และมีค่าอุณหภูมิแสดงในช่อง Temperature อัพเดทค่าทุก ๆ 1 วินาที


ดู 2,718 ครั้ง0 ความคิดเห็น

Comentarios


bottom of page