7165| 2
|
[ESP32系列教程] ESP32 Arduino异步HTTP服务器教程:提供HTML |
本ESP32教程的测试是使用集成在ESP32开发板中的DFRobot的ESP-WROOM-32设备进行的。 简介 此ESP32 Arduino教程旨在解释如何在ESP32上Arduino核心运行的异步HTTP网络服务器上提供HTML内容。本ESP32教程的测试是使用集成在ESP32开发板中的DFRobot的ESP-WROOM-32设备进行的。 在本教程中,我们将提供一个包含在HTML标记中的简单文本。因此,我们需要告诉客户我们所服务的内容是HTML类型,这样它才知道如何解释。对于客户端,我们将使用Web浏览器。 代码 首先,我们需要加入一些库。我们需要Wi-Fi.h将ESP32连接到无线网络,ESPAsyncWebServer.h用于访问面向我们公开设置HTTP服务器所需方法的类。 此外,我们还需要AsyncTCP.h,它能够对服务器客户端进行处理。我们还需要编译代码所需的FS.h,尽管我们不会使用HTTP服务器上可用的任何文件系统功能。 由于我们需要连接到Wi-Fi网络,我们将声明两个全局变量所需的凭据,因此我们可以对其进行轻松更改。我们需要网络名称(SSID)和密码。 我们还需要一个AsyncWebServer类的实例,我们将用它来设置web服务器。请注意,此类构造函数接收服务器将侦听的端口作为输入。我们将使用端口80,这是默认的HTTP端口。 [mw_shl_code=applescript,true]#include <WiFi.h> #include <FS.h> #include <AsyncTCP.h> #include <ESPAsyncWebServer.h> const char* ssid = "yourNetworkName"; const char* password = "yourNetworkPassword"; AsyncWebServer server(80); [/mw_shl_code] 继续功能设置,我们将首先打开一个串行接口,然后将ESP32连接到以前在全局变量中提供凭据的Wi-Fi网络。您可以在这里查看关于如何将ESP32连接到Wi-Fi网络的详细教程 : ESP32 MicroPython教程:连接Wi-Fi网络。 [mw_shl_code=applescript,true]Serial.begin(115200); WiFi.begin(ssid, password); while (WiFi.status() != WL_CONNECTED) { delay(1000); Serial.println("Connecting to WiFi.."); } Serial.println(WiFi.localIP());[/mw_shl_code] 请注意,当连接完成后,我们将在网络上打印ESP32的本地IP,因为我们需要使用Web浏览器连接到服务器。 现在我们将ESP32连接到网络,并实例化我们的服务器对象,我们将定义一条路由,它将监听传入的HTTP请求。该路由将与处理函数相关联,该处理函数将在客户端执行对该路由的请求时予以执行。 因此,如需将路由绑定到处理函数,我们只需在服务器对象上调用on方法即可。 作为第一个输入,它接收一个字符串,其中包含服务器应该监听的路由。我们将使用“/html”路线。 作为第二个输入,它接收一个类型为WebRequestMethod的枚举,它表示该路由允许的HTTP方法。我们将请求限制为GET,因此我们应该使用HTTP_GET值。 作为第三个参数,on方法接收将在收到请求时执行的处理函数。此函数的签名是固定的,它需要返回void并作为输入接收指向AsyncWebServerRequest类型的对象指针。 为了保持代码的紧凑性,并且由于我们需要保证处理函数的简单性,我们将它声明为C++ lambda函数。 [mw_shl_code=applescript,true]server.on("/html", HTTP_GET, [](AsyncWebServerRequest *request){ // Handling function code }); [/mw_shl_code] 在我们的lambda函数中,我们可以使用AsyncWebServerRequest类对象指定发送回HTTP客户端的答案。我们使用send方法执行此操作,该方法接收HTTP响应代码作为第一个输入,作为响应内容类型的第二个参数和作为实际内容的第三个参数。 我们将返回一个HTTP OK代码,对应于200。由于我们需要返回HTML,我们将内容类型定义为“text/html”。最后,我们将HTML内容指定为字符串。 [mw_shl_code=applescript,true]server.on("/html", HTTP_GET, [](AsyncWebServerRequest *request){ request->send(200, "text/html", "<p>This is HTML!</p>"); });[/mw_shl_code] 如需完成功能设置,我们需要在服务器对象上调用begin方法,因此它开始监听和处理客户端。由于我们使用的库为Web服务器实现了异步解决方案,因此我们无需在主循环上定期调用任何客户端处理函数,因此我们可以将其留空。 最终的源代码如下所示。 [mw_shl_code=applescript,true] #include <WiFi.h> #include <FS.h> #include <AsyncTCP.h> #include <ESPAsyncWebServer.h> const char* ssid = "yourNetworkName"; const char* password = "yourNetworkPassword"; AsyncWebServer server(80); void setup(){ Serial.begin(115200); WiFi.begin(ssid, password); while (WiFi.status() != WL_CONNECTED) { delay(1000); Serial.println("Connecting to WiFi.."); } Serial.println(WiFi.localIP()); server.on("/html", HTTP_GET, [](AsyncWebServerRequest *request){ request->send(200, "text/html", "<p>This is HTML!</p>"); }); server.begin(); } void loop(){ }[/mw_shl_code] 测试代码 如需测试代码,只需编译它并使用Arduino IDE将其上传到ESP32板即可。然后,打开串行监视器并复制与Wi-Fi网络连接完成后打印的IP。 然后,打开Web浏览器并在地址栏上写下以下内容,通过串行控制台上打印的IP更改{yourEspIp}。 您应该会得到类似于图1的输出,该输出显示返回的HTML内容。请注意,HTML确实被浏览器解释为,由于标签没有被打印,因为它们是作为标记而非内容的一部分。 图1 - 呈现返回浏览器的HTML。 注:本文作者是Nuno Santos,他是一位和蔼可亲的电子和计算机工程师,住在葡萄牙里斯本 (Lisbon)。 他写了200多篇有关ESP32、ESP8266的有用的教程和项目。 查看更多ESP32/ESP8266教程和项目: 中文版教程 : ESP32教程 合集 英文版教程 : ESP32 tutorial 合集 |
© 2013-2024 Comsenz Inc. Powered by Discuz! X3.4 Licensed