ESP8266 Nodemcu การควบคุมผ่านทาง web server โดยใช้โหมด AP

วัตถุประสงค์

การควบคุมอุปกรณ์ไฟฟ้า ผ่านทางสัญญาณไวไฟ โดยใช้ ESP8266 Nodemcu ทำหน้าที่เป็นเว็บเซิร์ฟเวอร์และเป็นตัวกระจายสัญญาณไวไฟ ทำให้ไม่ต้องใช้สัญญาณไวไฟจากภายนอก ดังนั้นการควบคุมอุปกรณ์สามารถทำได้ด้วยอุปกรณ์ที่สามารถเปิดเว็บเบราว์เซอร์ได้ กับวงจรที่ต่ออยู่กับของ ESP8266 เท่านั้น

อุปกรณ์

1. ESP8266 NodeMCU

2. LED 2 ตัว

3. ความต้านทาน 560 โอหม์ 2 ตัว

4. บอร์ดทดลอง (Breadboard)

วงจร

ESP8266 NodeMCU ทำหน้าที่เป็น

1) อุปกรณ์กระจายสัญญาณไวไฟ Access Point (AP)

คำสั่งที่เกี่ยวกับการกำหนดให้ทำงานแบบ AP

const char *ssid = "Nodetest"; // ชื่ออุปกรณ์ไวไฟสำหรับการเรียกใช้

const char *password = "password"; //พาสเวิร์ด

WiFi.mode(WIFI_AP); // ให้ ESP ทำงานในโหมด AP

WiFi.softAP(ssid); // ใช้แบบไม่มี พาสเวิร์ด

ถ้าต้องการให้ทำงานแบบมีพาสเวิร์ด ให้ใช้เป็น

WiFi.softAP(ssid, password)

IPAddress apip = WiFi.softAPIP(); // ip address ของหน้าเว็บ

2) เว็บเซิร์ฟเวอร์ เมื่อมีการร้องขอมาจาก เว็บไคลเอ็นท์ (Web Client) ให้ ESP8266 NodeMCU ส่งคำสั่งในภาษา HTML ไปยังเว็บไคลเอ็นท์ เพื่อแสดงเป็นหน้าเว็บเพจ โดยคำสั่งที่สำคัญคือการทำเป็นปุ่มลิงค์ (Button Link) เมื่อมีการคลิกที่ปุ่มลิงค์ใดปุ่มลิงค์หนึ่ง ก็ให้เว็บ เซิร์ฟเวอร์ ส่งคำสั่งสำหรับสร้างหน้าเพจใหม่ไป รายละเอียด

3) ทำหน้าที่ตรวจสอบชื่อที่อยู่ของหน้าเว็บนั้น แล้วกำหนดสถานการทำงานของ GPIO หรือสถานะของอุปกรณ์ไฟฟ้าให้ตรงกับที่ต้องการ

รายละเอียดการทำงานของคำสั่งในข้อ 2) และ 3) ดูได้จาก https://sites.google.com/site/eplearn/wifi/control_via_web_server

โปรแกรม esp_ap_web_server_control_2.ino

โปรแกรม esp_ap_web_server_control_2.ino

// Load Wi-Fi library

#include <ESP8266WiFi.h>

#include <ESP8266WebServer.h>

const char *ssid = "Nodetest";

const char *password = "password";

ESP8266WebServer server(80); // Set web server port number to 80

// Assign output variables to GPIO pins

const int output1 = D1;

const int output2 = D2;

#define output1_OFF digitalWrite(output1, LOW)

#define output1_ON digitalWrite(output1, HIGH)

#define output2_OFF digitalWrite(output2, LOW)

#define output2_ON digitalWrite(output2, HIGH)

//HTML code

const String HtmlHtml = "<html><head>"

"<meta name=\"viewport\" content=\"width=device-width, initial-scale=1\" /></head>";

const String HtmlHtmlClose = "</html>";

