Kituo cha hali ya hewa cha ESP8266 kinachoonyesha data kwenye wavuti: Hatua 7

2024 Mwandishi: John Day | [email protected]. Mwisho uliobadilishwa: 2024-01-30 12:52

Kumbuka: Sehemu za mafunzo haya zinaweza kupatikana katika muundo wa video kwenye Kituo changu cha YouTube - Kabila la Tech

Katika hii inayoweza kufundishwa, nitaonyesha jinsi ya kutengeneza kituo cha hali ya hewa ambacho hutuma data moja kwa moja kwenye wavuti yako. Kwa hivyo, utahitaji kikoa chako mwenyewe (Ex: msolonko.net). Kuanza, hapa kuna vifaa utakavyohitaji:

Vitu:

Manyoya Huzzah ($ 16.95)

Cable ndogo ya USB na Takwimu ($ 1.99)

Ufungashaji wa Batri ($ 25): Baadaye nitajadili ni uwezo gani unahitaji kwa muda gani bila kuchaji tena, ili uweze kuchagua uwezo unaotaka. Hiki ni kiunga cha ile niliyotumia. Unaweza pia kuipatia nguvu kutoka kwa duka.

Mpiga picha 1

Vipinga vingine vingine - vilijadiliwa baadaye

Waya

Bodi ya Perf ($ 5.59) - Pakiti ya 20

Joto la BME280, Shinikizo, na Sura ya Unyevu ($ 9.99)

Aina fulani ya sanduku; unaweza kuchapisha 3D moja, na nitakuonyesha muundo wangu.

Webhosting na uwanja, ikiwa unataka kufuata kabisa na mafunzo

Zana:

Mkata waya

Chuma cha kulehemu

Hatua ya 1: Nambari ya Manyoya ya Huzzah

Nambari hiyo itaandikwa katika Arduino IDE, ambayo inaweza kupakuliwa hapa. Kabla ya kuanza, tafadhali fuata maagizo hapa ili usanidi IDE ya Arduino ili ufanye kazi na Manyoya yako Huzzah. Pia, fuata maagizo haya kupakua maktaba zinazohitajika ili kufanya sensorer ya BME ifanye kazi. Faili ya nambari imeambatanishwa, na nambari yote imetolewa maoni ili uweze kuielewa. Mara tu ukiiangalia, nenda kwenye hatua inayofuata ambapo tutaangalia nambari inayopokea data ya sensorer.

Hatua ya 2: Kupokea Takwimu Kutoka kwa Manyoya Huzzah

Kufikia sasa, unatarajia kuelewa jinsi nambari ya Arduino inavyofanya kazi. Ikiwa sivyo, rudi kwa nambari na usome maoni yangu (nilitoa maoni karibu kila mstari). Sasa tutaandika nambari inayopokea data. Kama hapo awali, yote hayo yametolewa maoni. Lugha ya programu ambayo hutumiwa kwa hii ni PHP, ambayo unaweza kusoma zaidi kuhusu hapa.

Takwimu zetu zitahifadhiwa kwenye Hifadhidata ya MySQL, ambayo unaweza kusoma zaidi hapa. Takwimu zinahifadhiwa kwenye meza ambazo zina safu na safu. Kabla ya kuandika nambari, tunapaswa kutengeneza muundo wa meza yetu kwenye cPanel yetu ya kukaribisha. Ninatumia Hosting ya Arvixe, kwa hivyo cPanel yako inaweza kuonekana tofauti. Rejelea moja ya picha ili uone sehemu yangu inavyoonekana. Kwanza, unataka kuunda hifadhidata mpya ya MySQL ikiwa huna tayari. Unaweza kutumia mchawi kwa hiyo. Kuna rasilimali nyingi mkondoni juu ya hii ikiwa unahitaji msaada.

