Uncategorized

WeMos D1 ESP8266 WiFi ควบคุมเปิดปิดไฟ LED WebServer

WeMos D1เป็นบอร์ด ESP8266 ESP-8266EX ที่เพิ่มส่วนของ USB Serial สำหรับติดต่อ USB เพิ่มภาคจ่ายไฟเรกูเลต และขยายขาให้ต่อทดลองได้ง่ายเหมือน Arduino Uno สามารถเขียนโคดโดยใช้ Arduino IDE

อุปกรณ์ที่ต้องใช้ใน บทความ สอนใช้งาน WeMos D1 ESP8266 WiFi ควบคุมเปิดปิดไฟ LED WebServer

1.เชื่อมต่ออุปกรณ์ตามด้านล่าง

WeMos D1 Arduino WiFi UNO board ESP8266 Arduino IDE -> USB -> Computer
WeMos D1 Arduino WiFi UNO board ESP8266 Arduino IDE -> LED
            • 5V -> LED สีแดง ( ขายาว )
            • 5V -> LED สีเหลือง ( ขายาว )
            • 5V -> LED สีเขียว ( ขายาว )
            • 5V -> LED สีน้ำเงิน ( ขายาว )
            • D4 -> ตัวต้านทาน 220 ohm -> LED สีแดง ( ขาสั้น )
            • D5 -> ตัวต้านทาน 220 ohm -> LED สีเหลือง ( ขาสั้น )
            • D6 -> ตัวต้านทาน 220 ohm -> LED สีเขียว ( ขาสั้น )
            • D7 -> ตัวต้านทาน 220 ohm -> LED สีน้ำเงิน ( ขาสั้น )


2. ทำการเชื่อมต่อบอร์ด WeMos D1 Arduino WiFi UNO board ESP8266 Arduino เข้ากับเครื่องคอมพิวเตอร์ที่ทำการติดตั้งโปรแกรม Arduino IDE แล้ว


3. เปิดโปรแกรม Arduino IDE (arduino) ขึ้นมา


4. ลบข้อความที่อยู่ในหน้าโปรแกรมออกทั้งหมดและ Copy โค๊ดด้านล่างไปใส่ไว้แทน และทำการใส่ชื่อและรหัส Wifi ของผู้ใช้งานลงไปให้เรียบร้อย

#include <ESP8266WiFi.h>

const char* ssid = "xxxx"; //ใส่ชื่อ Wifi ของผู้ใช้งานลงไปใน "..."
const char* password = "xxxxx";//ใส่รหัส Wifi ของผู้ใช้งานลงไปใน "..."

int ledPin1 = D4; // ขา D4
int ledPin2 = D5; // ขา D5
int ledPin3 = D6; // ขา D6
int ledPin4 = D7; // ขา D7

int ch1 = 0;
int ch2 = 0;
int ch3 = 0;
int ch4 = 0;
int ch5 = 0;

WiFiServer server(80);

void setup() {
  Serial.begin(9600);
  delay(100);
  char link[] = "http://www.myarduino.net";

  // ประกาศขา เป็น Output
  pinMode(ledPin1, OUTPUT);
  pinMode(ledPin2, OUTPUT);
  pinMode(ledPin3, OUTPUT);
  pinMode(ledPin4, OUTPUT);

  // เริ่มต้น ให้ Logic ตำแหน่งขาเป็น LOW
  digitalWrite(ledPin1, HIGH);
  digitalWrite(ledPin2, HIGH);
  digitalWrite(ledPin3, HIGH);
  digitalWrite(ledPin4, HIGH);

  // Connect to WiFi network
  Serial.println();
  Serial.println();
  Serial.print("Connecting to ");
  Serial.println(ssid);

  WiFi.begin(ssid, password);
  while (WiFi.status() != WL_CONNECTED) {
    delay(500);
    Serial.print(".");
  }
  Serial.println("");
  Serial.println("WiFi connected");

  // Start the server
  server.begin();
  Serial.println("Server started");

  // Print the IP address
  Serial.print("Use this URL to connect: ");
  Serial.print("http://");
  Serial.print(WiFi.localIP());
  Serial.println("/");
}

