แหล่งซื้ออุปกรณ์ที่ใช้ทดลองต่างๆของ "เฮ็ดสิดี"

Arduino#21 การใช้งาน WiFimanager กับ ESP8266

การใช้งาน WiFi Manager สำหรับ ESP8266 จะทำให้เรานำชิ้นงานไปใช้งานกับ WiFi ที่อื่นได้ง่ายๆ โดยไม่ต้อง Upload Code ใหม่ครับ

[ อุปกรณ์ที่ใช้ สามารถหาซื้อได้ตามร้านอิเล็กทรอนิกส์ หรือร้านค้าออนไลน์ทั่วไปครับ

หรือกดสั่งซื้อที่นี่ก็ได้ครับ (ผมสั่งจาก LAZADA ครับ) NodeMCU+Base 👉 https://bit.ly/3fKoave ]

บทความนี้ จะแนะนำวิธีการนำ WiFiManager มาใช้งานกับ Code ของเรานะครับ จะสอดคล้องกับวีดีโอ Arduino#21 นะครับ แต่สามารถนำไปประยุกต์กับ Code อื่นๆได้ตามต้องการครับ 

ขั้นตอนการทำ WiFimanager มีดังนี้ครับ 
เมื่อชิ้นงานของเราสำเร็จแล้ว Code ต่างๆก็เรียบร้อยแล้ว จะนำไปใช้งานจริง หรือจะทำส่งลูกค้า ให้เราเพิ่ม Code เข้าไปใน Code ของเรา ในที่นี้ผมจะใช้ Code ของเครื่องแจ้งเตือนไฟดับของผมเองนะครับ โดยอันดับแรกจะต้อง Add Library WiFiManager ก่อนนะครับ 
เข้าไปที่ Sketch>include Library>Manage Libraries ครับ
เลื่อลงมาเกือบล่างๆ จะเจอ ไลบรารี่ที่ชื่อว่า WiFimanager อยู่ครับ (ตอนนี้เป็นเวอร์ชั่น 2.0.3 นะครับ)
ก็กด Install ได้เลยครับ
อีกไลบรารี่หนึ่งที่ต้อง install คือ ArduinoJson ก็พิมพ์ ArduinoJson ที่ช่องเดิมครับ แต่ให้เลือกเป็น เวอร์ชั่น 5.x.x นะครับ ถ้าเลือกเป็นเวอร์ชั่น 6 แล้วมันจะ error ครับ เหมือน WiFimanager กับ JSON6 ยังมีปัญหากันอยู่ เดี๋ยวถ้าใช้ ArduinoJson6 ได้เมื่อไหร่ จะมาอัพเดทให้อีกทีครับ (ของผมเลือก 5.13.4 ครับ)
อีกอย่าง เวอร์ชั่นของบอร์ดให้เลือกเป็น 2.7.4 โดยเข้าตามนี้ครับ

พิมพ์ ESP8266 ในช่องค้นหา แล้วเลือกเวอร์ชั่น 2.7.4 แล้ว INSTALL ครับ
(เนื่องจากหากใช้เวอร์ชั่นล่าสุด ผมลองทำแล้วมัน error ครับ)
ลงไลบรารี่เสร็จแล้ว มาดูส่วน Code เราเลยครับ ต้องแทรก Code ลงไปในส่วนหัว และในส่วน Setup ครับ
อันดับแรกเลยก็ #include<WiFimanager> กับ #include<ArdinoJson> ครับ 
ต่อมาจะมีตัวแปรที่จะรับค่าพารามิเตอร์ที่เราต้องการเปลี่ยนเมื่อนำเครื่องไปใช้งานใหม่นะครับ
ส่วนที่สำคัญ หากเราต้องการนำ Code นี้ไปประยุกต์ใช้กับตัวแปรตัวอื่น เช่น Blynk Token คือฟังก์ชั่นด้านล่างนี้ครับ
**คือถ้าเราจะนำไปใช้กับ Blynk Token วิธีการของผมคือไล่แก้ฟังก์ชั่นที่มีตัวแปร ชื่อ ให้เป็น Blynk Token แทนที่ต่างๆใน Code นะครับ ที่ไฮไลท์ไว้ด้านบนคือตัวอย่างนะครับ กรณีนี้ผมใส่เป็น Line Token เนื่องจากผมจะนำมาใช้กับ Line Notify Token เครื่องแจ้งไฟดับของผมนั่นเองครับ
อันนี้ ถ้าเราต้องการรีเซ็ตค่า WiFimanager เราต้องกดรีเซ็ตแล้วกด Flash ภายใน 3 วินาที แล้วค้างไว้ประมาณ 5 วินาที ค่อยปล่อยปุ่ม Flash นะครับ ผมลองไล่ Code ดู น่าจะเป็นฟังก์ชั่นนี้ครับ
ส่วนชื่อ WiFi ของบอร์ดเรา ก็สามารถเปลี่ยนแปลงได้เช่นกันนะครับ โดยการเปลี่ยนที่ฟังก์ชั่นด้านล่างนี้ครับ (ในตัวอย่างเป็นชื่อ Board Electric Alert รหัสผ่านคือ password ครับ)
เมื่อตั้งค่าต่างๆในฟังก์ชั่น Setup เสร็จแล้ว ในส่วนของ loop หลักของโปรแกรมเรา ก็ไม่ต้องทำอะไรนะครับ ถ้าใครอยากศึกษาแบบละเอียด ลองแกะ Code ดูทีละบรรทัดครับ (บางตัวผมก็ยังงงๆอยู่เหมือนกัน อาศัยทำความเข้าใจโครงสร้าง แล้วทดลองใช้เป็นครั้งๆไปครับ ^^)
แล้วก็ Upload โปรแกรมลงบอร์ดตามปกติครับ  
วิธีการใช้งานการตั้งค่า WiFi ด้วย WiFimanager ก็ให้ใช้มือถือ หรือ Notebook เชื่อมต่อกับ WiFi ของบอร์ดเราครับ ในที่นี้ก็คือ Board Electric Alert และรหัสผ่านก็คือ password ที่เราได้ตั้งไว้ใน Code นั่นเอง
โดยปกติแล้ว พอเราเลือกชื่อ WiFi และใส่ Password มันจะเด้งเข้าหน้า Config แบบนี้อัตโนมัติครับ
แต่ถ้าไม่ขึ้นอัตโนมัติ ก็ให้เข้าไปที่ Web Browser แล้วพิมพิมพ์ 192.168.4.1 ครับ ในที่นี้ผมใช้ Google Chrome ในการเข้านะครับ (พิมพ์ 192.168.4.1 ตรง URL เลยครับ) ก็จะได้หน้า Config เหมือนกัน
จากนั้นก็กดที่แท็ป Configure WiFi เพื่อจะเข้าไปกำหนดค่าเลยครับ
กดตรง SSID หรือชื่อ WiFi ที่เราจะใช้งาน และใส่ Password 
และใส่ Line notify Token ของเรา จากนั้นก็กด Save ได้เลยครับ
จะได้หน้านี้ เป็นการบันทึกค่าต่างๆที่เรากำหนดลงในตัว NodeMCU แล้วครับ
รอรีเซ็ตสักครู่ เราก็จะสามารถใช้งานกับ WiFi ที่เราต้องการได้แล้วครับ ^^

หากเราจะนำเครื่องเราไปใช้งานที่อื่น ก็สามารถรีเซ็ตค่า WiFi ใหม่ได้โดยการกด Reset แล้วกด Flash ค้างไว้ประมาณ 5 วินาที จากนั้น NodeMCU ก็จะรีเซ็ตตัวเอง แล้วจะปล่อยสัญญาณ WiFi ชื่อ Board Electric Alert พร้อมที่จะให้เรากำหนดค่าได้อีกครั้งแล้วครับ

บทความนี้ก็จบเพียงเท่านี้นะครับ หวังว่าเพื่อนๆจะสามารถนำ WiFimanager ไปประยุกต์ใช้กับงานตัวเองได้นะครับ 
หากมีข้อผิดพลาดตรงไหน ก็ขออภัยด้วยนะครับ สามารถทักท้วงได้ตลอดเวลาเลยครับ ไม่ว่ากันเลยนะครับ หากมันจะทำให้บทความนี้สมบูรณ์ยิ่งขึ้น หรือทันสมัยมากขึ้น ยิ่งยินดีเลยครับ ทักท้วงกันได้เลย ^^

ผมแจก Code ฟรีนะครับ แอดไลน์มาที่ https://lin.ee/gSscDnD แล้วแจ้ง email ไว้ ผมจะเปิดแชร์ให้ครับ [ จะดาวน์โหลด Code ทั้งหมดของช่อง เฮ็ดสิดี ได้ทาง Google Drive เลยครับ ]
ขอบคุณทุกท่านที่สนใจครับ จะพยายามทำโครงงานแบบนี้ออกมาเรื่อยๆครับ ร่วมพูดคุยแลกเปลี่ยนความรู้ที่กลุ่มเฟสบุ๊คกันได้ครับ

อย่าลืมกดติดตามช่องไว้ เพื่อจะได้ไม่พลาดคลิปใหม่ๆนะครับ
ขอบคุณครับ

ความคิดเห็น

Unknown กล่าวว่า
ขอ code esp8266 wifimanager ได้ไหมครับ ขอบคุณครับ
แจก Code ฟรีนะครับ
เพียงแอดไลน์มาที่ https://lin.ee/gSscDnD
แล้วแจ้ง email ไว้ ผมจะเปิดแชร์ให้ครับ
[ จะดาวน์โหลด Code ทั้งหมดของช่อง ได้ทาง Google Drive ครับ ]
abdo กล่าวว่า
When you will update this great project to json 6
Samart Promprasert กล่าวว่า
ขอ QR line หน่อยครับ