Mara baada ya kuweka hifadhidata, nenda kwa phpMyAdmin na uchague hifadhidata yako. Unda meza inayoitwa hali ya hewa_data na safu 9. Wasiliana na moja ya picha zangu hapo juu ili uone ni nini kila safu inapaswa kuwa (nakili jina, hifadhidata, na kila kitu haswa ikiwa unataka kutumia nambari yangu). Counter itakuwa ufunguo wetu wa msingi na id itatusaidia kutambua ni siku gani data inayohusu inafanya (1: leo, 2: jana, 3: kila kitu kingine). Kwa kuwa tutakuwa na data nyingi, tutakuwa tukifuta zingine kadri inavyozidi kuwa ya zamani. Ndio sababu tunahitaji safu ya kitambulisho. Nguzo zilizobaki zinajielezea vizuri. Hivi sasa, meza yako kwenye hifadhidata yako inapaswa kuonekana kama yangu.

Sasa, pakua nambari iliyoambatanishwa na uisome na maoni yangu. Ukimaliza, nenda kwenye hatua inayofuata.

Kumbuka: unapopakua nambari, ibadilishe jina kuwa esp.php. Kwa sababu fulani, nilipata hitilafu wakati nilijaribu kupakia faili ya PHP.

Hivi ndivyo kanuni itafanya kazi.

1. Kusanya data kila dakika 10 na uionyeshe

2. Mara baada ya siku kupita, wastani kila maadili 6 (kuhifadhi nafasi ya DB) ili kuwe na uhakika wa data kwa kila saa

3. Mara baada ya siku nyingine kupita, wastani wa data zote zilizobaki za siku hiyo na uihifadhi kama nukta moja tu ya data

Kwa njia hii, tutaweza kuona kushuka kwa hali ya mwanga, joto n.k kwa muda wa miezi bila kuanza kuvurugwa na kushuka kwa thamani kwa kila siku kwa joto, mwangaza, nk.

Hatua ya 3: Kupata data kutoka kwenye Hifadhidata ili Kuonyesha

Kwa hivyo sasa tumegundua jinsi ya kukusanya data ya hali ya hewa na kuipakia kwenye hifadhidata yetu. Sasa lazima tuweze kuipata tena kwa njia inayoweza kutumika. Kama hapo awali, niliambatanisha faili ya PHP getWeatherData.txt ambayo unapaswa kuhifadhi kwa mwenyeji wako na ubadilishe ugani wa jina la faili kuwa.php badala ya.txt. Nambari yote ya maoni imetolewa maoni. Soma ili uielewe na uendelee mara moja unapofikiria umepata. Ikiwa una maswali, jisikie huru kuuliza hapa chini.

Hatua ya 4: Kuweka Maktaba na Vitu vingine

Kwa mradi huu, moja ya mifumo ambayo tutatumia ni AngularJS, ambayo itatusaidia kuwasiliana na hifadhidata na kujenga SPA (Matumizi ya Ukurasa Moja). Ili kupata maktaba, nenda kwenye kiunga hiki na pakua toleo 1.64 au zaidi. Kwa mafunzo haya, nilitumia 1.64 lakini matoleo mapya mara nyingi hutolewa ili uweze kutumia tofauti. Pata kiunga kwenye ukurasa huo ambao unamalizika kama hii: /VERSION/angular.min.js

Nakili kiunga na uihifadhi mahali salama. Tumepata kiunga cha maktaba ya AngularJS. Utahitaji kwa hatua inayofuata. Sasa, kwenye ukurasa huo huo pata kiunga kinachofanana na hiki na unakili pia: /VERSION/angular-route.min.js

Njia ya angular itatusaidia kudhibiti SPA yetu na kushughulikia ubadilishaji wa maoni kwenye ukurasa.

Tunataka kuweza kuonyesha chati nzuri za data zetu. Kwa hili tutatumia maktaba inayoitwa ChartJS. Nenda hapa, chagua toleo la hivi karibuni na uhifadhi kiunga kinachoisha kama hii: VERSION / Chati.bundle.min.js

Mwishowe, tutatumia maktaba kupanga kurasa zinazoitwa Bootstrap. Nenda kwenye kiunga hiki kwa Anza Haraka na uacha hii wazi kwa sasa. Mara tu tutakapoanza kuandika nambari ya mteja, utaweza kubadilisha viungo vyangu vya zamani na toleo jipya zaidi.