void loop() {
  // Check if a client has connected
  WiFiClient client = server.available();
  if (!client) {
    return;
  }

  // Wait until the client sends some data
  Serial.println("new client");
  while (!client.available()) {
    delay(1);
  }

  // Read the first line of the request
  String request = client.readStringUntil('\r');
  Serial.println(request);
  client.flush();

  // Match the request

  // รับ Link ช่อง 1

  if (request.indexOf("/LED1=ON") != -1) {
    digitalWrite(ledPin1, LOW);
    ch1 = 1;
  }
  if (request.indexOf("/LED1=OFF") != -1) {
    digitalWrite(ledPin1, HIGH);
    ch1 = 0;
  }

  // รับ Link ช่อง 2
  if (request.indexOf("/LED2=ON") != -1) {
    digitalWrite(ledPin2, LOW);
    Serial.println("OK2");
    ch2 = 1;
  }

  if (request.indexOf("/LED2=OFF") != -1) {
    digitalWrite(ledPin2, HIGH);
    Serial.println("OK2");
    ch2 = 0;
  }

  // รับ Link ช่อง 3
  if (request.indexOf("/LED3=ON") != -1) {
    digitalWrite(ledPin3, LOW);
    Serial.println("OK3");
    ch3 = 1;
  }

  if (request.indexOf("/LED3=OFF") != -1) {
    digitalWrite(ledPin3, HIGH);
    Serial.println("OK3");
    ch3 = 0;
  }

  // รับ Link ช่อง 4
  if (request.indexOf("/LED4=ON") != -1) {
    digitalWrite(ledPin4, LOW);
    ch4 = 1;
  }

  if (request.indexOf("/LED4=OFF") != -1) {
    digitalWrite(ledPin4, HIGH);
    ch4 = 0;
  }

  if (request.indexOf("/ALLLED=ON") != -1) {
    digitalWrite(ledPin1, LOW);
    digitalWrite(ledPin2, LOW);
    digitalWrite(ledPin3, LOW);
    digitalWrite(ledPin4, LOW);
    ch1 = 1;
    ch2 = 1;
    ch3 = 1;
    ch4 = 1;
    ch5 = 1;
  }

  if (request.indexOf("/ALLLED=OFF") != -1) {
    digitalWrite(ledPin1, HIGH);
    digitalWrite(ledPin2, HIGH);
    digitalWrite(ledPin3, HIGH);
    digitalWrite(ledPin4, HIGH);
    ch1 = 0;
    ch2 = 0;
    ch3 = 0;
    ch4 = 0;
    ch5 = 0;
  }

  // Return the response
  client.println("HTTP/1.1 200 OK");
  client.println("Content-Type: text/html");
  client.println(""); // do not forget this one
  client.println("");
  client.println("");

  client.print("<h1>MY Arduino</h1>\r\n");
  client.print("<h2>WeMos D1 Arduino WiFi UNO board ESP8266 Arduino IDE</h2>\r\n");

  client.print("<br>Led pin 1 : ");
  if (ch1 || ch5 == 1) {
    client.print("On<br>");
  } else {
    client.print("Off<br>");
  }
  client.print("Led pin 2 : ");
  if (ch2 || ch5 == 1) {
    client.print("On<br>");
  } else {
    client.print("Off<br>");
  }
  client.print("Led pin 3 : ");
  if (ch3 || ch5 == 1) {
    client.print("On<br>");
  } else {
    client.print("Off<br>");
  }
  client.print("Led pin 4 : ");
  if (ch4 || ch5 == 1) {
    client.print("On<br>");
  } else {
    client.print("Off<br>");
  }
  client.print("All LED : ");
  if (ch1 && ch2 && ch3 && ch4 || ch5 == 1) {
    client.print("On<br>");
  }
  else {
    client.print("Off<br>");
  }

  client.println("");

  client.println("CH1 <a href=\"/LED1=ON\"\"><button> On </button></a><a href=\"/LED1=OFF\"\"><button> OFF </button></a><br>");

  client.println("CH2 <a href=\"/LED2=ON\"\"><button> On </button></a><a href=\"/LED2=OFF\"\"><button> OFF </button></a><br>");

  client.println("CH3 <a href=\"/LED3=ON\"\"><button> On </button></a><a href=\"/LED3=OFF\"\"><button> OFF </button></a><br>");

  client.println("CH4 <a href=\"/LED4=ON\"\"><button> On </button></a><a href=\"/LED4=OFF\"\"><button> OFF </button></a><br>");

  client.println("CH5 <a href=\"/ALLLED=ON\"\"><button> All LED On </button></a><a href=\"/ALLLED=OFF\"\"><button> All LED OFF </button></a><br>");

  client.println("");
  client.println("<br>Go to our site : <a href =\"http://www.myarduino.net\" target = \"/_blank\" > www.myarduino.net </a>");

  delay(1);
  Serial.println("Client disonnected");
  Serial.println("");
}

5. เลือก Port ที่เชื่อมต่อกับบอร์ด


6. เลือกประเภทของบอร์ดที่ใช้งาน


7. จากนั้นตรวจสอบโค๊ดว่ามีจุดผิดพลาดหรือไม่โดยเลือกเมนู Verify/Compile ที่อยู่ในแถบเมนู Sketch ด้านบน


8. เมื่อเลือกแล้วโปรแกรมจะปรากฏหน้าต่าง Save sketch folder as ซึ่งเป็นหน้าต่างให้เลือกโฟลเดอร์เซฟโค๊ด หากผู้ใช้งานท่านใดไม่ต้องเซฟโค๊ดก็ให้ปิดหน้าต่างนี้ไปได้เลย


