Innholdsfortegnelse:
- Trinn 1: Innledende erklæringer
- Trinn 2: HTML -kode for Front End I.e. Innloggingsside
- Trinn 3: Bruk av WebServer.arg () og WebServer.on () -metoder
- Trinn 4: Hvis brukeren skriver feil legitimasjon
- Trinn 5: Slik legger du til bilde på nettsiden din
- Trinn 6: Hvilke komponenter vi trenger
- Trinn 7: Tilkoblinger
- Trinn 8: Test og nyt nå
- Trinn 9: Koden er her
2025 Forfatter: John Day | [email protected]. Sist endret: 2025-01-13 06:58
Her skal vi lage et veldig interessant prosjekt med Captive Portal -basert hjemmeautomatisering ved hjelp av nodeMCU fra bunnen av. Så, la oss begynne..
Trinn 1: Innledende erklæringer
Erklær IO -pinnene til nodeMCU for å utføre handling, toppfiler og kode for å lage DNS -server..vises i bildet..
Trinn 2: HTML -kode for Front End I.e. Innloggingsside
Som vist på bildet, erklær html-kode i en strengvariabel som vi sender til sluttbruker for validering av tilgangskode.
*For å fange dataene som er lagt inn av brukeren her bruker vi ankerrute og href -tag
*I utgangspunktet brukes Anchor -tag for å legge til en annen webside på nettsiden, og href -taggen definerer destinasjonen for lenken.
*Men her mottar vi dataene som er angitt av brukeren i tilgangskodefeltet gjennom ankerruten og href -taggen …
hvordan, jeg vil nevne om to metoder for å fange input fra webgrensesnitt til våre midler programmerere slutter.
Trinn 3: Bruk av WebServer.arg () og WebServer.on () -metoder
Som jeg nevner i forrige trinn, skal jeg fortelle deg to forskjellige metoder.
1) Ved å bruke webServer.arg () -metoden:
Her spesifiserer vi autofokusattributt sammen med element som vist på bildet, hva autofokus gjør er at det er en boolsk attributt når det er sant betyr presentere det sikre at input elementet blir fokusert når siden lastes.
og så kaller vi args () -metoden på serverobjektet. Denne metoden vil returnere antall spørringsparametere som ble sendt på HTTP og bruke betingede setninger for å utføre handlinger tilsvarende.
2) Ved å bruke og href -attributt:
Her spesifiserer vi kontrollelementene våre (som knapper) i og tildeler en streng, char, lenke som du vil validere ved hjelp av betingede setninger, og deretter kaller vi webServer.on () for å motta input for validering.
Som vist..
Trinn 4: Hvis brukeren skriver feil legitimasjon
Det jeg hadde gjort, bare endre den eksisterende påloggingssidekoden og legg til en ny overskrift som informerer om at brukeren hadde angitt feil legitimasjon.
Valider først legitimasjonen hvis den er feil, rett brukeren til en ny redigert påloggingsside som viser feilmelding.
Som vist..
Trinn 5: Slik legger du til bilde på nettsiden din
Det er veldig enkelt, for her lagrer vi ikke bildene våre til en fysisk lagring, slik at vi gir en bane for å hente det bildet som vi vanligvis gjør i tilfelle html -side.
så det vi gjør er ganske enkelt å konvertere bildene våre til base64 og lime det inn i sidekoden vår Som vist..
Trinn 6: Hvilke komponenter vi trenger
1)- nodeMCU
2)- Arduino IDE til å blinke nodeMCU
3) jumper ledninger (F-2-F)
4) -Relemodul
5)-En WiFi-aktivert smarttelefon eller bærbar datamaskin for å teste
Trinn 7: Tilkoblinger
Legg til relemodul til deklarerte IO -pinnene i koden.
Koble reléet til elektrisk utstyr du vil kontrollere som vist på bildet.
Trinn 8: Test og nyt nå
Trinn 9: Koden er her
Skriv dine verdifulle kommentarer..