Internet -ohjattu merkkivalo ESP32 -pohjaisen verkkopalvelimen avulla: 10 vaihetta

2024 Kirjoittaja: John Day | [email protected]. Viimeksi muokattu: 2024-01-30 09:01

Projektin Yleiskatsaus

Tässä esimerkissä selvitämme, miten ESP32-pohjainen verkkopalvelin voidaan valvoa LED-tilaa, johon pääsee kaikkialta maailmasta. Tarvitset Mac-tietokoneen tähän projektiin, mutta voit käyttää tätä ohjelmistoa jopa halvalla ja pienitehoisella tietokoneella, kuten Raspberry Pi.

ESP32: n valmistelu Arduino IDE: n kanssa

Jotta voit aloittaa ESP32: n ohjelmoinnin Arduino IDE: n ja Arduino-ohjelmointikielen avulla, tarvitset erityisen lisäosan. Lue lisätietoja Arduino IDE: n valmistelusta ESP32: lle Mac OS -käyttöjärjestelmässä seuraavan linkin kautta.

Tarvikkeet

Tätä opetusohjelmaa varten tarvitset seuraavat kohteet:

• ESP32 kehityskortti 5 mm
• LED -vastus 220ohm
• 16x2 LCD -näyttö I2C -moduulilla
• Leipälauta
• Hyppyjohdot
• Micro -USB -kaapeli

Vaihe 1: Piirin rakentaminen

Suorita liitännät alla olevan kaavion mukaisesti

Aloita liittämällä 3V3 -syöttöjännitelähde ESP32- ja GND -leipälevyyn. Liitä LED vastuksen kautta ESP32: een käyttämällä GPIO -nasta 23 digitaalisena lähtönastana. Liitä sen jälkeen 16x2 LCD -näytön SDA -nasta GPIO -nastaan 21 ja SCL GPIO -nastaan 22.

Vaihe 2: SPIFFS -tiedostojärjestelmän nopea yleiskatsaus

SPIFFS tarkoittaa "Serial Peripheral Interface Flash File System", eli tiedostojärjestelmä flash -muistia varten, joka siirtää tietoja SPI: n kautta. Näin ollen SPIFFS on yksinkertaistettu tiedostojärjestelmä, joka on suunniteltu mikro -ohjaimille, joissa on flash -sirut, jotka lähettävät tietoja SPI -väylän kautta (kuten ESP32 -flash -muisti).

SPIFFS on hyödyllisin käytettäväksi ESP32: n kanssa seuraavissa tilanteissa:

• Tiedostojen luominen asetusten tallentamista varten
• Pysyvä tietojen tallennus.
• Tiedostojen luominen pienen datamäärän tallentamiseksi (microSD -kortin käyttämisen sijaan).
• HTML- ja CSS -tiedostojen tallentaminen verkkopalvelimen luomista varten.

Vaihe 3: SPIFFS -käynnistyslataimen asennus Mac OS -käyttöjärjestelmään

Voit luoda, tallentaa ja kirjoittaa tietoja ESP32 -tiedostojärjestelmään tallennettuihin tiedostoihin suoraan Arduino IDE -laajennuksen avulla.

Varmista ensin, että sinulla on uusin Arduino IDE -versio asennettuna, ja toimi sitten seuraavasti:

• Avaa seuraava linkki ja lataa arkisto “ESP32FS-1.0.zip”
• Siirry Arduino IDE -hakemistoon, joka sijaitsee Asiakirjat -kansiossa.
• Luo työkalukansio, jos sitä ei ole. Luo työkaluhakemiston sisälle toinen kansio ESP32FS. Luo ESP32FS: n sisälle toinen, jota kutsutaan työkaluksi.
• Pura vaiheessa 1 ladattu ZIP -arkisto työkalukansioon.
• Käynnistä Arduino IDE uudelleen.
• Jos haluat tarkistaa, onko laajennus asennettu onnistuneesti, avaa Arduino IDE ja napsauta "Työkalut" ja tarkista, onko tässä valikossa kohta "ESP32 Sketch Data Upload".

