147 // Display current state, and ON/OFF buttons for GPIO 5 client.println("<p>GPIO 5 - State " + output5State + "</p>"); // If the output5State is off, it displays the ON button if (output5State=="off") { client.println("<p><a href=\"/5/on\"><button class=\"button\">ON</button></a></p>"); } else { client.println("<p><a href=\"/5/off\"><button class=\"button button2\">OFF</button></a></p>"); } // Display current state, and ON/OFF buttons for GPIO 4 client.println("<p>GPIO 4 - State " + output4State + "</p>"); // If the output4State is off, it displays the ON button if (output4State=="off") { client.println("<p><a href=\"/4/on\"><button class=\"button\">ON</button></a></p>"); } else { client.println("<p><a href=\"/4/off\"><button class=\"button button2\">OFF</button></a></p>"); } client.println("</body></html>"); // The HTTP response ends with another blank line client.println(); // Break out of the while loop break; } else { // if you got a newline, then clear currentLine currentLine = ""; } } else if (c != '\r') { // if you got anything else but a carriage return character,
148 currentLine += c; // add it to the end of the currentLine } } } // Clear the header variable header = ""; // Close the connection client.stop(); Serial.println("Client disconnected."); Serial.println(""); } } คุณต้องแก้ไขตัวแปรสองตัวต่อไปนี้ด้วยข้อมูลรับรองเครือข่ายของคุณ เพื่อให้ ESP8266 ของคุณสามารถสร้างการ เชื่อมต่อกับเราเตอร์ของคุณได้ // Replace with your network credentials const char* ssid = ""; const char* password = ""; เชื่อมต่อ LED สองดวงเข้ากับ ESP8266 ของคุณดังที่แสดงในแผนผังต่อไปนี้ โดย LED หนึ่งดวงเชื่อมต่อกับ GPIO 4 (D2) และอีกดวงหนึ่งเชื่อมต่อกับ GPIO 5 (D1) การทดสอบเว็บเซิร์ฟเวอร์ ตอนนี้คุณสามารถอัปโหลดโค้ดได้ และโค้ดจะทำงานได้ทันที อย่าลืมตรวจสอบว่าคุณได้เลือกบอร์ดและพอร์ต COM ที่ถูกต้องหรือไม่ ไม่เช่นนั้นคุณจะได้รับข้อผิดพลาดเมื่อพยายามอัปโหลด เปิด Serial Monitor ด้วยอัตรา รับส่งข้อมูล 115200
149 ค้นหาที่อยู่ IP ของ ESP กดปุ่ม RESET ESP8266 และจะส่งออกที่อยู่ IP ESP บน Serial Monitor คัดลอกที่อยู่ IP นั้น เนื่องจากคุณจำเป็นต้องใช้เพื่อเข้าถึงเว็บเซิร์ฟเวอร์ การเข้าถึงเว็บเซิร์ฟเวอร์ เปิดเบราว์เซอร์ของคุณ พิมพ์ที่อยู่ IP ESP แล้วคุณจะเห็นหน้าต่อไปนี้ หน้านี้ถูกส่งโดย ESP8266 เมื่อคุณส่งคำขอ เกี่ยวกับที่อยู่ IP ของ ESP หากดูที่มอนิเตอร์แบบอนุกรม คุณจะเห็นสิ่งที่เกิดขึ้นเบื้องหลัง ESP ได้รับคำขอ HTTP จากไคลเอนต์ใหม่ - ใน กรณีนี้คือเบราว์เซอร์ของคุณ
150 คุณยังสามารถดูข้อมูลอื่นๆ เกี่ยวกับคำขอ HTTP ได้ด้วย โดยฟิลด์เหล่านี้เรียกว่าฟิลด์ส่วนหัว HTTP และฟิลด์ เหล่านี้จะกำหนดพารามิเตอร์การทำงานของธุรกรรม HTTP
151 จุดประสงค์การมอบหมายงานให้ 7. อธิบายความหมายของ Web Server ได้ 8. อธิบายขั้นตอนในการทำงาน Web Server ได้ 9. เขียนโปรแกรมสร้างเครือข่าย Web Server ได้ แนวทางปฏิบัติงาน ก่อนเรียน ครูชี้แจงคำถามและแนะนำแนวทางการปฏิบัติงาน ขณะเรียน ให้นักศึกษาอภิปรายและสรุปเกี่ยวกับการเชื่อมต่อหลอดแอลอีดีและลำโพง หลังเรียน ให้นักเรียนศึกษาค้นคว้าเพิ่มเติมเกี่ยวกับการเชื่อมต่อหลอดแอลอีดีและลำโพง และทำงานปฏิบัติ หน่วยเรียนหน่วยที่ 12 ส่งท้ายชั่วโมง แหล่งค้นคว้า/อ้างอิง Random Nerd Tutorial. Build an ESP8266 Web Server – Code and Schematics (NodeMCU). จากเว็บไซต์ https://randomnerdtutorials.com/esp8266-web-server/ สืบค้นเมื่อวันที่ 30 ตุลาคม 2566 กำหนดเวลาส่งงาน - ท้ายชั่วโมง การประเมินผล 1. การประเมินผลโดยใช้แบบฝึกหัดหลังเรียนหน่วยที่ 12 2. การประเมินผลโดยสังเกตพฤติกรรมและคุณภาพของงานที่ได้รับมอบหมาย 3. สังเกตการมีส่วนร่วมในการเรียน ใบมอบหมายงานที่ 12 ระดับชั้น ปวช.2 กลุ่ม ทส.2 สัปดาห์ที่16 ชื่อวิชา วิทยาการก้าวหน้าระบบสมองกลฝังตัวและไอโอที ชื่อเรื่อง การสร้าง Web Server จำนวนชั่วโมง 4 ชั่วโมง
152 ใบปฏิบัติหน่วยที่12 การสร้าง Web Server คำชี้แจง จงตอบคำถามต่อไปนี้ให้ครบถ้วนและถูกต้อง 1. บอกความหมายของ Web Server ............................................................................................................................. ......................................... ...................................................................................................................................................................... ............................................................................................................................. ......................................... ...................................................................................................................................................................... 2. อธิบายขั้นตอนในการทำงานของ Web Server กับ ESP8266 ............................................................................................................................. ......................................... ...................................................................................................................................................................... ............................................................................................................................. ......................................... ...................................................................................................................................................................... 3. อธิบายขั้นตอนการสร้างเครือข่าย Web Server กับ ESP8266 ............................................................................................................................. ......................................... ...................................................................................................................................................................... ............................................................................................................................. ......................................... ......................................................................................................................................................................
153 ใบปฏิบัติหน่วยที่ 12 การสร้าง Web Server คำชี้แจง ต่อวงจรบอร์ด ESP8266 ร่วมกับหลอดแอลอีดี แล้วเขียนโปรแกรมควบคุมการทำงานหลอดแอลอีดีบน Web Server รายการปฏิบัติ คะแนน รายการประเมิน ได้ ไม่ได้ ต่อวงจรบอร์ดเชื่อมกับ Wi-Fi ได้ 2 เขียนโปรแกรมสร้าง Web Server ได้ 2 เขียนโปรแกรมควบคุมบน Web Server ได้ 3 เขียนโปรแกรมภาษา C ตามที่กำหนดได้ 3 รวม
154 ข้อสรุปหลังการจัดการเรียนรู้ ............................................................................................................................. ................................................. ................................................................................. ............................................................................................. .................................................................................................................................................................................... ............................................................................................................................. ........................................... .................................................................................................................................................................................... ปัญหาที่พบ ............................................................................................................................. ....................................................... .................................................................................................................................................................................... ............................................................................................................................. ....................................................... แนวทางการแก้ปัญหา ............................................................................................................................. ....................................................... .................................................................................................................................................................................... (นายพลวัฒน์ ผ่องแก้ว) ครูผู้สอน (นางสาวมยุรี พงษ์อาภา) หัวหน้าแผนกวิชาคอมพิวเตอร์ (นางสาวศิริวรรณ เนาว์ประโคน) รองผู้อำนวยงานฝ่ายวิชาการ บันทึกหลังการจัดการเรียนรู้ ระดับชั้น ปวช.2 กลุ่ม ทส.2 สัปดาห์ที่16-17 ชื่อวิชา วิทยาการก้าวหน้าระบบสมองกลและไอโอที วันเดือนปี ชื่อเรื่อง การติดต่อสื่อสาร ESP-NOW จำนวนชั่วโมง 8 ชั่วโมง