在這個(gè)項(xiàng)目中，我們將學(xué)習(xí)如何創(chuàng)建一個(gè)氣象站，它將在web服務(wù)器中顯示來自BME280模塊的讀數(shù)和來自O(shè)penWeatherMap API的實(shí)時(shí)天氣數(shù)據(jù)。該設(shè)備將從BME280傳感器獲取溫度、濕度、氣壓和高度，并從OpenWeatherMap API獲取外部溫度、濕度、天氣狀況以及日出和日落。我們可以在網(wǎng)絡(luò)瀏覽器中看到他們?cè)陂喿x。

BME280溫度，濕度和壓力傳感器

BME280是一款專為移動(dòng)應(yīng)用和可穿戴設(shè)備開發(fā)的集成環(huán)境傳感器，尺寸和低功耗是關(guān)鍵設(shè)計(jì)參數(shù)。該裝置結(jié)合了高線性度和高精度傳感器，是完全可行的低電流消耗和長(zhǎng)期穩(wěn)定。BME280傳感器提供了極快的響應(yīng)時(shí)間，因此支持新興應(yīng)用的性能要求，例如上下文感知，以及在寬溫度范圍內(nèi)的高精度。

該傳感器測(cè)量相對(duì)濕度范圍為0 ~ 100%，精度為±3%，氣壓范圍為300Pa ~ 1100hpa，絕對(duì)精度為±1hpa，溫度范圍為-40℃~ 85℃，精度為±1.0℃。

BME280支持I2C接口和SPI接口。我們使用的模塊支持1.7 - 3.3V的電壓范圍。當(dāng)以1Hz的刷新率測(cè)量所有參數(shù)時(shí)，BME280的平均電流消耗為3.6μA。傳感器支持休眠、正常、強(qiáng)制三種電源模式。

在購(gòu)買BME280模塊時(shí)要記住的一件事是，外觀相似的模塊也帶有缺乏濕度測(cè)量功能的BMP280傳感器，這使得它比BME280便宜得多。識(shí)別BME280和BMP280傳感器的最佳方法是查看產(chǎn)品代碼。BME280傳感器將有一個(gè)以“U”開頭的產(chǎn)品代碼，例如UP， UN等。而BMP280將有一個(gè)以“K”開頭的產(chǎn)品代碼，例如KN， KP等。另一個(gè)視覺差異是BME280有點(diǎn)方形，而BMP280是矩形。

OpenWeatherMap API

OpenWeatherMap是一個(gè)在線服務(wù)，通過API提供全球天氣數(shù)據(jù)，包括當(dāng)前天氣數(shù)據(jù)、預(yù)報(bào)、臨近預(yù)報(bào)和任何地理位置的歷史天氣數(shù)據(jù)。通過他們的API，我們可以訪問地球上任何位置的當(dāng)前天氣數(shù)據(jù)，包括超過20萬個(gè)城市!他們收集和處理來自不同來源的天氣數(shù)據(jù)，如全球和當(dāng)?shù)靥鞖饽Ｐ?、衛(wèi)星、雷達(dá)和一個(gè)龐大的氣象站網(wǎng)絡(luò)。數(shù)據(jù)有JSON、XML和HTML三種格式。我們將使用HTTP GET來請(qǐng)求這個(gè)項(xiàng)目的JSON數(shù)據(jù)。

氣象站線路圖

連接相當(dāng)簡(jiǎn)單。按照上面的連接圖進(jìn)行操作。我們?cè)黾恿艘粋€(gè)18650電池和TP4056充電模塊，并為備份提供保護(hù)。首先將電池的負(fù)極連接到TP4056模塊的B-引腳，將正極連接到模塊的B+引腳?，F(xiàn)在將模塊的OUT+連接到ESP32 Devkit的VIN引腳，B-連接到GND引腳。TP4056模塊還包含DW01保護(hù)芯片，可以防止電池過放電和短路。

現(xiàn)在讓我們將BME280模塊連接到ESP32 Devkit。BME280的VCC引腳接3.3V引腳，GND接GND引腳。該模塊同時(shí)支持SPI和I2C。我們將使用I2C接口進(jìn)行通信。為此，將SDA引腳連接到ESP32 Devkit的D22，將SCL引腳連接到D21。

