- Ce este AJAX?
- Cum funcționează AJAX?
- Componente necesare pentru a construi serverul web bazat pe AJAX și ESP8266
- Server web Ajax și ESP8266 - Diagrama circuitului
- Cod de server web bazat pe AJAX pentru ESP8266
În multe aplicații IoT, există situații în care datele senzorilor trebuie monitorizate continuu, iar cel mai simplu mod de a face acest lucru este activând un server web ESP8266 care servește o pagină web HTML; dar problema cu această metodologie este că browserul web trebuie să fie reîmprospătat la un anumit interval de timp pentru a obține datele senzorului actualizate. Acest lucru nu este doar ineficient, ci necesită o mulțime de cicluri de ceas în care pot fi efectuate alte sarcini. Soluția la această problemă este cunoscută sub numele de „JavaScript și XML asincron” sau AJAX pe scurt. Folosind AJAX, putem monitoriza datele în timp real fără a reîmprospăta întreaga pagină web, aceasta nu numai că economisește timp, ci și economisește cicluri de ceas prețioase. Urmăriți și în acest articol, veți învăța cum să implementați serverul web bazat pe AJAX pe ESP8266.
Ce este AJAX?
Așa cum am discutat mai devreme, AJAX înseamnă „JavaScript și XML asincron” care pot fi utilizate pentru a actualiza o porțiune a paginii web fără a reîncărca pagina implicită. Face acest lucru solicitând și primind date de la server spontan. Funcția AJAX este de a actualiza conținutul web în mod asincron. Acest lucru înseamnă că browserul web al unui utilizator nu trebuie să reîmprospăteze o pagină web întreagă atunci când doar o parte din conținutul paginii trebuie actualizat.
Un exemplu zilnic de AJAX va fi funcția de sugestie Google, pe măsură ce tastăm în bara de căutare Google, Google începe să sugereze șiruri de căutare conexe. În timpul acestui proces, pagina web nu se reîncarcă, dar informațiile care trebuie modificate sunt actualizate în fundal folosind AJAX.
Cum funcționează AJAX?
AJAX folosește doar o combinație de
- XML (limbaj extensibil de marcare)
- JavaScript și HTML
- XML (limbaj extensibil de marcare):
XML este un limbaj de marcare. XML este utilizat în principal pentru primirea datelor serverului cu un anumit format. Deși poate primi date sub formă de text simplu. Când un utilizator vizitează o pagină web și apare un eveniment, în cazul nostru, este o „apăsare pe buton”, JavaScript creează un obiect XMLHttpRequest, care apoi transferă informații într-un format XML între un browser web și un server web. Obiectul XMLHttpRequest trimite o cerere de date de pagină actualizate către serverul web, serverul procesează cererea, un răspuns este creat la partea serverului și trimis înapoi la browser, care apoi folosește JavaScript pentru a procesa răspunsul și a-l afișa pe pagina web.
- JavaScript și HTML:
JavaScript face procesul de actualizare în AJAX. Solicitarea de conținut actualizat este formatată în XML pentru ao face ușor de înțeles, iar JavaScript reîmprospătează conținutul pentru utilizatorul care vizualizează pagina actualizată.
AJAX de lucru:
Așa cum se arată în diagrama de mai sus, pentru o cerere AJAX, browserul trimite o cerere XMLHttpRequest către server folosind javascript. Acest obiect include date care indică serverului ce se solicită. Serverul răspunde doar cu datele care au fost solicitate din partea clientului. Apoi browserul primește datele, actualizează doar porțiunea paginii care trebuie actualizată în loc să reîncarce întreaga pagină web.
Componente necesare pentru a construi serverul web bazat pe AJAX și ESP8266
În timp ce construim proiectul pentru a demonstra capacitatea lui esp8266 de a gestiona AJAX, cerința privind componentele este foarte minusculă, puteți găsi majoritatea celor din magazinul dvs. local de hobby-uri.
- NodeMCU X 1
- LM35 Senzor de temperatură X 1
- LED X 1
- Breadboard X 1
- Jumpers X 4
- Cablu de programare X 1
Server web Ajax și ESP8266 - Diagrama circuitului
Diagrama circuitului pentru serverul web bazat pe AJAX este prezentată mai jos.
Deoarece circuitul este foarte simplu, nu există nimic de explicat în legătură cu acesta. Am conectat un LED cu rezistență de limitare a curentului de 150 Ohmi la pinul D0 al ESP8266, așa cum veți vedea, îl putem comuta folosind serverul web. Apoi, avem senzorul nostru de temperatură LM35, prin care vom citi valoarea temperaturii și o vom actualiza pe pagina web. Senzorul de temperatură este alimentat de pe șina de 3,3 V și, deoarece LM35 este un senzor analogic, am folosit pinul A0 al plăcii ESP8266 pentru a măsura datele. dacă ați întâlnit senzorul de temperatură LM35 pentru prima dată sau dacă doriți să aflați mai multe despre acest mic senzor foarte răcoros, puteți verifica postarea noastră anterioară pe termometru digital folosind NodeMCU și LM35 unde am discutat despre funcționarea acestui senzor în detaliu.
Cod de server web bazat pe AJAX pentru ESP8266
Înainte de a continua, să ne aruncăm direct în program pentru a înțelege cum va funcționa serverul nostru web NodeMCU. Dar, înainte de aceasta, asigurați-vă că aveți configurarea Arduino IDE pentru ESP8266, dacă nu aveți configurarea, puteți urmări partea următoare, altfel puteți sări peste această parte. Dacă sunteți interesat să aflați mai multe despre serverele web și proiectele bazate pe IoT, puteți consulta postarea noastră anterioară în care am discutat