9. รอจนกว่าโปรแกรมจะตรวจสอบโค๊ดเสร็จ


10. เมื่อโปรแกรมทำการตรวจสอบโค๊ดเสร็จ ที่หน้าต่างส่วนล่างจะปรากฏข้อความตามกรอบสีแดงในรูปด้านล่าง


11. จากนั้นทำการอัพโหลดโค๊ดลงบอร์ดโดยเลือกเมนู Upload ที่อยู่แถบเมนู Sketch ด้านบน


12. เมื่อเลือกแล้วโปรแกรมจะปรากฏหน้าต่าง Save sketch folder as ซึ่งเป็นหน้าต่างให้เลือกโฟลเดอร์เซฟโค๊ด หากผู้ใช้งานท่านใดไม่ต้องเซฟโค๊ดก็ให้ปิดหน้าต่างนี้ไปได้เลย


13. รอจนกว่าโปรแกรมจะอัพโหลดโค๊ดลงบอร์ดเสร็จ


14. เมื่อโปรแกรมทำการอัพโหลดโค๊ดลงบอร์ดเสร็จ ที่หน้าต่างส่วนล่างจะปรากฏข้อความตามกรอบสีแดงในรูปด้านล่าง


15. เปิดหน้าจอ Serial Monitor ที่อยู่ในแถบเมนู Tools ด้านบนขึ้นมา


16. กดปุ่ม RESET ที่อยู่บนบอร์ด 1 ครั้ง


17. เมื่อทำการกดปุ่ม RESET แล้ว จะเห็นได้ว่าที่หน้าจอ Serial Monitor จะมีข้อความปรากฏขึ้น ให้รอจนกว่าบอร์ดจะทำการเชื่อมต่อ Wifi สำเร็จ


18. เมื่อบอร์ดทำการเชื่อมต่อ Wifi สำเร็จแล้ว ก็จะปรากฏ URL Web Server ของบอร์ดขึ้นมา ให้ทำการ Copy URL นี้ไปวางไว้ใน Address bar ของ Browser ของผู้ใช้งาน


19. เมื่อเข้าไปใน URL Web Server ของบอร์ดแล้ว ก็จะปรากฏหน้า Web Server ที่กำหนดไว้ในโค๊ดขึ้นมา


20. จากนั้นทำการกดปุ่ม On ที่ CH1 จะเห็นได้ว่าไฟ LED สีแดงจะติดขึ้นมาพร้อมกับจะมีการเปลี่ยนสถานะจาก Off เป็น On




21. จากนั้นทำการกดปุ่ม Off ที่ CH1 จะเห็นได้ว่าไฟ LED สีแดงจะดับลงมาพร้อมกับจะมีการเปลี่ยนสถานะจาก On เป็น Off




22. จากนั้นทำการกดปุ่ม On ที่ CH2 จะเห็นได้ว่าไฟ LED สีเหลืองจะติดขึ้นมาพร้อมกับจะมีการเปลี่ยนสถานะจาก Off เป็น On





23. จากนั้นทำการกดปุ่ม On ที่ CH1 ในขณะที่ CH2 ยังเป็น On อยู่ จะเห็นได้ว่าไฟ LED สีแดงก็จะทำงานพร้อมกันกับไฟ LED สีเหลือง แสดงให้เห็นว่าผู้ใช้งานสามารถใช้งานไฟ LED ได้หลายตัวพร้อมๆกัน



24. จากนั้นทำการกดปุ่ม On ที่ CH1 จนไปถึง CH4 เมื่อทำการกดแล้วก็จะเห็นได้ว่าไฟ LED สามารถทำงานพร้อมกันได้ทั้งหมด อีกทั้งจะเห็นได้ว่าจะมีการเปลี่ยนสถานะที่ All LED จาก Off เป็น On





25. จากนั้นทำการกดปุ่ม Off ที่ CH ใด CH หนึ่ง จะเห็นได้ว่าเมื่อทำการกด Off ลงไปแล้ว จะมีการเปลี่ยนสถานะที่ All LED จาก On เป็น Off ทันที



26. จากนั้นกดปุ่ม All LED OFF ที่ CH5 จะเห็นได้ว่าไฟ LED ที่ติดอยู่ทั้งหมดจะดับลงพร้อมกันทั้งหมด พร้อมทั้งจะมีการเปลี่ยนสถานะของ Led pin 1 ถึง 4 รวมไปถึง All LED จาก On เป็น Off




27. จากนั้นกดปุ่ม All LED On ที่ CH5 จะเห็นได้ว่าไฟ LED จะติดขึ้นพร้อมกันทั้งหมด พร้อมกับจะมีการเปลี่ยนสถานะของ Led pin 1 ถึง 4 รวมไปถึง All LED จาก Off เป็น on