esp8266 WiFi板配網控制伺服電機
阿新 • • 發佈：2022-05-27
#include <ESP8266WiFi.h> // 本程式使用 ESP8266WiFi庫 #include <ESP8266WiFiMulti.h> // ESP8266WiFiMulti庫 #include <ESP8266WebServer.h> // ESP8266WebServer庫 #include <Servo.h>//伺服舵機Servo庫 Servo servo; // 建立Servo物件,物件名稱是 'servo' ESP8266WiFiMulti wifiMulti; // 建立ESP8266WiFiMulti物件,物件名稱是 'wifiMulti'ESP8266WebServer esp8266_server(80);// 建立網路伺服器物件，該物件用於響應HTTP請求。監聽埠（80） void setup(void){ Serial.begin(115200); // 啟動串列埠通訊 pinMode(LED_BUILTIN, OUTPUT); //設定內建LED引腳為輸出模式以便控制LED wifiMulti.addAP("TP-LINK_A7ED", "xiang/*0621?"); // 將需要連線的一系列WiFi ID和密碼輸入這裡 // wifiMulti.addAP("ssid_from_AP_2", "your_password_for_AP_2");// ESP8266-NodeMCU再啟動後會掃描當前網路 // wifiMulti.addAP("ssid_from_AP_3", "your_password_for_AP_3"); // 環境查詢是否有這裡列出的WiFi ID。如果有 Serial.println("Connecting ..."); // 則嘗試使用此處儲存的密碼進行連線。 int i = 0; while (wifiMulti.run() != WL_CONNECTED) { // 此處的wifiMulti.run()是重點。通過wifiMulti.run()，NodeMCU將會在當前delay(1000); // 環境中搜索addAP函式所儲存的WiFi。如果搜到多個儲存的WiFi那麼NodeMCU Serial.print(i++); Serial.print(' '); // 將會連線訊號最強的那一個WiFi訊號。 } // 一旦連線WiFI成功，wifiMulti.run()將會返回“WL_CONNECTED”。這也是 // 此處while迴圈判斷是否跳出迴圈的條件。 // WiFi連線成功後將通過串列埠監視器輸出連線成功資訊 Serial.println('\n'); Serial.print("Connected to "); Serial.println(WiFi.SSID()); // 通過串列埠監視器輸出連線的WiFi名稱 Serial.print("IP address:\t"); Serial.println(WiFi.localIP()); // 通過串列埠監視器輸出ESP8266-NodeMCU的IP 便於觀察WiFi連結情況 esp8266_server.begin(); // 啟動網站服務 esp8266_server.on("/", HTTP_GET, handleRoot); // 設定伺服器根目錄即'/'的函式'handleRoot' esp8266_server.on("/LED", HTTP_GET, handleLED); // 設定處理LED控制請求的函式'handleLED' 意思就是客戶端發過來的資訊進行處理 這是第一個按鈕資訊 esp8266_server.on("/LED2", HTTP_GET, handleLED2);// 設定處理LED2控制請求的函式'handleLED2'意思就是客戶端發過來的資訊進行處理 這是第二個按鈕資訊 //esp8266_server.on("/LED2", HTTP_POST, handleLED3);// 設定處理LED2控制請求的函式'handleLED2'意思就是客戶端發過來的資訊進行處理 這是第二個按鈕資訊 esp8266_server.onNotFound(handleNotFound); // 設定處理404情況的函式'handleNotFound' 崩潰資訊 Serial.println("HTTP esp8266_server started");// 告知使用者ESP8266網路服務功能已經啟動 觀察ESP8266網路服務是否啟動成功 } void loop(void){ servo.attach(D0); esp8266_server.handleClient(); // 檢查http伺服器訪問 一直檢查有沒有客服端訪問伺服器 } /*設定伺服器根目錄即'/'的函式'handleRoot' 該函式的作用是每當有客戶端訪問NodeMCU伺服器根目錄時， NodeMCU都會向訪問裝置傳送 HTTP 狀態 200 (Ok) 這是send函式的第一個引數。 同時NodeMCU還會向瀏覽器傳送HTML程式碼，以下示例中send函式中第三個引數， 也就是雙引號中的內容就是NodeMCU傳送的HTML程式碼。該程式碼可在網頁中產生LED控制按鈕。 當用戶按下按鈕時，瀏覽器將會向NodeMCU的/LED頁面傳送HTTP請求，請求方式為POST。 NodeMCU接收到此請求後將會執行handleLED函式內容*/ void handleRoot() { String str= "<!DOCTYPE html><html><head><meta charset=\"utf-8\"><title>Welcome home</title><style>.button{background-color:DodgerBlue;border-radius:12px;color:white;padding:130px 150px;text-align:center;text-decoration:none;display:inline-block;font-size:80px;margin:4px 2px;cursor:pointer}.button:hover{background-color:Plum}.button2{background-color:Maroon}.button:active{background-color:DodgerBlue;box-shadow:0 5px#666;transform:translateY(4px);</style></head><body><h1 style=\"text-align:center;color:DarkOrchid ;font-size:40px;\">歡迎回家Welcome home<div align=\"center\"><a href=\"/LED\"method=\"POST\"class=\"button\">開門</a><head></head><div align=\"center\"><a href=\"/LED2\"method=\"POST\"class=\"button button2\">關門</a><head>"; esp8266_server.send(200, "text/html", str); //給客戶端返回一段資訊，這段資訊是一段HTML檔案 } //處理LED控制請求的函式'handleLED' void handleLED() { // 假如按第一個按鈕執行以下程式碼 servo.write(180);delay(300); // 控制舵機旋轉到180度 servo.write(0);delay(300); // 控制舵機旋轉到0度 Serial.println("正在輸出LED"); esp8266_server.sendHeader("Location","/"); // 跳轉回頁面根目錄
esp8266_server.send(303); // 傳送Http相應程式碼303 跳轉 } // 設定處理404情況的函式'handleNotFound' void handleNotFound(){ esp8266_server.send(404, "text/plain", "404: Not found"); // 傳送 HTTP 狀態 404 (未找到頁面) 並向瀏覽器傳送文字 "404: Not found" } void handleLED2() { // 假如按第二個按鈕執行以下程式碼 servo.write(90);delay(300); // 控制舵機旋轉回到90度初始位置 Serial.println("正在輸出LED2"); //列印資料便於觀察 esp8266_server.sendHeader("Location","/"); // 跳轉回頁面根目錄 esp8266_server.send(303); // 傳送Http相應程式碼303 跳轉 } void handleLED3() { // 開發板按鈕執行以下程式碼 digitalWrite(LED_BUILTIN,!digitalRead(LED_BUILTIN));// 改變LED的點亮或者熄滅狀態 Serial.println("正在輸出LED3"); esp8266_server.sendHeader("Location","/"); // 跳轉回頁面根目錄 esp8266_server.send(303); // 傳送Http相應程式碼303 跳轉 }
最後的頁面效果是這樣的
視訊請移步到https://www.bilibili.com/video/BV1GY4y1t7sm?spm_id_from=333.999.0.0