代碼說明和Arduino IDE安裝庫

對(duì)于這個(gè)項(xiàng)目，我們需要安裝幾個(gè)Arduino庫，它可以直接通過庫管理器完成。要安裝庫，請(qǐng)導(dǎo)航到Arduino IDE > Sketch > Include Library > Manage libraries…等待Library Manager下載庫索引并更新已安裝庫列表。然后搜索并安裝以下庫。

?Adafruit BME280庫

?Adafruit統(tǒng)一傳感器

?Arduino_JSON圖書館

使用zip文件安裝以下庫。

?ESPAsyncWebServer

?AsyncTCP

在Arduino IDE中安裝ESP32文件系統(tǒng)上傳器

我們使用SPIFFS來托管web服務(wù)器文件。我們可以像使用普通文件系統(tǒng)一樣使用ESP32閃存，就像在SD卡或USB大容量存儲(chǔ)中一樣，借助SPIFFS將這些文件上傳到文件系統(tǒng)中，我們需要一個(gè)稱為ESP32文件系統(tǒng)上傳器的工具。要將此工具安裝到Arduino IDE，請(qǐng)遵循以下步驟

?到GitHub發(fā)布頁面下載ESP32FS-1.0.zip。

?將zip文件解壓縮到Arduino IDE目錄下的Tools文件夾。解壓后的路徑看起來像這樣“C:\Users\Username\Documents\Arduino\tools\ESP32FS\tool\ ESP32FS .jar”

?重新啟動(dòng)Arduino IDE，您可以通過單擊Tools Menu使用此工具。

web服務(wù)器文件結(jié)構(gòu)

正如我們已經(jīng)說過的，我們將使用ESP32文件系統(tǒng)來托管web服務(wù)器。文件系統(tǒng)結(jié)構(gòu)如下所示。需要加載到文件系統(tǒng)的所有數(shù)據(jù)都存儲(chǔ)在sketch文件夾中名為data的文件夾中。

HTML文件

html文件是服務(wù)器收到請(qǐng)求時(shí)加載的主文件。它包含了網(wǎng)頁的所有結(jié)構(gòu)編程。

CSS文件

css文件用于定義HTML頁面的樣式。使用CSS，我們可以控制顏色，字體，文字大小，元素之間的間距，元素如何定位和布局，使用什么背景圖像或背景顏色，不同設(shè)備和屏幕尺寸的不同顯示，等等!

JavaScript文件

javascript文件負(fù)責(zé)圖像操作、JSON解碼和內(nèi)容的動(dòng)態(tài)更改。這有助于我們更新網(wǎng)頁上的值。它控制數(shù)據(jù)更新的事件偵聽器。

Arduino草圖

這是ESP32氣象站的草圖。

讓我們看一下代碼是如何從傳感器讀取數(shù)據(jù)，從API獲取天氣數(shù)據(jù)，并將其發(fā)送到web服務(wù)器的。

包括庫

WiFi、HTTPClient、AsyncTCP和ESPAsyncWebServer庫用于WiFi通信和web服務(wù)器的創(chuàng)建和維護(hù)。

SPIFFS庫用于文件系統(tǒng)管理，Arduino_JSON庫用于處理JSON字符串。

最后，Adafruit傳感器庫和Adafruit BME280庫用于處理BME280傳感器。

用戶可修改參數(shù)

在代碼中，需要更改一些值才能使其正常工作。將“您的WiFi SSID”和“您的WiFi密碼”替換為您的WiFi SSID和密碼。另外，根據(jù)您的城市代碼和溫度測(cè)量單位更改。

下一個(gè)也是最重要的參數(shù)是API密鑰。這個(gè)密鑰是唯一的，這是我們從OpenWeatherMap服務(wù)器提取數(shù)據(jù)的認(rèn)證密鑰。獲取API密鑰的過程非常簡(jiǎn)單。去OpenWeatherMap網(wǎng)站，創(chuàng)建一個(gè)賬戶。如果你已經(jīng)有一個(gè)帳戶，就登錄進(jìn)去。。在該頁面上，您可以看到您的默認(rèn)API密鑰。如果您愿意，可以稍后創(chuàng)建密鑰。復(fù)制API密鑰并將其粘貼到代碼中。這樣就可以從OpenWeatherMap服務(wù)器獲取數(shù)據(jù)了。

