本小節是在修改在前一章ESP8266單機模式的【六、5-1.1 直接使用GET(URI)的方式控制】小節的範例，以成為使用於WFi分享器的無線區域網路架構，在此使用上一節中【七．１-4】小節的方法與WiFi分享器連線，也就是說由使用者自行選定WiFi分享器，同時系統內建一OLED顯示器，以協助使用者了解系統的連線狀況。
◎ 範例程式功能與動作說明：
1、本範例在開機連線時動作與【七．１-4】小節相同，會令ESP8266以站點(Station)腳色連接上無線WiFi分享器，並且由使用者自行選定WiFi分享器，在連線之後將直接使用手機瀏覽器的「GET」語法控制ESP8266上LED的亮滅。
2、當程式啟動時如下面的【圖七、2-1.1_1】所示，OLED顯示器上會依序由1~4先顯示「Program Start!」開機提示訊息後，開始連接無線WiFi分享器(小圖2)，在連線上之後OLED顯示器上會顯示連上的WiFi SSID名稱(DUCK)，及由WiFi分享器所分配到的本地動態IP位址(在此為[ 192.168.0.4 ]，使用不同的WiFi分享器會分配到不同的IP位址)；為了隱密起見，在3秒後OLED上的內容會切換到「System Ready!」，以提示使用者系統可以開始使用了。
圖七、2-1.1_1 系統開機與連線過程OLED顯示器畫面
3、使用者以行動通信裝置連上同一個WiFi分享器並開啟瀏覽器後(不必管OS的種類)，在網址輸入欄輸入[ 192.168.0.4 ] 這個IP位址，如下面的【圖七、2-1.1_2】左邊所示，系統會回應『ESP8266 站點模式-- 單一LED輸出控制』這樣的訊息給使用者的瀏覽器，也就是由ESP8266這個晶片所建構的伺服器首頁畫面給客戶端。
圖七、2-1.1_2 使用者與ESP8266連線過程OLED顯示器畫面
如果輸入的指令錯誤，如【圖七、2-1.1_2】右邊標記2所示，則會回應『動作錯誤—“????”』這樣的訊息給使用者的瀏覽器，其中的問號部分(即“????”)為使用者所傳送過來的URL內容，在此錯誤訊息不會顯示在OLED顯示器上。。
4、如果輸入的內容是： [ 192.168.0.4 /LedOn]，則ESP8266模組(ESP-12X)上內建的LED(GPIO 2)會點亮，而且系統會回應『單一LED輸出控制 -- LED 點亮』的訊息給客戶端，並且會在OLED顯示器上顯示【圖七、2-1.1_3】左邊的畫面，在此指令的大小寫並不會影響動作的結果，也就是說”/LEDON”和”/ledon”都可以適用。
圖七、2-1.1_3輸入[ 192.168.0.4 /LedOn] URL指令OLED顯示器對應畫面
5、如果輸入的是： [ 192.168.0.2 /LedOff]，則ESP8266模組(ESP-12X)上內建的LED會熄滅，而且系統會回應『單一LED輸出控制 -- LED 熄滅』的訊息給客戶端，並且會在OLED顯示器上顯示【圖七、2-1.1_4】左邊的畫面。。
圖七、2-1.1_4輸入[ 192.168.0.4 /LedOn] URL指令OLED顯示器對應畫面
◎電路圖：
本此範例的電路圖與上一節完全相同，可直接適用。
◎ 程式列表與說明：
為了保持程式版面簡潔，因此將程式中所使用到的OLED顯示器貼圖資料碼放在另外開了一個名為「image.h」標籤頁面內，而部分網頁html程式碼則放在「index.h」這個標籤頁面中。
#include "WiFiConnect.h" //include before SSD1306.h if using custom fonts
#include <Wire.h>
#include <Adafruit_GFX.h>
#include <Adafruit_SSD1306.h>
#include "image.h"
#include "index.h"
WiFiServer server(80);
WiFiClient client;
String html_end="</body></html>";
String Uri;
WiFiConnect wc; // 宣告一WiFiConnect類別物件變數
#define SCREEN_WIDTH 128 // OLED display width, in pixels
#define SCREEN_HEIGHT 64 // OLED display height, in pixels
Adafruit_SSD1306 display(SCREEN_WIDTH, SCREEN_HEIGHT, &Wire, -1);
String softSsidChip = "ESP"+String(ESP.getChipId());
const byte indLED=2; // ESP系列模組郵票板指示用LED腳位
const byte ledOn=0;
const byte ledOff=1;
// 連線設定回應副程式:
void configModeCallback(WiFiConnect *mWiFiConnect) {
Serial.println("Entering Access Point!");
Serial.println("進入 AP 存取點模式!");
}
// WiFi連線副程式 :
void startWiFi(boolean showParams = false) {
wc.setDebug(true);
// 設定連線回應副程式
wc.setAPCallback(configModeCallback);
/*
AP_NONE = Continue executing code --> 繼續往下執行
AP_LOOP = Trap in a continuous loop --> 進入無窮AP設定迴圈莊太
AP_RESET = Restart the chip --> 啟動晶片重置動作
*/
// ESP系列模組進入存取點(Access Point)模式畫面:
if ( !wc.autoConnect()) { // try to connect to wifi
// 測試ESPXX系列晶片有沒有再自動連上WiFi分享器
LED_Blink(5,300);
wc.startConfigurationPortal(AP_LOOP);//if not connected show the configuration portal
}
} // WiFi連線副程式結束
// setuo()初始化程式開始:
void setup() {
Serial.begin(115200);
pinMode(indLED,OUTPUT);
digitalWrite(indLED,1);
Serial.println();
Serial.println("Program Start!");
Serial.println("程式開始!");
// initialize with the I2C addr 0x3C
if(display.begin(SSD1306_SWITCHCAPVCC, 0x3C)) // Address 0x3D for 128x64
{
Serial.println("SSD1036 OLED allocation Successed!");
Serial.println("SSD1306 初始化成功!");
}
else {
Serial.println("SSD1306 allocation failed!");
Serial.println("SSD1306 初始化失敗");
for(;;);
}
// Draw bitmap on the screen
display.clearDisplay();
display.setTextSize(2);
display.setTextColor(WHITE);
display.setCursor(0,0);
display.println("");
display.println(" Program ");
display.println(" Start!");
display.display();
delay(2000);
// 啟動WiFi連線參數清除
// wc.resetSettings(); //helper to remove the stored wifi connection, comment out after first upload and re upload
// 在螢幕上畫出WiFi圖片
display.clearDisplay();
display.drawBitmap(30, 0, WiFiMap2, 70, 40, WHITE);
display.setTextSize(1);
display.setTextColor(WHITE);
display.setCursor(0,46);
display.println(" Waiting for");
display.println(" Connection...");
display.display();
// 啟動WiFi連線副程式
startWiFi();
Serial.print("Cnnect to : ");
Serial.println(WiFi.SSID());
Serial.print("ESP已連接至:");
Serial.println(WiFi.SSID());
display.clearDisplay();
// Draw bitmap on the screen
display.drawBitmap(30, 0, WiFiMap2, 70, 40, WHITE);
display.setTextSize(1);
display.setTextColor(WHITE);
display.setCursor(0,40);
display.println("ESP Connect to :");
display.print(" ");
display.println(WiFi.SSID());
display.print(" IP:");
display.println(WiFi.localIP());
display.display();
// WiFi連線成功 :
delay(3000);
Serial.println();
Serial.print("WiFi Connected, IP address: ");
Serial.println(WiFi.localIP());
Serial.print("連線成功, 本地WiFi的IP位址為 : ");
Serial.println(WiFi.localIP());
Serial.println();
LED_Blink(5,400);
delay(1000);
server.begin();
display.clearDisplay();
display.setTextSize(2);
display.setCursor(0,16);
display.println(" System");
display.println(" Ready!");
display.display();
} // setuo()初始化程式結束
// loop()主迴圈程式開始:
void loop() {
client=server.available();
if(!client)
return;
String request="",requests="";
while(client.connected())
{
request=client.readStringUntil('\r');
requests+=request;
if(request=="\n")
break;
}
client.flush();
Serial.println("Request end!");
Uri=requests.substring(requests.indexOf("/"),requests.indexOf("HTTP"));
Uri.trim();
Serial.print("Uri = '");
Serial.print(Uri);
Serial.println("'");
String URI=Uri;
URI.toUpperCase();
if(URI=="/")
handleRoot();
else if (URI=="/LEDON")
LedOn();
else if (URI=="/LEDOFF")
LedOff();
else
handleNotFound();
delay(5);
} // loop()主迴圈程式結束
void handleRoot(){
String s=MAIN_page;
s+="<h4>ESP8266 站點模式-- 單一LED輸出控制</b></h4>";
s+=html_end;
client.print(s);
Serial.println("Client is connected!");
Serial.println();
}
void LedOn() {
String s=MAIN_page;
digitalWrite(indLED,0);
s+="<h4>單一LED輸出控制 -- LED 點亮</h4>";
s+=html_end;
client.print(s);
Serial.println("LED is On!");
Serial.println();
display.clearDisplay();
display.drawBitmap(40, 0, LED_ON, 48, 48, WHITE);
display.setTextSize(2);
display.setCursor(0,50);
display.println(" LED On!");
display.display();
}
void LedOff() {
String s=MAIN_page;
digitalWrite(indLED,1);
s+="<h4>單一LED輸出控制-- LED 熄滅</h4>";
s+=html_end;
client.print(s);
Serial.println("LED is Off!");
Serial.println();
display.clearDisplay();
display.drawBitmap(35, 0, LED_OFF, 55, 48, WHITE);
display.setTextSize(2);
display.setCursor(0,50);
display.println(" LED Off!");
display.display();
}
void handleNotFound(){
String s=MAIN_page;
s+="<h4>動作錯誤! ==> ";
s+=Uri;
s+="</h4>";
s+=html_end;
client.print(s);
Serial.print("URI not found -->");
Serial.println(Uri);
Serial.println();
}
// 讓指示LED快閃count次,亮滅時間為dTime秒
void LED_Blink(int count,int dTime)
{
for(int i=0;i<count;i++)
{
digitalWrite(indLED,0);
delay(dTime);
digitalWrite(indLED,1);
delay(200);
}
}
// 以下部分為「image.h」標籤頁面的內容:
// '319-3192981_free-wifi-svg-png-icon-free-download-free', 70x40px
const unsigned char WiFiMap2 [] PROGMEM = {
0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00,
0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x20, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x7f, 0xff,
0xfc, 0x00, 0x00, 0x00, 0x00, 0x00, 0x0f, 0xff, 0xff, 0xff, 0xc0, 0x00, 0x00, 0x00, 0x00, 0x7f,
0xff, 0xff, 0xff, 0xf8, 0x00, 0x00, 0x00, 0x01, 0xff, 0xe0, 0x00, 0x1f, 0xff, 0x00, 0x00, 0x00,
0x0f, 0xfc, 0x00, 0x00, 0x00, 0xff, 0xc0, 0x00, 0x00, 0x3f, 0xe0, 0x00, 0x00, 0x00, 0x1f, 0xf0,
0x00, 0x00, 0xff, 0x00, 0x00, 0x00, 0x00, 0x03, 0xfc, 0x00, 0x01, 0xfc, 0x00, 0x00, 0x00, 0x00,
0x00, 0xfe, 0x00, 0x07, 0xf0, 0x00, 0x00, 0x00, 0x00, 0x00, 0x3f, 0x80, 0x0f, 0xc0, 0x00, 0x1f,
0xff, 0xf0, 0x00, 0x0f, 0xc0, 0x1f, 0x80, 0x01, 0xff, 0xff, 0xfe, 0x00, 0x07, 0xe0, 0x3f, 0x00,
0x0f, 0xff, 0xff, 0xff, 0xc0, 0x01, 0xf0, 0x3c, 0x00, 0x3f, 0xf8, 0x00, 0x3f, 0xf0, 0x00, 0xf0,
0x18, 0x00, 0xff, 0x80, 0x00, 0x07, 0xfc, 0x00, 0x60, 0x00, 0x03, 0xfc, 0x00, 0x00, 0x00, 0xff,
0x00, 0x00, 0x00, 0x07, 0xf0, 0x00, 0x00, 0x00, 0x3f, 0x80, 0x00, 0x00, 0x0f, 0xc0, 0x00, 0x00,
0x00, 0x0f, 0xc0, 0x00, 0x00, 0x1f, 0x80, 0x00, 0x00, 0x00, 0x07, 0xe0, 0x00, 0x00, 0x3e, 0x00,
0x07, 0xff, 0x80, 0x01, 0xf0, 0x00, 0x00, 0x1c, 0x00, 0x3f, 0xff, 0xf0, 0x00, 0xe0, 0x00, 0x00,
0x00, 0x00, 0xff, 0xff, 0xfc, 0x00, 0x00, 0x00, 0x00, 0x00, 0x03, 0xfe, 0x01, 0xff, 0x00, 0x00,
0x00, 0x00, 0x00, 0x07, 0xf0, 0x00, 0x3f, 0x80, 0x00, 0x00, 0x00, 0x00, 0x0f, 0xc0, 0x00, 0x0f,
0xc0, 0x00, 0x00, 0x00, 0x00, 0x1f, 0x80, 0x00, 0x03, 0xe0, 0x00, 0x00, 0x00, 0x00, 0x1e, 0x00,
0x00, 0x01, 0xe0, 0x00, 0x00, 0x00, 0x00, 0x0c, 0x00, 0x00, 0x00, 0xc0, 0x00, 0x00, 0x00, 0x00,
0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00,
0x00, 0x00, 0x00, 0x00, 0xfc, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x01, 0xfe, 0x00, 0x00,
0x00, 0x00, 0x00, 0x00, 0x00, 0x01, 0xfe, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x01, 0xfe,
0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x01, 0xfe, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00,
0x00, 0xfc, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00,
0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00
};
// 'WiFi_AP4', 55x35px
const unsigned char WiFi_AP4 [] PROGMEM = {
0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xfe, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xfe, 0xff, 0xff,
0xff, 0xfe, 0x7f, 0xff, 0x9e, 0xff, 0xff, 0xff, 0xfc, 0x7f, 0xff, 0x8e, 0xff, 0xff, 0xff, 0xf8,
0xe7, 0xf9, 0xc6, 0xff, 0xff, 0xff, 0xf9, 0xc7, 0xf8, 0xe6, 0xff, 0xff, 0xff, 0xf1, 0xcf, 0x3c,
0xe6, 0xff, 0xff, 0xff, 0xf3, 0x8e, 0x0c, 0x62, 0xff, 0xff, 0xff, 0xf3, 0x8e, 0x0e, 0x62, 0xff,
0xff, 0xff, 0xf1, 0xce, 0x1c, 0xe2, 0xff, 0xff, 0xff, 0xf9, 0xcf, 0x3c, 0xe6, 0xff, 0xff, 0xff,
0xf9, 0xe7, 0x39, 0xc6, 0xff, 0xff, 0xff, 0xfc, 0xff, 0x3f, 0xce, 0xff, 0xff, 0xff, 0xfe, 0x7f,
0x3f, 0x9e, 0xff, 0xff, 0xff, 0xff, 0xff, 0x3f, 0xfe, 0xff, 0xff, 0xff, 0xff, 0xff, 0x3f, 0xfe,
0xff, 0xff, 0xff, 0xff, 0xff, 0x3f, 0xfe, 0xff, 0xff, 0xff, 0xff, 0xff, 0x3f, 0xfe, 0xff, 0xff,
0xff, 0xff, 0xff, 0x3f, 0xfe, 0xff, 0xff, 0xff, 0xff, 0xff, 0x3f, 0xfe, 0xff, 0xff, 0xff, 0xff,
0xff, 0x3f, 0xfe, 0xff, 0xff, 0xff, 0xff, 0xff, 0x3f, 0xfe, 0xff, 0xff, 0xff, 0xff, 0xff, 0x3f,
0xfe, 0xc0, 0x00, 0x00, 0x00, 0x00, 0x00, 0x0e, 0x8f, 0xff, 0xff, 0xff, 0xff, 0xff, 0xe6, 0x8f,
0xff, 0xff, 0xff, 0xff, 0xff, 0xe6, 0x8f, 0xff, 0xff, 0xf9, 0xf3, 0xf3, 0xe6, 0x8f, 0xff, 0xff,
0xe0, 0xe0, 0xc1, 0xe6, 0x8e, 0x00, 0x01, 0xe0, 0xe4, 0xc0, 0xe6, 0x8f, 0xff, 0xff, 0xf0, 0xf1,
0xe1, 0xe6, 0x8f, 0xff, 0xff, 0xff, 0xff, 0xff, 0xe6, 0x8f, 0xff, 0xff, 0xff, 0xff, 0xff, 0xe6,
0xc0, 0x00, 0x00, 0x00, 0x00, 0x00, 0x06, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xfe, 0xff, 0xff,
0xff, 0xff, 0xff, 0xff, 0xfe
};
// 'led-light-bulb-diode-512', 48x48px
const unsigned char LED_ON [] PROGMEM = {
0xff, 0xff, 0xfc, 0x3f, 0xff, 0xff, 0xff, 0xff, 0xfc, 0x3f, 0xff, 0xff, 0xff, 0xff, 0xfc, 0x3f,
0xff, 0xff, 0xff, 0xff, 0xfc, 0x3f, 0xff, 0xff, 0xff, 0xff, 0xfc, 0x3f, 0xff, 0xff, 0xff, 0xff,
0xfc, 0x3f, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xfe, 0x3f, 0xff, 0xff, 0xfc, 0x7f,
0xfe, 0x1f, 0xff, 0xff, 0xf8, 0x3f, 0xfe, 0x0f, 0xff, 0xff, 0xf8, 0x7f, 0xff, 0x0f, 0xff, 0xff,
0xf0, 0xff, 0xff, 0x9f, 0xff, 0xff, 0xf9, 0xff, 0xff, 0xff, 0xf8, 0x1f, 0xff, 0xff, 0xff, 0xff,
0xc0, 0x03, 0xff, 0xff, 0xff, 0xff, 0x80, 0x01, 0xff, 0xff, 0xff, 0xff, 0x07, 0xe0, 0xff, 0xff,
0xff, 0xfe, 0x1f, 0xf8, 0x7f, 0xff, 0xff, 0xfc, 0x3f, 0xfc, 0x3f, 0xff, 0xff, 0xf8, 0x7f, 0xfe,
0x1f, 0xff, 0xff, 0xf8, 0xff, 0xff, 0x1f, 0xff, 0xff, 0xf8, 0xff, 0xff, 0x1f, 0xff, 0xff, 0xf1,
0xff, 0xff, 0x8f, 0xff, 0x03, 0xf1, 0xff, 0xff, 0x8f, 0xc0, 0x03, 0xf1, 0xff, 0xff, 0x8f, 0xc0,
0x03, 0xf1, 0xff, 0xff, 0x8f, 0xc0, 0x03, 0xf1, 0xff, 0xff, 0x8f, 0xc0, 0xff, 0xf1, 0xff, 0xff,
0x8f, 0xff, 0xff, 0xf1, 0xff, 0xff, 0x8f, 0xff, 0xff, 0xf1, 0xff, 0xff, 0x8f, 0xff, 0xff, 0xf1,
0xff, 0xff, 0x8f, 0xff, 0xff, 0xf1, 0xff, 0xff, 0x8f, 0xff, 0xff, 0xf1, 0xff, 0xff, 0x8f, 0xff,
0xff, 0xf1, 0xff, 0xff, 0x8f, 0xff, 0xff, 0xc0, 0x00, 0x00, 0x03, 0xff, 0xff, 0x80, 0x00, 0x00,
0x01, 0xff, 0xff, 0x80, 0x00, 0x00, 0x01, 0xff, 0xff, 0xfe, 0x3f, 0xfc, 0x7f, 0xff, 0xff, 0xfe,
0x3f, 0xfc, 0x7f, 0xff, 0xff, 0xfe, 0x3f, 0xfc, 0x7f, 0xff, 0xff, 0xfe, 0x3f, 0xfc, 0x7f, 0xff,
0xff, 0xfe, 0x3f, 0xfc, 0x7f, 0xff, 0xff, 0xfe, 0x3f, 0xfc, 0x7f, 0xff, 0xff, 0xfe, 0x3f, 0xfc,
0x7f, 0xff, 0xff, 0xfe, 0x3f, 0xfc, 0x7f, 0xff, 0xff, 0xfe, 0x3f, 0xfc, 0x7f, 0xff, 0xff, 0xfe,
0x3f, 0xfc, 0x7f, 0xff, 0xff, 0xfe, 0x3f, 0xfc, 0x7f, 0xff, 0xff, 0xff, 0x3f, 0xfe, 0x7f, 0xff
};
// 'led-variant-off2', 55x48px
const unsigned char LED_OFF [] PROGMEM = {
0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xfe, 0xff, 0xff, 0xff, 0xe0, 0x3f, 0xff, 0xfe, 0xff, 0xff,
0xff, 0x00, 0x07, 0xff, 0xfe, 0xff, 0xff, 0xfc, 0x00, 0x03, 0xff, 0xfe, 0xe3, 0xff, 0xf8, 0x00,
0x01, 0xff, 0xfe, 0xc1, 0xff, 0xf0, 0x00, 0x00, 0xff, 0xfe, 0x80, 0xff, 0xf0, 0x00, 0x00, 0x7f,
0xfe, 0xc0, 0x3f, 0xe0, 0x00, 0x00, 0x7f, 0xfe, 0xe0, 0x1f, 0xe0, 0x00, 0x00, 0x3f, 0xfe, 0xf8,
0x0f, 0xe0, 0x00, 0x00, 0x3f, 0xfe, 0xfc, 0x07, 0xf8, 0x00, 0x00, 0x3f, 0xfe, 0xfe, 0x03, 0xfc,
0x00, 0x00, 0x3f, 0xfe, 0xff, 0x00, 0xfe, 0x00, 0x00, 0x3f, 0xfe, 0xff, 0x80, 0x7f, 0x00, 0x00,
0x3f, 0xfe, 0xff, 0xe0, 0x3f, 0x80, 0x00, 0x3f, 0xfe, 0xff, 0xf0, 0x1f, 0xe0, 0x00, 0x3f, 0xfe,
0xff, 0xf8, 0x0f, 0xf0, 0x00, 0x3f, 0xfe, 0xff, 0xfc, 0x03, 0xf8, 0x00, 0x3f, 0xfe, 0xff, 0xfe,
0x01, 0xfc, 0x00, 0x3f, 0xfe, 0xff, 0xff, 0x80, 0xff, 0x00, 0x3f, 0xfe, 0xff, 0xff, 0xc0, 0x7f,
0x80, 0x3f, 0xfe, 0xff, 0xff, 0xe0, 0x3f, 0xc0, 0x3f, 0xfe, 0xff, 0xff, 0xe0, 0x0f, 0xe0, 0x3f,
0xfe, 0xff, 0xff, 0xe0, 0x07, 0xf0, 0x3f, 0xfe, 0xff, 0xff, 0xe0, 0x03, 0xfc, 0x3f, 0xfe, 0xff,
0xf8, 0x00, 0x01, 0xfe, 0x00, 0xfe, 0xff, 0xf8, 0x00, 0x00, 0xff, 0x00, 0xfe, 0xff, 0xf8, 0x00,
0x00, 0x3f, 0x80, 0xfe, 0xff, 0xf8, 0x00, 0x00, 0x1f, 0xc0, 0xfe, 0xff, 0xf8, 0x00, 0x00, 0x0f,
0xf0, 0xfe, 0xff, 0xff, 0xf8, 0x1c, 0x07, 0xff, 0xfe, 0xff, 0xff, 0xf8, 0x1e, 0x03, 0xff, 0xfe,
0xff, 0xff, 0xf8, 0x1f, 0x00, 0xff, 0xfe, 0xff, 0xff, 0xf8, 0x1f, 0x80, 0x7f, 0xfe, 0xff, 0xff,
0xf8, 0x1f, 0x80, 0x3f, 0xfe, 0xff, 0xff, 0xf8, 0x1f, 0x80, 0x1f, 0xfe, 0xff, 0xff, 0xf8, 0x1f,
0x80, 0x0f, 0xfe, 0xff, 0xff, 0xf8, 0x1f, 0x80, 0x03, 0xfe, 0xff, 0xff, 0xf8, 0x1f, 0x80, 0x01,
0xfe, 0xff, 0xff, 0xf8, 0x1f, 0x81, 0x80, 0xfe, 0xff, 0xff, 0xf8, 0x1f, 0x81, 0xc0, 0x7e, 0xff,
0xff, 0xf8, 0x1f, 0x81, 0xe0, 0x3e, 0xff, 0xff, 0xf8, 0x1f, 0x81, 0xf0, 0x0e, 0xff, 0xff, 0xf8,
0x1f, 0x81, 0xf8, 0x06, 0xff, 0xff, 0xfc, 0x1f, 0x81, 0xfe, 0x06, 0xff, 0xff, 0xff, 0xff, 0xff,
0xff, 0x0e, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0x9e, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xfe
};
// 以下部分為「index.h」標籤頁面的內容:
// 將我們的HTML 網頁程式內容直接建構在program memory內:
const char MAIN_page[] PROGMEM = R"=====(
<!DOCTYPE html>
<html>
<head>
<meta name='viewport' content='width=device-width, initial-scale=1.0'/>
<meta charset='utf-8'>
<link rel='icon' href='data:,\'>
<style>body {font-size:140%;} #main {display:table; margin:auto;
padding:0 10px 0 10px;} h4,{text-align:center;}
.button {padding:10px 10px 10px 10px; width:100%; background- color:#4caf50; font-size:120%;}
</style>
<title>ESP8266 連接WiFi無線區域網路的第一個單一LED程式</title>
</head>
<center>
<body>
)=====";
程式名稱：ESP_CH7_2_1_Get.ino
上面這個範例程式主要是結合了前一章的「softAP_6_5_1Led2.ino」，與上一節的「ESP_CH7_AutoConnectOLED20.ino」兩個程式而成，為了節省篇幅，在此僅就新增及不同的部分加以說明，如果有不了解的請自行回到之前的文章去研讀一下。
為了善用OLED顯示器的功能，因此在控制ESP8266模組板上LED的亮滅時，除了把結果回傳給使用者的瀏覽器之外，也會把動作的結果顯示在OLED顯示器上；在這個範例程式中新增了兩張代表LED亮滅的圖片，名稱分別是「LED_ON[]」和「LED_OFF[]」，這兩張圖片資料的位置是在程式碼的289~308行與311~333行，其外觀如下：
圖七、2-1.1_5 「LED_ON」與 「LED_OFF」外觀圖
本範例程式的1~134行，也就是一直到初始化程式(即”setup()”)完成為止，都是沿用前一節「ESP_CH7_AutoConnectOLED20.ino」這個程式的內容，主要的不同點都在主迴圈程式中(loop())中！143~160行的程式會將瀏覽器送來的URI內容萃取出來，並利用下面這行指令把它轉成全部大寫，這樣可以避免使用者在輸入指令時，因為大小寫的問題而發生錯誤。
160. URI.toUpperCase();
接下來的161~168行程式便會依URI的內容分別去呼叫對應的副程式，如果內容為”/”，代表要連上首頁，系統便會呼叫「handleRoot()」這個首頁副程式，如果指令為"/LEDON"，則呼叫LED點亮副程式「LedOn()」，假如是熄滅LED指令"/LEDOFF"，便會呼叫「LedOff()」這個副程式，如果都不是那就啟動「handleNotFound()」這個專用來處理錯誤的副程式了。
173~180行的「handleRoot()」首頁副程式，和216~227行的「handleNotFound()」的錯誤處理副程式，會分別實作出【圖七、2-1.1_2】中的兩種網頁頁面內容；至於182~197行的LED點亮副程式「LedOn()」，負責實作出【圖七、2-1.1_3】的畫面，而【圖七、2-1.1_4】的畫面則是由199~214行的熄滅LED副程式「LedOff()」所完成；這兩個和LED亮滅控制有關的副程式，和前一章「softAP_6_5_1Led2.ino」這個程式中的，差別只是多了OLED提示訊息顯示的部分而已，其他的包括輸出控制及網頁html程式部分都是一樣的。
◎ 執行結果：
前面的【圖七、2-1.1_1】至【圖七、2-1.1_4】就是此範例程式執行結果，其中包括了手機端瀏覽器與ESP8266模組端OLED顯示器畫面的截圖，至於下面的影片則是完整的啟動與操作過程，由於拍攝和WiFi分享器連線影片的時間與前面截圖畫面不同，因此在影片中所看到分配的本地IP位址為[ 192.168.0.2 ]。
沒有留言:
張貼留言