Vaihe 4: Kirjastojen asentaminen

ESPAsyncWebServer- ja AsyncTCP -kirjastojen avulla voit luoda verkkopalvelimen käyttämällä ESP32 -tiedostojärjestelmän tiedostoja. Lisätietoja näistä kirjastoista on seuraavassa linkissä.

Asenna ESPAsyncWebServer -kirjasto

• Lataa kirjaston ZIP -arkisto napsauttamalla tätä.
• Pura tämä arkisto. Sinun pitäisi saada ESPAsyncWebServer-master-kansio.
• Nimeä se uudelleen nimellä "ESPAsyncWebServer".

Asenna AsyncTCP -kirjasto

• Lataa kirjaston ZIP -arkisto napsauttamalla tätä.
• Pura tämä arkisto. Sinun pitäisi saada AsyncTCP-master-kansio.
• Nimeä se uudelleen nimellä "AsyncTCP".

Siirrä ESPAsyncWebServer- ja AsyncTCP -kansiot kirjastojen kansioon, joka sijaitsee Asiakirjat -hakemiston sisällä.

Käynnistä lopuksi Arduino IDE uudelleen.

Vaihe 5: Luo Index.html- ja Style.css -tiedosto seuraavalla sisällöllä

Vaihtopainikkeen HTML/CSS -malli otettiin seuraavasta lähteestä.

Vaihe 6: Arduino -koodi

Pääasiassa koodi perustui Arduino -koodiin, joka otettiin ESP32 -verkkopalvelimelta SPIFFS: n avulla ja Kuinka käyttää I2C LCD: tä ESP32: n kanssa Arduino IDE: ssä.

Vaihe 7: Lataa Arduino -koodi ja tiedostot SPIFFS -latausohjelmalla

• Avaa Arduino -koodin luonnoskansio.
• Luo tämän kansion sisälle uusi kansio nimeltä "data".
• Tietokansion sisälle on asetettava index.html ja style.css.
• Lataa Arduino -koodi
• Lataa sitten tiedostot napsauttamalla Arduino IDE: tä Työkalut> ESP32 Sketch Data Upload

Vaihe 8: Määritä ESP32 -verkkopalvelimen IP -osoite

Se löytyy kahdella tavalla.

• Sarjamonitori Arduino IDE: ssä (Työkalut> Sarjamonitori)
• LCD -näytössä

Vaihe 9: Paikallisen verkkopalvelimen testaaminen

Avaa seuraavaksi valitsemasi verkkoselain ja liitä seuraava IP -osoite osoiteriville. Sinun pitäisi saada samanlainen tulos kuin alla oleva kuvakaappaus.

Vaihe 10: Pääsy paikalliseen verkkopalvelimeen kaikkialta maailmasta Ngrokin avulla

Ngrok on alusta, jonka avulla voit järjestää etäkäytön verkkopalvelimelle tai jollekin muulle tietokoneellasi käynnissä olevaan palveluun ulkoisesta Internetistä. Pääsy järjestetään ngrokin alussa luodun suojatun tunnelin kautta.

• Seuraa tätä linkkiä ja rekisteröidy.
• Kun olet luonut tilin, kirjaudu sisään ja siirry "Todennus" -välilehdelle. Kopioi rivi "Tunnelisi authtoken" -kentästä.
• Napsauta navigointipalkin "Lataa" -välilehteä. Valitse käyttöjärjestelmääsi vastaava ngrok -versio ja lataa se.
• Pura ladattu kansio ja suorita komentorivi.
• Yhdistä tilisi syöttämällä seuraava komento

./ngrok authtoken

Käynnistä HTTP -tunneli portista 80

./ngrok http Oma_IP_osoite: 80

Jos kaikki on tehty oikein, tunnelin tila muuttuu "online" -tilaan ja uudelleenohjauslinkin pitäisi näkyä "edelleenlähetys" -sarakkeessa. Käyttämällä tämän linkin selaimeesi voit käyttää verkkopalvelinta mistä päin maailmaa tahansa.