Turinys:
2025 Autorius: John Day | [email protected]. Paskutinį kartą keistas: 2025-01-13 06:57
Mano projektas turi „Nodemcu ESP8266“, kuris valdo 7 segmentų ekraną per http serverį, naudojant html formą.
1 žingsnis: APIE ŠĮ PROJEKTĄ
Tai IOT projektas, sukurtas naudojant ESP8266 (NodeMCU) wifi modulį. Projekto motyvas - modulyje sukurti žiniatinklio serverį, kuris tinkle galėtų priimti kelis klientus. Čia, norint suprasti mano projektą, reikia pagrindinių žinių apie html ir javaScript. Kai kurios išankstinės temos, kurias čia aptarsiu dėl ESP8266 ir „JavaScript“, yra šios:
1. Įkelkite failus į ESP8266 SPIFFS, kad galėtumėte efektyviau naudoti šiuos failus mūsų arduino kode.
2. Interneto saugykla naudojant „JavaScript“
SPIFFS
Iki šiol į savo eskizą visada įtraukėme savo tinklalapių HTML kaip eilutės literalus. Dėl to mūsų kodą labai sunku skaityti, o atmintis gana greitai baigsis.
SPIFFS yra lengva failų sistema, skirta mikrovaldikliams su SPI „flash“mikroschema. ESP8266 blykstės lustas turi daug vietos jūsų tinklalapiams, ypač jei turite 1 MB, 2 MB arba 4 MB versiją. Jūs galite suprasti, kaip pridėti įrankius į savo „arduino“programinę įrangą, skirtą įkelti failus į SPIFFS, naudodami šią nuorodą:
Šiame projekte turiu 2 html failą ir „JavaScript“failą. Visi šie failai įkeliami į SPIFFS, atskirti nuo eskizo, todėl šių failų pakeitimas nepriklauso nuo pagrindinio eskizo.
Abu html failai gaunami naudojant prepaFile (), kaip parodyta žemiau:
void prepFile () {
bool gerai = SPIFFS.begin (); if (gerai) {Failas f = SPIFFS.open ("/index.html", "r"); Failas f1 = SPIFFS.open ("/index1.html", "r"); duomenys = f.readString (); duomenys1 = f1.readString (); f. uždaryti (); f1.daryti (); } else Serial.println ("Nerasta tokio failo."); }
kol „JavaScript“failas skaitomas naudojant „loadScript“(), kaip parodyta žemiau:
void loadScript (eilutės kelias, eilutės tipas) {
if (SPIFFS.egzistuoja (kelias)) {Failo failas = SPIFFS.open (kelias, „r“); server.streamFile (failas, tipas); }}
VIETINĖS PROGRAMOS SAUGOJIMAS
Galite suprasti, kaip naudoti skirtingus vietinio saugojimo objektus ir metodus HTML5, naudodami „JavaScript“iš šio straipsnio: https://diveintohtml5.info/storage.html. Darbo skyriuje aptarsiu vietinės saugyklos naudojimą savo projekte.
2 veiksmas: reikalinga aparatinė įranga
„NodeMCU ESP8266 12E Wifi“modulis
Duonos lenta be litavimo
Jumperio viela
7 Segentinis ekranas (bendras katodas)
1K omo rezistorius
„Micro-USB“kabelis (skirtas „NodeMCU“prijungti prie kompiuterio)
3 žingsnis: grandinė ir jungtys
Sujungimai tikrai lengvi. Aukščiau pateiktoje schemoje „nodemcu“kaiščiai yra prijungti taip:
A D1
B D2
C D3
D D4
E D6
F D7
G D8
kur A, B, C, D, E & F yra 7 segmentų ekrano segmentai
. Nepaisykite 7 segmentų ekrano DP. Nejunkite jo su ESP kaiščiu D5
4 žingsnis: DARBAS
Kaip minėta anksčiau, turime du html failus. Vienas iš jų yra šakninis html puslapis, iškviečiamas, kai ESP8266 serveris gavo „/“, ty jei prašoma URI „/“, serveris turėtų atsakyti įvesdamas HTTP būsenos kodą 200 (gerai) ir pasiųsdamas atsakymą su „indeksu“. html “failą.
Antrasis html failas bus išsiųstas klientui paprašius iš pagrindinio puslapio, pateikdamas įvestį formoje. Kai tik serveris gauna įvestį POSTED iš formos, jis palygina ją su fiksuota eilutės reikšme ir atsako į antrąjį html puslapį.
if (server.arg ("nam") == "0") {server.send (200, "text/html", data1); septyniSeg (0); }
Kadangi antrojo puslapio html nėra eskize apibrėžtas, čia mes nurodome „data1“, kuris jau perskaitė html kodus naudojant SPIFFS.readString ()
Failas f1 = SPIFFS.open ("/index1.html", "r"); data1 = f1.readString ();
Čia „sevenSeg“() taip pat vadinamas argumentu „0“, kad jį būtų galima naudoti rodant „0“, įjungiant ir išjungiant skirtingus segmentus. Čia aš padariau fuction pavadinimą savaime suprantamą, ty onA () įjungs A segmento 7 segmentų ekraną ant duonos lentos, panašiai išjungs A jį išjungs.
Taigi, šiuo atveju, norėdami rodyti „0“, turime perjungti visus segmentus, išskyrus G (DP ignoruojama, nes nėra prijungta prie jokio ESP8266 kaiščio). Taigi mano funkcija atrodo taip:
jei (num == 0) {onA (); onB (); onC (); onD (); onE (); onF (); offG (); }
5 veiksmas: HTML ir JAVASCRIPT KODAS
„Index.html“turi drobę su 7 segmentų ekranu išjungtu režimu ir forma po juo. Štai ką matote atidarę:
Jei norime naudoti mūsų tinklalapį be ESP8266, tai bus įmanoma pakeitus jūsų formos veiksmo atributo nuorodą. Šiuo metu tai yra nuoroda veiksme:
Čia galite pamatyti, kad veikianti nuoroda yra tas pats IP adresas, kuris priskiriamas jūsų mazgui MCU prisijungus prie bet kurio „Wi -Fi“(arba viešosios interneto prieigos taško). Formos žyma po koregavimo atrodo taip:
Čia naudoju naršyklės žiniatinklio valdiklį, kad išsaugočiau vartotojo įvesties vertę taip, kad į index.html įvesta vertė būtų išsaugota naršyklėje vietoje (pvz., Slapukas). Šią reikšmę gauna indeksas1.html, o skaičius rodomas 7 segmentų ekrane html drobėje. Šią procedūrą galite suprasti žiūrėdami vaizdo įrašą:
video_attach
6 žingsnis: PAGRINDINĖS PASTABOS
Šis projektas veiks su jūsų „nodemcu“, jei pasirūpinsite šiais punktais:
1. Šakninio html failo veiksmo atributo nuoroda turėtų būti „https:// (IP serijos monitoriuje arba IP, priskirtas jūsų ESP)/pateikti“.
2. Naudokite naujausią naršyklės versiją, kuri palaiko html5 ir naujas žymas bei funkcijas.
3. SPIFFS veiks tik tada, jei jūsų aplankas „data.html“, „index1.html“ir „main.js“bus sujungti. Galite klonuoti kodo failą iš mano „github“
7 veiksmas: KODAS
Tai yra mano projekto kodo saugyklos nuoroda. Jei dirbate su SPIFFS naudodami ESP8266, galite suprasti, kodėl aš įdėjau html ir javascript failus į duomenų aplanką. Naudokite tai taip.
„GitHub“saugyklos nuoroda
8 žingsnis: vaizdo įrašo pamoka
Jei tai padeda, užsiprenumeruokite