獲取BME280讀數(shù)

下面的函數(shù)用于從BME280獲取讀數(shù)。

在這個(gè)函數(shù)中，每次讀取都從BME280傳感器獲取，并將其編碼為JSON字符串，然后將JSON字符串返回給事件處理程序。當(dāng)事件被觸發(fā)時(shí)，事件處理程序?qū)堰@些數(shù)據(jù)發(fā)送到web頁面。

從OpenWeatherMap API獲取天氣數(shù)據(jù)

為此，我們創(chuàng)建了另一個(gè)函數(shù)。它將以JSON格式從API獲取天氣數(shù)據(jù)，解碼，并將其排列成我們需要的格式。然后，與BME280讀取函數(shù)類似，該函數(shù)將這些編碼為JSON字符串，并在觸發(fā)特定事件時(shí)將其發(fā)送到服務(wù)器。HTTP GET用于從服務(wù)器獲取數(shù)據(jù)。

Web設(shè)置和事件請(qǐng)求處理

下面的setup函數(shù)部分將創(chuàng)建和設(shè)置web服務(wù)器，并在網(wǎng)頁加載時(shí)處理事件請(qǐng)求。當(dāng)收到加載網(wǎng)頁的請(qǐng)求時(shí)，第一個(gè)事件處理程序?qū)l(fā)送網(wǎng)頁數(shù)據(jù)。第二個(gè)事件處理程序?qū)⒈O(jiān)聽重置請(qǐng)求，并將頁面上顯示的所有變量設(shè)置為零。第三個(gè)even處理程序是檢查客戶端連通性，如果客戶端斷開連接，服務(wù)器將嘗試在一秒鐘的間隔內(nèi)重新建立連接。

在循環(huán)函數(shù)中，還可以看到另外兩個(gè)事件處理程序。這些處理程序不會(huì)監(jiān)聽任何請(qǐng)求。它們將在設(shè)定的時(shí)間定期發(fā)送數(shù)據(jù)。這將刷新網(wǎng)頁上的數(shù)據(jù)。BME280的數(shù)據(jù)更新速度比開放天氣圖數(shù)據(jù)快。

上傳代碼和文件

上傳代碼很簡(jiǎn)單。就像其他Arduino板一樣，將ESP32 Devkit連接到PC上。選擇正確的“Board”和“Port”，單擊“upload”。就是這樣。要上傳Web Server文件，請(qǐng)確保所有文件都位于名為data的文件夾中，該文件夾與.ino文件位于同一文件夾中。進(jìn)入“工具-> ESP32草圖數(shù)據(jù)上傳”。IDE將上傳文件并重新啟動(dòng)ESP32。上傳文件時(shí)，請(qǐng)確保未打開串行監(jiān)視器。如果它被打開，你會(huì)得到一個(gè)錯(cuò)誤。如果是，只需關(guān)閉串行監(jiān)視器并再次上傳文件。您可以從以下鏈接下載草圖和web服務(wù)器文件。

訪問Web服務(wù)器

現(xiàn)在，一旦代碼被編譯并編程到ESP32中，你可以檢查串行監(jiān)視器，一旦ESP32連接到WiFi網(wǎng)絡(luò)，它就會(huì)打印出IP地址。

或者你可以檢查你的路由器和分配給ESP32的IP是什么。這取決于你的路由器。一旦你獲得了IP，你就可以通過簡(jiǎn)單地在瀏覽器中輸入這個(gè)地址并進(jìn)入頁面來訪問網(wǎng)絡(luò)服務(wù)器。這就是結(jié)果。

天氣狀況圖標(biāo)會(huì)根據(jù)從API接收到的數(shù)據(jù)而改變。日出和日落時(shí)間也從OWM API中提取。

本文編譯自iotdesignpro