首页 > 解决方案 > Esp32 和站点通信

问题描述

基本上,我有一个带有本地 IP 的 esp32,我可以通过在与 esp32 相同的网络中键入“http:192.168.1.52/L”或“/H”cuz im 来打开和关闭灯。是否可以通过单击网页的按钮使服务器使用 /H 或 /L 访问 IP 地址并打开和关闭灯?喜欢:朋友->myOpenServer->localEsp32 我的朋友可以访问我的本地网络中托管的访问 esp32 ip 的 html

标签: htmllocallampesp32

解决方案


您可以通过 CSS 在 WiFiClient println 方法中添加按钮,如下所示
您可以根据需要进行适当的更改

        WiFiClient client = server.available();


        client.println("<!DOCTYPE html><html>");
        client.println("<head><meta name=\"viewport\" content=\"width=device-width, initial-scale=1\">");
        client.println("<link rel=\"icon\" href=\"data:,\">");

        client.println("<style>html { font-family: Helvetica; display: inline-block; margin: 0px auto; text-align: center;}");
        client.println(".button { background-color: #4CAF50; border: none; color: white; padding: 16px 40px;");
        client.println("text-decoration: none; font-size: 30px; margin: 2px; cursor: pointer;}");
        client.println(".button2 {background-color: #555555;}</style></head>");
        
        // Web Page Heading
        client.println("<body><h1>ESP32 Web Server</h1>");

推荐阅读