ESP32 网络服务器控制输出

在本教程中，您将学习如何使用 WebSocket 通信协议使用 ESP32 构建 Web 服务器。例如，我们将向您展示如何构建一个网页来远程控制 ESP32 输出。输出状态显示在网页上，并在所有客户端中自动更新。

对于一些 Web 服务器项目，您可能已经注意到，如果您同时打开了多个选项卡（在相同或不同的设备上），则状态不会全部更新，除非您刷新网页，否则会自动打开标签。为了解决这个问题，我们可以使用 WebSocket 协议 —— 当发生变化时，可以通知所有客户端并相应地更新网页。

协议介绍

WebSocket 是客户端和服务器之间的持久连接，允许双方使用 TCP 连接进行双向通信。这意味着您可以在任何给定时间从客户端向服务器发送数据，也可以从服务器向客户端发送数据。

客户端通过称为 WebSocket 握手的过程与服务器建立 WebSocket 连接。握手以 HTTP 请求/响应开始，允许服务器在同一端口上处理 HTTP 连接以及 WebSocket 连接。一旦建立连接，客户端和服务器就可以全双工模式发送 WebSocket 数据。

使用 WebSockets 协议，服务器（ESP32 板）可以向客户端或所有客户端发送信息而无需请求。这还允许我们在发生更改时，将信息发送到 Web 浏览器。

这种变化可能发生在网页上（你点击了一个按钮），也可能发生在 ESP32 端，比如按下电路上的物理按钮。

以下是我们将为此项目构建的网页。

下图描述了单击“切换”按钮时发生的情况。

当您单击“切换”按钮时，会发生以下情况：