ESP系列WiFi模塊在基于物聯(lián)網(wǎng)項(xiàng)目的愛(ài)好者和行業(yè)中非常受歡迎。ESP32是ESP系列模塊中最受歡迎的板之一，它具有雙核32位CPU，內(nèi)置Wi-Fi，藍(lán)牙和足夠數(shù)量的I/O引腳。它是一種小型且經(jīng)濟(jì)有效的設(shè)備，可用于使任何項(xiàng)目與互聯(lián)網(wǎng)通信。在這個(gè)項(xiàng)目中，我將創(chuàng)建一個(gè)帶有ESP32的web服務(wù)器，使用Arduino IDE環(huán)境控制LED。Web服務(wù)器是我們存儲(chǔ)網(wǎng)頁(yè)、處理網(wǎng)頁(yè)并將其傳送給Web客戶端的地方。Web服務(wù)器可以通過(guò)本地網(wǎng)絡(luò)上的任何設(shè)備訪問(wèn)。在之前的教程中，我們使用樹(shù)莓派構(gòu)建了相同的web服務(wù)器。

需求

?ESP32模塊

?USB電纜

?電路試驗(yàn)板

?LED

?跳線

?電阻器1 k

線路圖

編程部分

完整的ESP32 web服務(wù)器代碼在本項(xiàng)目的末尾給出。在本節(jié)中，我將告訴您代碼的實(shí)際工作原理。

你需要做的第一件事是包括WiFi庫(kù)。

現(xiàn)在輸入您的網(wǎng)絡(luò)憑據(jù)，即您的WiFi網(wǎng)絡(luò)的SSID和密碼內(nèi)的雙倒逗號(hào)。

接下來(lái)，聲明一個(gè)WiFi Server庫(kù)的對(duì)象，這樣我們就可以訪問(wèn)它的函數(shù)了。所形成的實(shí)例的參數(shù)將是端口號(hào)，因?yàn)镠TTP的默認(rèn)端口號(hào)是80，所以我將使用這個(gè)值。

下面這行創(chuàng)建了一個(gè)變量來(lái)存儲(chǔ)HTTP請(qǐng)求的標(biāo)頭：

現(xiàn)在，您必須創(chuàng)建輔助變量來(lái)存儲(chǔ)輸出的當(dāng)前狀態(tài)。

現(xiàn)在，將GPIO分配到您的輸出，這里我使用GPIO2引腳作為我的輸出，您可以根據(jù)您正在使用的輸出更改它。

在void setup()函數(shù)中，我們將初始化波特率，LED輸出，并使用WiFi.begin(ssid,password)將模塊與Wi-Fi連接;函數(shù)。該功能啟動(dòng)Wi-Fi連接，等待連接成功，并在串口監(jiān)視器上打印ESP IP地址。

在loop()函數(shù)中，您必須編寫當(dāng)新客戶端與web服務(wù)器建立連接時(shí)發(fā)生的事情。ESP32總是使用server.available()偵聽(tīng)傳入的客戶端;并將輸入的數(shù)據(jù)存儲(chǔ)到一個(gè)字符串變量中，并在串行監(jiān)視器上打印數(shù)據(jù)。

現(xiàn)在，if和else語(yǔ)句檢查在您的網(wǎng)頁(yè)中按下了哪個(gè)按鈕，并相應(yīng)地控制輸出。例如，如果您按下GPIO2 ON按鈕，則ESP32接收到/2/ON URL上的請(qǐng)求，ESP32將LED打開(kāi)。

用于ESP32 Webserver的HTML代碼

在HTML中創(chuàng)建網(wǎng)頁(yè)對(duì)這個(gè)項(xiàng)目來(lái)說(shuō)是最重要的，ESP32將發(fā)送一個(gè)響應(yīng)到你的瀏覽器，其中包含一些HTML代碼來(lái)構(gòu)建網(wǎng)頁(yè)。-這里我們已經(jīng)嵌入了完整的HTML代碼在Arduino代碼使用client.println。最后給出了完整的代碼。

下面一行表示我們正在發(fā)送HTML。

下面的代碼行使網(wǎng)頁(yè)在任何瀏覽器中都能響應(yīng)。

現(xiàn)在我們要樣式我們的網(wǎng)頁(yè)，裝飾你的頁(yè)面，你可以使用CSS樣式按鈕和背景。您可以根據(jù)自己的需要更改屬性。

現(xiàn)在設(shè)置網(wǎng)頁(yè)的標(biāo)題。在這里，你可以給任何名字或任何你喜歡的東西。

現(xiàn)在您必須編寫代碼來(lái)顯示GPIO 2的當(dāng)前狀態(tài)。使用output2state變量，以便在變量更改時(shí)立即更新?tīng)顟B(tài)。

現(xiàn)在，根據(jù)GPIO的當(dāng)前狀態(tài)顯示on或off按鈕。如果當(dāng)前狀態(tài)是關(guān)閉的，你必須顯示ON按鈕，反之亦然。

最后，當(dāng)響應(yīng)結(jié)束時(shí)，必須清除header變量，并使用client.stop()停止與客戶端的連接。

這是整個(gè)項(xiàng)目的編程過(guò)程;本文最后給出了該項(xiàng)目的完整代碼，您可以查看。

用Arduino IDE編程ESP32

現(xiàn)在您正處于上傳ESP32代碼的階段，我們將使用Arduino IDE通過(guò)以下步驟上傳ESP32中的代碼：

通過(guò)USB電纜將ESP32連接到PC上，并如上所述制作電路，這里我使用的是GPIO2，您可以根據(jù)您的需要使用。

打開(kāi)Arduino IDE并將此代碼復(fù)制到IDE窗口，但請(qǐng)確保您提供了正確的網(wǎng)絡(luò)WiFi憑據(jù)。

現(xiàn)在進(jìn)入Tools——> Board——> ESP32 Dev module。

現(xiàn)在轉(zhuǎn)到Tools—>Port，選擇ESP32連接的端口。

現(xiàn)在單擊upload上傳代碼。

上傳完成后，您將在輸出控制臺(tái)中發(fā)現(xiàn)如下消息。

現(xiàn)在打開(kāi)你的串行監(jiān)視器，按下ESP32的重置按鈕，現(xiàn)在你的ESP開(kāi)始連接到你的網(wǎng)絡(luò)，一旦連接，它會(huì)給你這個(gè)ESP的IP。

現(xiàn)在打開(kāi)瀏覽器并輸入此IP地址，您將找到以下網(wǎng)頁(yè)。

從這個(gè)網(wǎng)頁(yè)，你可以控制你的LED，你可以看到在串行監(jiān)視器以及后臺(tái)發(fā)生了什么。

這就是你如何成功地創(chuàng)建一個(gè)web服務(wù)器，并從網(wǎng)頁(yè)控制LED。這樣，您也可以使用ESP32網(wǎng)絡(luò)服務(wù)器從世界任何地方控制家用電器。

本文編譯自iotdesignpro