const String HtmlTitle = "<h1>ESP8266 NodeMCU act as AP and web server to control GPIO</h1><br/>\n";

const String HtmlCenter = "<center>";

const String HtmlCloseCenter = "</center>";

const String HtmlLedState1 = "<h2>Light 1 </h2><br/>\n";

const String HtmlLedState2 = "<h2>Light 2 </h2><br/>\n";

const String HtmlButton1_ON = "<a href=\"LED1Off\"><button style=\"display: block; background-color: #FF0000; height: 50px; width: 100px;\">ON</button></a><br/>";

const String HtmlButton1_OFF = "<a href=\"LED1On\"><button style=\"display: block; background-color: #00FF00; height: 50px; width: 100px;\">OFF</button></a><br/>";

const String HtmlButton2_ON = "<a href=\"LED2Off\"><button style=\"display: block; background-color: #FF0000; height: 50px; width: 100px;\">ON</button></a><br/>";

const String HtmlButton2_OFF = "<a href=\"LED2On\"><button style=\"display: block; background-color: #00FF00; height: 50px; width: 100px;\">OFF</button></a><br/>";

String HtmlButtons1, HtmlButtons2;

void handleRoot() {

output1_OFF;

HtmlButtons1 = HtmlButton1_OFF;

output2_OFF;

HtmlButtons2 = HtmlButton2_OFF;

response();

}

void handleLed1On() {

output1_ON;

HtmlButtons1 = HtmlButton1_ON;

response();

}

void handleLed1Off() {

output1_OFF;

HtmlButtons1 = HtmlButton1_OFF;

response();

}

void handleLed2On() {

output2_ON;

HtmlButtons2 = HtmlButton2_ON;

response();

}

void handleLed2Off() {

output2_OFF;

HtmlButtons2 = HtmlButton2_OFF;

response();

}

void response(){

String htmlRes = HtmlHtml + HtmlCenter;

htmlRes += HtmlTitle;

htmlRes += HtmlLedState1;

htmlRes += HtmlButtons1;

htmlRes += HtmlLedState2;

htmlRes += HtmlButtons2;

htmlRes += HtmlCloseCenter;

htmlRes += HtmlHtmlClose;

server.send (200, "text/html", htmlRes);

}

void setup() {

Serial.begin(115200);

// Initialize the output variables as outputs

pinMode(output1, OUTPUT);

pinMode(output2, OUTPUT);

// Set outputs to OFF

output1_OFF;

output2_OFF;

// Set Wi-Fi network with SSID and password

WiFi.mode(WIFI_AP); // ใช้งาน WiFi ในโหมด AP

WiFi.softAP(ssid); //or WiFi.softAP(ssid, password)

Serial.print("Connect to : ");

Serial.println(ssid);

IPAddress apip = WiFi.softAPIP();

Serial.print("visit: ");

Serial.println(apip);

server.on("/", handleRoot);

server.on("/LED1On", handleLed1On);

server.on("/LED1Off", handleLed1Off);

server.on("/LED2On", handleLed2On);

server.on("/LED2Off", handleLed2Off);

server.begin();

}

void loop(){

server.handleClient();

}

การทดสอบ

1. เมื่อแปลและ Upload ลงไปบน ESP8266 NodeMCU ให้เปิด Serial Monitor เพื่อตรวจดู ชื่อไวไฟ และ IP address ของ Server ที่สร้างโดย ESP8266 NodeMCU (อย่าลืมใช้ Baud Rate 115200) ผลลัพธ์ควรได้ดังรูป

2. ตั้งการเชื่อต่อของสัญญาณไวไฟเข้ากับ AP ที่กำหนดไว้

3. เปิดเว็บเบราว์เซอร์ แล้วเปิดหน้าเพจโดย IP ที่ได้จากข้อ 1 ผลลัพธ์ควรได้ดังรูป เมื่อคลิกเมาส์ที่ปุ่มใดปุ่มหนึ่ง หน้าเว็บจะและ LED มีการเปลี่ยนแปลง