Sasa, tunapaswa kuanzisha maoni tofauti kwa programu yetu. Katika saraka kwenye mwenyeji wako ambapo una faili mbili zilizopita (esp.php na getWeatherData.php), tengeneza folda mpya inayoitwa weather_views. Hapa, tutaweka kurasa zetu zote ambazo zitaambatana na kitambulisho kutoka hifadhidata yetu (1, 2, au 3).

Kwenye folda, jenga faili 3 (day.html, old.html, na yesterday.html). Pakua nambari iliyoambatanishwa na uweke kwenye faili hizo. Nambari ya DAY. HTML imetolewa maoni ili uweze kuelewa kinachotokea. Nambari ya kurasa zingine 2 kimsingi ni sawa (sehemu tofauti katika old.html imetolewa maoni).

Ukimaliza na hatua hii, nenda kwa inayofuata, ambayo ni hatua ngumu zaidi ya programu.

Hatua ya 5: Faili kuu ya HTML

Katika hatua hii, utafanya / kuhariri / kusoma faili kuu ya HTML ambapo utaonyesha kila kitu. Hifadhi faili iliyoambatishwa (ambayo, kama kawaida, inasemwa) kama espdata.html katika saraka sawa na esp.php. Natumahi unaweza kuibadilisha na kuelewa kinachoendelea.

Hii ndio idadi kubwa ya nambari yako, kwa hivyo ni muhimu kuelewa kinachoendelea.

Hatua ya 6: Mtihani wa Wiring kwenye ubao wa mkate

Sasa tutajaribu kuwa nambari yote inafanya kazi na vifaa vyetu. Ikiwa haujafanya hivyo, pini za kichwa cha solder kwenye Manyoya Huzzah na sensorer ya BME280. Kwa kila hatua, picha imeambatanishwa.

1. Weka manyoya kwenye ubao wa mkate. Unganisha 3V kwa reli + na GND kwa - reli.

2. Unganisha VIN ya sensorer kwa + reli na GND kwa - reli.

3. Unganisha sensa SDA kubandika 4 kwenye manyoya. Unganisha SCL kubandika 5.

4. Weka muuzaji wa picha kwenye ubao wa mkate na risasi moja iende kwenye reli.

5. Unganisha kontena la 4.7k kwa risasi isiyounganishwa ya mpinga picha. Unganisha mwongozo usiounganishwa wa 4.7k kwa kontena la 2k. Unganisha mwisho usiounganishwa wa kipingaji cha 2k kwa - reli (GND).

6. Unganisha pamoja ya kontena la 4.7k na 2k ili kubandika ADC (pini ya analogi). Tulifanya tu mgawanyiko wa voltage ambayo hugawanya kiwango cha juu cha voltage iliyosomwa na pini kutoka 3.3V hadi chini ya 1V. Unaweza kucheza karibu na mchanganyiko wako mwenyewe ikiwa unataka lakini kumbuka kuwa voltage iliyopewa pini ya analog lazima iwe chini ya 1V.

7. Mwishowe, unganisha pini ya RST (kuweka upya) kwenye manyoya ili kubandika 16 kwenye manyoya (waya wa machungwa kwenye picha). Usanidi huu unaruhusu Manyoya Huzzah kuingia katika hali ya usingizi mzito kuokoa nguvu.

Sasa umemaliza! Pakia nambari kwenye manyoya yako huzzah, na kwa matumaini, unaweza kuona sasisho la ukurasa wako wa wavuti (ukurasa wa day.html tu). Ikiwa sio hivyo, jaribu kutumia mfuatiliaji wa serial kusuluhisha au kuuliza kwenye maoni hapa chini.

Hatua ya 7: Mradi wa Kudumu (Hiari)

Kwa kudhani kila kitu kinafanya kazi, ikiwa unataka, unaweza kufanya mradi huu kuwa wa kudumu zaidi. Sitakuwa nikionyesha hii hapa, lakini unaweza kuziunganisha vifaa vyote kwenye ubao wa manukato na kisha kuzifunga kwenye chombo. Nitaambatanisha faili za IPT kwa kontena la 3D ambalo nilitumia hapo chini na picha chache ili uanze. Chombo hicho kimekusudiwa msukumo kwa sababu labda utataka kuifanya iwe ya kibinafsi zaidi na muundo na maandishi tofauti. Furahiya na usanifu! Bahati njema!