2021-05-12 14:32:11
微信小程式+mqtt,esp8266溫溼度讀取的實現方法
第一、原理講解
esp8266 通過mqtt釋出訊息,微信小程式通過mqtt 訂閱訊息,小程式訂閱後,就可以實時收到esp8266 傳輸來的訊息。
第二、溫溼度測試
這裡使用的是D4口。
本demo 是利用arduino IDE開發,關於arduino IDE 的ESP8266環境設定可參考:環境設定: 點選跳轉
安裝庫
本案例使用一個非常簡單易用且與ESP8266配合使用的是Simple DHT感測器庫。可以通過Arduino IDE Library Manager輕鬆安裝該庫。
在 arduino IDE上方選項處----> 工具—>管理庫,然後直接搜尋dht11即可。點選安裝庫,如下圖:
測試程式:
#include <SimpleDHT.h> // for DHT11, // VCC: 5V or 3V // GND: GND // DATA: 2 int pinDHT11 = D4; SimpleDHT11 dht11(pinDHT11); void setup() { Serial.begin(115200); } void loop() { // start working... Serial.println("================================="); Serial.println("Sample DHT11..."); // read without samples. byte temperature = 0; byte humidity = 0; int err = SimpleDHTErrSuccess; if ((err = dht11.read(&temperature, &humidity, NULL)) != SimpleDHTErrSuccess) { Serial.print("Read DHT11 failed, err="); Serial.println(err);delay(1000); return; } Serial.print("Sample OK: "); Serial.print((int)temperature); Serial.print(" *C, "); Serial.print((int)humidity); Serial.println(" H"); // DHT11 sampling rate is 1HZ. delay(1500); }
正常工作的話,串列埠會正常輸出的,如下圖所示:
第三、溫溼度推播到雲端
如果上一步的溫溼度可以讀取輸出,那麼就可以在上版的基礎上,把資料上傳到雲端。
增加了按鈕控制,資料用#號包裹,以便app採用字串切割,分割出來資料,#23#80#on,即#溫度#溼度#按鈕狀態,小程式端會根據#號分割字串進行取值,以便顯示。
如果上傳的資料不止溫溼度,可在#號後面繼續新增&msg=#23#80#data1#data2#data3#data4#rn,app字串分割的時候,要根據上傳的資料進行分割
升級版程式下載:
點選下載 https://cloud.bemfa.com/zip/mqtt/dht11_led.zip
需要修改的地方
const char* ssid = "newhtc"; //修改,修改為你的路由的WIFI名字 const char* password = "qq123456"; //修改為你的WIFI密碼 const char* mqtt_server = "bemfa.com"; //預設,MQTT伺服器地址 const int mqtt_server_port = 9501; //預設,MQTT伺服器埠 #define ID_MQTT "4d9ec352e0376f2110a0c601a2857225" //mqtt使用者端ID,修改為你的開發者金鑰 const char* topic = "led002"; //Led主題名字,可在巴法雲控制檯自行建立,名稱隨意 const char * dhttopic = "temp004"; //溫溼度主題名字,可在巴法雲mqtt控制檯建立 int pinDHT11 = D4; //dht11感測器引腳輸入 int B_led = D5; //控制的led引腳 long timeval = 3*1000; //上傳的感測器時間間隔,預設3秒
在巴法mqtt裝置雲控制檯 新建兩個主題,主題名字隨意,例如temp004 用於傳輸溫溼度,led002用於控制led,本範例用用temp004和led002使用範例程式碼時應修改為自己的主題名字,字母或數位或字母加數位組合。UID為使用者私鑰,在 巴法創客雲控制檯 註冊登陸後可獲得。
注意:在mqtt裝置雲建立主題。
登陸完成後,可在控制檯看到自己的私鑰UID,如圖所示:
WIFI名稱為自己的路由器WIFI名稱,區分大小寫,寫錯會導致連線不上網路的。
例程中,每三秒上傳一次資料:
long now = millis();//獲取當前時間戳 if (now - lastMsg > timeval) {//如果達到3s,進行資料上傳 lastMsg = now; // read without samples. byte temperature = 0; byte humidity = 0; int err = SimpleDHTErrSuccess; if ((err = dht11.read(&temperature, &humidity, NULL)) != SimpleDHTErrSuccess) { Serial.print("Read DHT11 failed, err="); Serial.println(err); delay(1000); return; } String msg = "#" + (String)temperature + "#" + (String)humidity + "#" + ledstatus; //資料封裝#溫度#溼度#開關狀態# client.publish(dhttopic, msg.c_str());//資料上傳 }
如果路由器有網路的話,資料會自動上傳,可在巴法mqtt裝置雲 重新整理網頁,即可看到上傳的資料。如下圖所示:
資料上傳時用#號進行了封裝,27是溫度,24是溼度,off是上傳的燈的狀態。
第四、微信小程式開發
在 微信公眾平臺註冊小程式賬號,拿到小程式 appid,右側點選 -開發–> 開發管理–>開發設定---->開發者ID,裡面可以看到,長的大概是這樣:wx34a2063de5cec04b,下面匯入專案的時候會用到。
右側點選 -開發–> 開發管理–>開發設定---->伺服器域名。下方伺服器域名處,點選修改,在request合法域名處,和 socket合法域名處 ,分別新增域名https://api.bemfa.com 和wss://bemfa.com 儲存提交即可。如下圖。
下載安裝微信開發者工具,可百度下載。
下載demo範例程式。下載地址: 點選下載
開啟微信開發者工具,小程式專案,匯入專案。在目錄處選擇剛剛下載解壓的demo範例程式,AppID處填入你的小程式AppID,然後點選下方匯入即可。如下圖。
本範例程式非常簡單,各位大神可以繼續開發新增各種功能,新增背景,優化色彩等等,如果只是簡單使用,只需修改/pages/index/index.js 檔案中uid 和topic 資訊為自己的即可,這裡的uid和topic需要和esp8266填入的uid和topic相同,這裡有兩個主題,一個用於傳輸溫度和溼度,一個用於控制LED。如下圖。
data: { uid:"4d9ec352e0376f2110a0c601a2857225",//使用者金鑰,巴法雲控制檯獲取 ledtopic:"led002",//控制led的主題,mqtt控制檯建立 dhttopic:"temp004",//傳輸溫溼度的主題,控制檯建立 device_status:"離線",// 顯示led是否線上的字串,預設離線 ledOnOff:"關閉", checked: false,//led的狀態。預設led關閉 wendu:"",//溫度值,預設為空 shidu:"",//溼度值,預設為空 ledicon:"/utils/img/lightoff.png",//顯示led圖示的狀態。預設是關閉狀態圖示 client: null,//mqtt使用者端,預設為空 },
修改完畢後,ctrl+s 儲存修改。可以點選左邊螢幕上的按鈕進行偵錯,如下圖。
console控制檯可以檢視小程式的偵錯資訊。預設每3秒會自動請求一下伺服器上的資料,檢視esp8266的狀態資訊。點選開啟或者關閉按鈕,開啟esp8266串列埠偵錯助手,可檢視esp8266是否收到指令,如果第一步esp8266已聯網,都是可以收到資訊的。
如果介面和其他功能都開發完畢。可以點選微信開發者工具的上面的上傳按鈕,如下圖。
上傳成功後,再登陸剛剛註冊的微信公眾平臺,在版本管理處,可以看到自己剛剛上傳的小程式,提交稽核即可,等一天左右,一般都會通過,通過後登陸微信公眾平臺,提交發布即可。如果是自己使用的,做好加上登陸驗證功能,比如驗證匹配一下某個字串是否正確等等,不然小程式上線後別人也可以隨意控制了。
到此這篇關於微信小程式+mqtt,esp8266溫溼度讀取的文章就介紹到這了,更多相關微信小程式esp8266溫溼度讀取內容請搜尋it145.com以前的文章或繼續瀏覽下面的相關文章希望大家以後多多支援it145.com!
相關文章