構建一個實時系統(tǒng)遙測儀表板，在一個由DFRobot FireBeetle ESP32P4提供服務的黑暗單頁web UI中顯示您PC的CPU、RAM和網絡狀態(tài)。你的電腦通過USB串口發(fā)送換行結束的JSON;ESP32對其進行解析，在新數(shù)據到達時閃爍板載LED(引腳3)，并提供響應式AJAX儀表板，該儀表板每5秒更新一次，并包含原始JSON控制臺。

硬件

?DFRobot FireBeetle ESP32P4板(或兼容的ESP32P4板)

?USB數(shù)據線(用于電源、編程和串行數(shù)據)

?可選：小面包板/跳線，如果你想連接外部LED或按鈕(板載LED使用引腳3)

顯示/ UI

?web UI版本不需要OLED -一切都在瀏覽器中。

PC軟件

?Python 3.8 +

?Python包：pyserial， psutil(使用pip安裝pyserial psutil)

Arduino IDE

?最新的Arduino IDE或vscode與PlatformIO

?ESP32板支架安裝(pressif包)

?庫：Arduino_JSON(通過Library Manager安裝)

網絡

?ESP32用于承載web服務器的本地Wi - Fi網絡憑據(SSID和密碼)

為您的項目制造PCB

您必須檢查PCBWAY在線訂購pcb便宜!

你得到10個高質量的pcb制造和運送到你的家門口便宜。你也可以在第一次訂購時獲得折扣。將您的Gerber文件上傳到PCBWAY，以獲得高質量和快速周轉時間的制造。PCBWay現(xiàn)在可以提供完整的產品解決方案，從設計到外殼生產?？纯此麄兊脑诰€Gerber瀏覽器功能。有了獎勵積分，你就可以從他們的禮品店得到免費的東西。此外，從這里查看這個有用的博客PCBWay插件KiCad。使用此插件，您可以在KiCad中完成設計后直接訂購pcb。

布線和硬件設置

電源和數(shù)據

使用USB連接線將FireBeetle連接到PC上。這為遙測提供電源和串行鏈路。

LED

草圖在引腳3上使用板載LED。不需要額外的接線，除非你想要一個外部LED -然后連接LED +電阻引腳3和GND。

筆記

?在運行Python發(fā)送器之前關閉Arduino Serial Monitor(一次只有一個應用程序可以打開COM端口)

?確保在Arduino IDE中選擇FireBeetle作為目標板，并選擇正確的COM端口。

Arduino草圖(帶有AJAX儀表板的web服務器)

它是做什么的

?使用您的SSID和密碼連接到Wi - Fi。

?在USB串行(9600波特)上監(jiān)聽來自PC的換行結束的JSON。

?解析JSON并存儲最新的值。

?在http:///.提供一個黑暗主題的HTML儀表板

?提供/data JSON端點，供頁面的AJAX每5秒更新一次UI。

?當新數(shù)據到達時，在引腳3上的板載LED閃爍。

粘貼并上傳這個草圖(替換YOUR_SSID和YOUR_PASSWORD)：

筆記

?替換“YOUR_SSID”和“YOUR_PASSWORD”。

?在Python運行時保持Serial Monitor關閉。

Python遙測發(fā)送器(PC端)

它是做什么的

?使用psutil收集真實的系統(tǒng)統(tǒng)計信息。

?格式化JSON對象并每5秒通過USB串行發(fā)送到ESP32。

?需要換行結束符\n，以便ESP32可以使用readStringUntil('\n')。

Python腳本(在PC上運行，更新PORT)

運行和驗證(一步一步)

準備硬件

?通過USB連接FireBeetle到PC。

?確認單板驅動已安裝，且COM口可見。

上傳Arduino草圖

?打開Arduino IDE，粘貼草圖，將電路板設置為FireBeetle ESP32P4，更新WiFi憑據，然后上傳。

?上傳后，簡單打開Serial Monitor查看Wi - Fi連接日志，然后關閉它。注意打印的ESP32 IP。

啟動Python發(fā)送器

?將PORT更新為ESP32 COM端口(Windows: COMx, Linux: /dev/ttyUSB0)，然后運行Python腳本。

?確認腳本每5秒打印“Sent：”消息。

打開儀表板

?在同一網絡的瀏覽器中打開http:///(使用串口監(jiān)視器中打印的IP地址)。

?該頁面將每5秒自動獲取/數(shù)據并更新UI。

?原始JSON控制臺顯示最新的數(shù)據包。

驗證LED

?每次Python腳本發(fā)送一個新的JSON數(shù)據包時，引腳3上的板載LED應該會短暫閃爍。

后續(xù)步驟和增強

?在web界面中添加認證(基本令牌或密碼)。

?通過Wi - Fi發(fā)送遙測(從Python到ESP32的HTTP POST)以消除對USB的依賴。

?添加更多指標：網絡吞吐量，GPU統(tǒng)計(通過GPUtil)，每個分區(qū)的磁盤細節(jié)。

?將日志保存在SD卡上或發(fā)送到遠程服務器。

?在FireBeetle上添加手動控制按鈕，以更改刷新率或切換面板。

?改善視覺效果：使用本地托管的圖表庫(Chart.js)來制作火花線和歷史圖。

結論:

你現(xiàn)在有了一個完整的本地遙測解決方案：你電腦里的一個Python腳本收集CPU,內存,磁盤,和網絡數(shù)據流作為換行符-終止JSON / USB你DFRobot FireBeetle ESP32 - P4,解析數(shù)據,眨眼的機載領導新包,是一個黑暗的,單從頁面的AJAX儀表板,更新每五秒,包括現(xiàn)場儀表和原始JSON console-giving你真正-時間能見度,局部控制和隱私,和一個靈活的基礎添加身份驗證、Wi - Fi遙測、日志、或警報。

本文編譯自hackster.io