สอนทำ WiFi Manager for NodeMCU

บทความนี้จะสอนทำ WiFi Manager ให้กับ NodeMCU ซึ่งในที่นี้จะขอยกตัวอย่างใช้งานกับบอร์ด NodeMCU Esp8266 และให้ใช้งานร่วมกับแอปพลิเคชัน Blynk ซึ่งหลาย ๆ คนรู้จักกันดี การทำ WiFi Manager เป็นการทำให้กับบอร์ดของเรานั้น เมื่อเราต้องการเปลี่ยนไวไฟที่จะให้บอร์ดของเราเชื่อมต่อไวไฟก็สามารถเชื่อมต่อไวไฟได้ง่าย และสะดวก โดยที่เราไม่ต้องนำบอร์ดไปอัปโหลดโปรแกรมใหม่ จะมีวิธีการทำอย่างไรบ้างนั้น ไปดูกันเลยครับ

การต่อวงจร

D0 ต่อเข้ากับขา GND ของบอร์ด

การติดตั้งโปรแกรม Arduino IDE → คลิก

สอนการใช้งาน NodeMCU ESP8266 กับโปรแกรม Arduino IDE → คลิก

หมายเหตุ หากใครยังไม่ได้ลงบอร์ด NodeMCU ESP8266 กับโปรแกรม Arduino IDE ให้ดูหัวข้อเรื่องนี้นะครับ

โหลดLibrary

Blynk → https://github.com/blynkkk/blynk-library.git

WiFi Manager → https://github.com/tzapu/WiFiManager

DNSServer → https://drive.google.com/file/d/1-ouJYj8jro4pQxb6JN6T_CRlaWYO4QcW/view?usp=sharing

สอนการติดตั้ง Library สำหรับโปรแกรม Arduino IDE → คลิก

ดาวโหลดแอพ Blynk → คลิก

ตัวอย่างโค้ด

#define BLYNK_PRINT Serial
#include<DNSServer.h>
#include<WiFiManager.h>
#include <ESP8266WiFi.h>
#include <BlynkSimpleEsp8266.h>

int ResetWifi = D0; //กำหนดขารีเซ็ทำไวไฟที่ขา D0

char auth[] = “————Auth Token———–“; //Auth Token ที่ได้จากเมลล์

WidgetLED led1(V0);

void setup() {
Serial.begin (9600);
pinMode (ResetWifi, INPUT_PULLUP);
WiFiManager wifiManager;
for (int i = 5; i>0; i–) {
delay(1000);
}
if(digitalRead (ResetWifi) == LOW){
Serial.println(“Reset Wifi”);
wifiManager.resetSettings();
}
wifiManager.autoConnect (“Esp8266”); //ตั้งชื่อไวไฟ

Blynk.config(auth); //เป็นจาก WiFi.begin เป็น Blynk.config
}
BLYNK_WRITE(V1)
{
if (param.asInt() == 1) {
led1.on();
}
if (param.asInt() == 0) {
led1.off();
}
}
void loop(){
Blynk.run();
}

ดาวโหลดโค้ด → คลิก

ขั้นตอนการใช้งานแอพ Blynk

1. เมื่อเข้าแอพ Blynk และทำการ Login เข้ามาเรียบร้อยแล้ว ให้กด New Project จากนั้นทำตามขั้นตอน ดังรูป

2. แอพจะส่ง Token ไปยังอีเมลของเรา หลังจากนั้นกด OK หมายเหตุ “เดี๋ยวเราจะนำ Token นี้ไปใส่ในโค้ด Arduino IDE ของเรา เดี๋ยวผมจะสอนในขั้นตอนท้าย ๆ ครับ”

3. กดตรงเครื่องหมาย บวก ดังรูป

4. จะเจอหน้าต่างแถบเครื่องมือต่าง ๆ มากมาย ในที่นี้เราจะเลือกเครื่องมือ “Button” ดังรูป

5. กดเพิ่มเครื่องมืออีกครั้ง และเลือกเครื่องมือ “LED” ดังรูป

6. เมื่อเพิ่มครบแล้ว หลังจากนั้นให้กดค้างที่ตัว “Button” และ “LED” แล้วการขยายและปรับตำแหน่งให้ได้ ดังรูป

7. คลิกที่ตัว Button 1 ครั้ง แล้วหลังจากนั้นตั้งค่าให้ได้ ดังรูป

8. คลิกที่ตัว LED 1 ครั้ง แล้วหลังจากนั้นตั้งค่าให้ได้ ดังรูป

9. คลิกที่ตัว สามเหลี่ยมมุมขวาบน เพื่อรอการเชื่อมต่อกับบอร์ด

10. สถานะรอเชื่อมต่อกับบอร์ด

11. ไปที่อีเมลของเรา หลังจากนั้นหาอีเมลที่ชื่อว่า Blynk และทำการ Copy ตรง Auth Token: ดังรูป

12. กลับมาที่โปรแกรม Arduino IDE เมื่อดาวน์โหลดโค้ดที่ผมให้มาแล้ว หลังจากนั้นนำ Auth Token ไปวาง ดังรูป

13. ในส่วนของชื่อไวไฟจะเปลี่ยนหรือไม่เปลี่ยนก็ได้ครับ

14. หลังจากนั้นให้เข้าไปเมนู Tools → Board : “xxxxxxx” → ESP8266 Board (3.0.2) → เลือกรุ่นของบอร์ด

15. ไปที่เมนู Tools อีกครั้ง เลือก Port ที่ NodeMCU ESP8266 เชื่อมต่ออยู่ ในที่นี้เป็น COM10

16. กดอัปโหลดโปรแกรมลงบอร์ด รอจนเสร็จ

17. หลังจากนั้นมาที่มือถือของเรากดเปิดไวไฟ จะเจอชื่อไวไฟของบอร์ดตามชื่อไวไฟดังขั้นตอนที่ 13. ดังรูป

18. คลิกที่ชื่อไวไฟ จะเจอหน้าต่างดังรูป และคลิกที่ปุ่ม Configure WiFi

19. คลิกเลือกชื่อไวไฟที่ต้องการให้บอร์ดเชื่อมต่อ

20. กรอก Password และกด Save

21. หลังจากนั้นจะเด้งมาที่หน้าต่างดังรูป และรอบอร์ดเชื่อมต่อไวไฟ เมื่อบอร์ดเชื่อมต่อไวไฟเสร็จแล้วหน้าต่างนี้ก็จะเด้งหายไปเอง และชื่อไวไฟ “Esp8266” ก็จะหายไปครับ