ESP8266: כיצד לעקוב אחר טמפרטורה ולחות: 12 שלבים

2024 מְחַבֵּר: John Day | [email protected]. שונה לאחרונה: 2024-01-30 09:16

במדריך היום נשתמש ב- ESP-01, שהוא ה- ESP8266 בתצורה 01 (עם 2 GPIO בלבד), לקריאת טמפרטורה ולחות של חיישן DHT22. אני אראה לך סכמטי חשמל וחלק התכנות ESP עם ארדואינו. הדוגמה פשוטה, קלה להבנה, ומגיעה גם עם קובץ ה- PDF המשמש בסרטון כדי לסייע בהרכבה.

בתכנון, יש לנו אז את ESP01, המקור הממיר 110 או 220 ל -5 וולט, ווסת מתח של 3v3, ו- DHT22, שהוא החיישן. במסך הסמארטפון, תהיה לך כתובת ה- IP המקומית בנוסף לקוד ה- JavaScript המסופק על ידי ה- ESP. מסך זה יקבל אפוא את הפרמטרים של טמפרטורה ולחות וידפיס ערכים אלה, אשר יתעדכנו כל חמש שניות. לשם כך, לא תזדקק לאפליקציות בטלפונים וטאבלטים, וזה חל הן על מערכת ההפעלה אנדרואיד והן על iOS.

שלב 1: הרכבה

ערכת החשמל פשוטה למדי, כמו גם החלק על ההרכבה, אשר יכלול את ESP01 כשרת. ה- ESPO1 יתוכנת כאילו מדובר בארדואינו: באמצעות שפת C. אני מציין שחלק מהקוד מודפס מהדפדפן. המשמעות היא שהוא שולח קוד JavaScript לדפדפן. להלן אסביר טוב יותר כיצד זה עובד.

כשחזרתי לתרשים החיווט, שמתי מקור מופעל של 5 וולט המחובר לווסת מתח 3v3 כדי להפעיל את ה- ESP01. עדיין יש לנו את DHT22 עם ארבעה סיכות. אחד מאלה, נתונים, אינו בשימוש. עם זאת, זה דורש נגד למעלה.

שלב 2: קוד

השלב הראשון הוא לכלול את ה- libs בהם נשתמש. ניתן להוסיף את lib DHT על ידי אפשרות הסקיצה> כלול ספרייה> נהל ספריות …

בחלון שנפתח, חפש את ספריית חיישני DHT.

לאחר מכן יצרנו משתנה מהסוג ESP8266WebServer שיהיה השרת שלנו וייענה לבקשות HTTP (יציאה 80).

אנו יוצרים גם משתנה DHT עם פרמטרים 0 (שהוא סיכת GPIO 0) והסוג (במקרה שלנו DHT22).

#include #include #include #include // Criamos uma variavvel do tipo ESP8266WebServer que yes possui funções // que auxiliam na criação das rotas que o ESP8266 and a responder ESP8266WebServer server (80); // משתנה DHT יכול לשמש כמשתמשים בשליטה או בממשק // להיתר לתנאי טמפרטורה או DHT dht (0, DHT22);

שלב 3: התקנה

בהתקנה, נאתחל את הסידרה רק כך שיהיה לנו יומן. זה יקרה אם ה- ESP8266 מחובר למחשב באמצעות הסידורי כדי להשתמש בצג הטורי.

אנו גורמים ל- ESP8266 להתחבר לרשת שלנו. במקרה שלנו, אנו משתמשים ברשת TesteESP עם הסיסמה 87654321, אך יהיה עליך לשנות זאת בהתאם לרשת שבה אתה משתמש.

// הפעל רשמי apenas caso esteja com ב- ESP8266 conectado ao computador pela serla queira ter um log // para facilitar saber o que está acontecendo com o ESP8266 Serial.begin (115200); // Instrução para o ESP8266 se conectar à rede. // No nosso caso o nome da rede é TesteESP e a senha é 87654321. // Você deve alterar com as informações da sua rede WiFi.begin ("TesteESP", "87654321"); // משוב caso esteja usando o Monitor Serial Serial.println (""); Serial.print ("Conectando");

אנו ממתינים עד ש- ESP8266 יתחבר לרשת, ולאחר שהוא מתחבר, אנו שולחים את הגדרות הרשת. שנה בהתאם לרשת שלך.

// Esperamos até que o módulo se conecte à rede while (WiFi.status ()! = WL_CONNECTED) {delay (500); Serial.print ("."); } // תצורות לתיקון IP. Você pode alterar conforme a sua rede IPAddress ip (192, 168, 3, 11); שער IPAddress (192, 168, 3, 1); רשת המשנה IPAddress (255, 255, 255, 0); Serial.print ("תצורת IP תצורת IP:"); Serial.println (ip); // Envia a configação WiFi.config (ip, gateway, subnet);

