Day 29 : 第一个无线智慧装置

网页服务器

学习了快一个月後总算可以来撰写无线的智慧装置，

相信利用这些技术肯定能提升你的育儿体验，

那麽就赶紧来撰写智慧装置的韧体程序，

首先试着在 ESP8266 建立一个独立的网页服务器，

再利用它来做个简单的范例吧。

撰写程序

此范例目标是透过 Wifi 连线至网页来控制点亮与关闭 LED ，

首先要加入基本的 Wifi 连线功能，

以及建立出一个独立的服务器服务，

需要引用两个 Library ：

#include <ESP8266WiFi.h>
#include <ESP8266WebServer.h>

然後需要两个变数来存放 SSID 与 密码 ：

const char ssid[] = "SSID名称";
const char pass[] = "Wifi密码";

建立一个 Port 80 的服务器，

ESP8266WebServer server(80);

建立一个首页用来输入密码与执行动作：

void rootRouter()
{
    server.send(200, "text/html", "<form action=\"/door\" method=\"post\"><input type=\"password\" name=\"password\" placeholder=\"Password\"/><input type=\"submit\" name=\"action\" value=\"Open\" /><input type=\"submit\" name=\"action\" value=\"Close\" /></form>");
}

建立一个接收请求的页面，

用於执行硬体相对应的操作：

void doorRouter()
{
    String password = server.arg("password");
    if (password != "密码")
    {
        server.send(200, "text/html", "Wrong Password! <a href=\"/\">Back</>");
        return;
    }
    String action = server.arg("action");
    if (action == "Open")
    {
        digitalWrite(LED_BUILTIN, LOW);
        server.send(200, "text/html", "Opened! <a href=\"/\">Back</>");
    }
    else if (action == "Close")
    {
        digitalWrite(LED_BUILTIN, HIGH);
        server.send(200, "text/html", "Closed! <a href=\"/\">Back</>");
    }
}

服务器的初始化设定，

包括物联网 LED 的输出设定，

启用 Wifi 连线与重新连线设定，

服务器的网页路由启用设定：

void setup()
{
    Serial.begin(115200);
    
    pinMode(LED_BUILTIN, OUTPUT);
    digitalWrite(LED_BUILTIN, HIGH);
    
    WiFi.begin(ssid, pass);

    while (WiFi.status() != WL_CONNECTED)
    {
        delay(500);
        Serial.print(".");
    }
    Serial.println("");
    
    server.on("/index.html", rootRouter);
    server.on("/", rootRouter);
    server.on("/door", doorRouter);

    server.onNotFound([]() {
        server.send(404, "text/plain", "Page NOT found!");
    });

    server.begin();
    Serial.println("Server is now running on IP: ");
    Serial.println(WiFi.localIP());
    
}

在主函数中不断的监听服务器请求：

void loop()
{
    server.handleClient();
}

建立完之後就可以将韧体烧录到 ESP8266 了，

此范例打开後就可以看见简单的首页，

输入密码後点选就会点亮 LED 灯：

密码输入错误也会跳出警告：

大家有学会如何建立 Wifi 无线智慧装置了吗。