הפקודות הבאות הן רק במקרה שיש לך ESP8266 מחובר למחשב באמצעות הסידרה, כך שיש לך משוב מהצג הטריאלי.

אתה יכול לבדוק את ה- IP שקיבל ה- ESP8266 כדי לראות אם הוא זהה להגדרות.

// Mostramos no Monitor Serial o ip com o qual o esp8266 se conectou para ver se está de acordo com o que configuramos Serial.println (""); Serial.println ("Connectado"); Serial.print ("IP:"); Serial.println (WiFi.localIP ());

כאן, אנו מתחילים להגדיר אילו פונקציות יבוצעו עבור כל בקשה.

בהוראות להלן, בכל פעם ש- ESP8266 יקבל בקשת HTTP מסוג GET בנתיב / הטמפרטורה, הפונקציה getTemperature תתבצע.

// Aqui definimos qual a função será executada para o caminho e tipo dado. // Nesse caso quando houver uma requisição http do tipo GET no caminho https://192.168.2.8/temperature // (pode ser outro ip dependendo da sua configuração) functão getTemperature será executada server.on ("/temperature", HTTP_GET, getTemperature);

בהצהרה אחרת זו, בכל פעם ש- ESP8266 מקבל בקשת HTTP מסוג GET בנתיב / לחות, הפונקציה getHumidity תבוצע.

// Nesse outo caso quando houver uma requisição http do tipo GET no caminho https://192.168.2.8/humidity // ((pode ser outro ip dependendo da sua configuração) a função getHumidity será executada server.on ("/לחות", HTTP_GET, getHumidity);

בהוראה זו, בכל פעם ש- ESP8266 יקבל בקשת HTTP מסוג GET בנתיב / צג, הפונקציה showMonitor תבוצע.

הפונקציה showMonitor אחראית להחזרת ה- HTML הראשי שיציג את ערכי הטמפרטורה והלחות.

// Nesse caso quando houver uma requisição http do tipo GET no caminho https://192.168.2.8/monitor // (pode ser outro ip dependendo da sua configuração) מופע כיף Monitor Monitor será executada. // Esta função retornará a página principal que mostrará os valores // da temperatura e da umidade e recarregará essas informações de tempos em tempos server.on ("/monitor", HTTP_GET, showMonitor);

להלן הגדרת הפונקציה שיש לבצע כאשר הנתיב המבוקש אינו נמצא.

// Aqui definimos qual função será executada caso o caminho que o cliente requisitou não tenha sido registrado server.onNotFound (onNotFound);

כאן אנו מאתחלים את השרת שהכרזנו בעבר ביציאה 80.

זהו סוף ההתקנה.

// רשמי שרת או כתובת שרת בגרסה 80 server.begin (); Serial.println ("Servidor HTTP iniciado"); }

שלב 4: לולאה

הודות ל- lib ESP8266WebServer, איננו צריכים לבדוק בלולאה אם יש לקוחות ולמה נתיב הבקשה. אנחנו רק צריכים להתקשר handleClient (), והאובייקט יבדוק אם כל לקוח מבקש בקשות ויפנה לפונקציה המתאימה שרשמנו לפני כן.

לולאת void () {// Verifica se há alguma requisição de algum cliente server.handleClient (); }

שלב 5: הבקשה לא נמצאה

זוהי הפונקציה שנרשמנו בעבר לביצוע כאשר הלקוח מבקש בקשות שלא נרשמו.

הפונקציה מחזירה רק את קוד 404 (קוד ברירת המחדל כאשר משאב אינו נמצא), סוג הנתונים שהוחזר (במקרה של טקסט רגיל) וטקסט עם המילים "לא נמצא".

// Função que definimos para ser chamada quando o caminho requisitado não foi registrado void onNotFound () {server.send (404, "text/plain", "Not Found"); }

שלב 6: החזרת הטמפרטורה

זוהי הפונקציה שתחזיר json עם נתוני הטמפרטורה כאשר הלקוח יגיש בקשת GET ב / טמפרטורה.

// Função que definimos que será executada quando o cliente fizer uma requisição // do tipo GET no caminho https://192.168.2.8/temperature (pode ser outro ip dependendo da sua configuração) void getTemperature () {// Fazemos a leitura da temperatura através do módulo dht float t = dht.readTemperature (); // Cria um json com os dados da temperatura מחרוזת json = "{" טמפרטורה / ":"+מחרוזת (t)+"}"; // Envia o json para o cliente com o código 200, que é o código quando a requisição foi realizada com sucesso server.send (200, "application/json", json); }

שלב 7: החזרת לחות

זוהי הפונקציה שתחזיר json עם נתוני הלחות כאשר הלקוח יגיש בקשת GET in / לחות.

// Função que definimos que será executada quando o cliente fizer uma requisição // do tipo GET no caminho https://192.168.2.8/humidity (pode ser outro ip dependendo da sua configuração) void getHumidity () {// Fazemos a leitura da umidade através do módulo dht float h = dht.readHumidity (); // Cria um json com os dados da umidade String json = "{" לחות / ":"+מחרוזת (ח)+"}"; // Envia o json para o cliente com o código 200, que é o código quando a requisição foi realizada com sucesso server.send (200, "application/json", json); }

שלב 8: HTML

זוהי הפונקציה שתחזיר את ה- html כאשר הלקוח ניגש לגישה / צג. דף זה יציג את ערכי הטמפרטורה והלחות, ויטען את הנתונים מעת לעת. החלק שהוא בין ו לבין סגנון>

מגדיר את מראה הדף, ותוכל לשנות אותו כרצונך.

// Função que definimos que será executada quando o cliente fizer uma requisição // do tipo GET no caminho https://192.168.2.8/monitor (pode ser outro ip dependendo da sua configuração) void showMonitor () {String html = "" "" ""

"צג DHT"

"גוּף{"

"ריפוד: 35 פיקסלים;"

"צבע-רקע: #222222;" "}"

שלב 9: המשך סגנון HTML

"h1 {" "color: #FFFFFF;" "font-family: sans-serif;" "}" "p {" "color: #EEEEEE;" "font-family: sans-serif;" "גודל גופן: 18 פיקסלים;" "}" ""

כאן יש לנו את החלק העיקרי של html. יש לנו שתי פסקאות שיציגו את הטמפרטורה והלחות. שימו לב לזהות הפסקאות, מכיוון שדרכן נשחזר את הפסקאות הללו כדי להזין את ערכי הטמפרטורה והלחות לאחר הדרישות.

צג DHT

טֶמפֶּרָטוּרָה:

לחות:

שלב 10: JavaScript

כאן אנו מתחילים להגדיר את התסריט שיקרא מדי פעם את ערכי הטמפרטורה והלחות. הפונקציה refresh () קוראת לפונקציות refreshTemperature () ו- refreshHumdity (), ו- setInterval קוראת לפונקציית הרענון כל 5000 אלפיות השנייה (5 שניות).

"לְרַעֲנֵן();" "setInterval (רענון, 5000);" "function refresh ()" "{" "refreshTemperature ()" "refreshHumidity ();" "}"

הפונקציה refreshTemperature () מגישה בקשה ב- / temperature, מנתחת את המידע הכלול ב- json ומוסיפה לפסקה את טמפרטורת ה- id.

"function refreshTemperature ()" "{" "var xmlhttp = XMLHttpRequest חדש ();" "xmlhttp.onreadystatechange = function () {" "if (xmlhttp.readyState == XMLHttpRequest. DONE && xmlhttp.status == 200) {" "document.getElementById ('temperature'). innerHTML = 'Temperature:' + JSON. parse (xmlhttp.responseText).temperature + 'C'; " "}" "};" "xmlhttp.open ('GET', 'https://192.168.2.8/temperature', true);" "xmlhttp.send ();" "}"

הפונקציה refreshHumidity () מבקשת בקשה / לחות, מנתחת את המידע הכלול ב- json ומוסיפה לפסקה את הלחות id. ועם זה, אנו מסיימים את ה- html שנשלח בבקשות ב / צג.

"function refreshHumidity ()" "{" "var xmlhttp = XMLHttpRequest חדש ();" "xmlhttp.onreadystatechange = function () {" "if (xmlhttp.readyState == XMLHttpRequest. DONE && xmlhttp.status == 200) {" "document.getElementById ('לחות'). innerHTML = 'לחות:' + JSON. parse (xmlhttp.responseText). לחות + '%'; " "}" "};" "xmlhttp.open ('GET', 'https://192.168.2.8/humidity', נכון);" "xmlhttp.send ();" "}"

"";

שלב 11: סיום ShowMonitor

כעת, כשהמחרוזת עם ה- html שנשלח מוכנה, נוכל לשלוח אותה ללקוח. פעולה זו משלימה את הפונקציה showMonitor ואת הקוד.

// Envia o html para o cliente com o código 200, que é o código quando a requisição foi realizada com sucesso server.send (200, "text/html", html); }

שלב 12: בדיקה

כעת פתח את הדפדפן והזן את https://192.168.2.8/monitor (ייתכן שתזדקק ל- IP שונה בהתאם לתצורה שלך).