Innehållsförteckning:
- Steg 1: Inledande deklarationer
- Steg 2: HTML -kod för Front End I.e. Login sida
- Steg 3: Användning av WebServer.arg () och WebServer.on () -metoder
- Steg 4: Om användaren skriver fel autentiseringsuppgifter
- Steg 5: Lägga till bild på din webbsida
- Steg 6: Vilka komponenter behöver vi.
- Steg 7: Anslutningar.
- Steg 8: Testa nu och njut.
- Steg 9: Koden är här
Video: Hemmautomation med Captive Portal: 9 steg
2024 Författare: John Day | [email protected]. Senast ändrad: 2024-01-30 12:44
Här kommer vi att skapa ett mycket intressant projekt med Captive Portal -baserad hemautomation med hjälp av nodeMCU från början.. Så, låt oss börja..
Steg 1: Inledande deklarationer
Deklarera IO -stiften på nodeMCU för att utföra åtgärd, rubrikfiler och kod för att skapa DNS -server..visas i bilden..
Steg 2: HTML -kod för Front End I.e. Login sida
Som visas på bilden, deklarera html-kod inom en strängvariabel som vi skickar till slutanvändare för validering av åtkomstkod.
*För att fånga de data som användaren har angett här använder vi ankarfönster och href -tagg
*I princip används Anchor -taggen för att lägga till en annan webbsida på webbsidan och href -taggen definierar destinationen för länken.
*Men här tar vi emot data som användaren matat in i fältet Kod via Anchor Pane och href tag …
hur, jag kommer att nämna om två metoder för att fånga inmatningen från webbgränssnittet till våra medel programmerare slut..
Steg 3: Användning av WebServer.arg () och WebServer.on () -metoder
Som jag nämner i föregående steg ska jag berätta två olika metoder..
1) Genom att använda metoden webServer.arg ():
Här anger vi autofokusattributet tillsammans med elementet som visas på bilden, vad autofokus gör är att det är ett booleskt attribut när det är sant innebär att det är försäkrat att inmatningselementet blir fokuserat när sidan laddas.
och sedan kallar vi args () -metoden på serverobjektet. Denna metod returnerar antalet frågeparametrar som skickades på HTTP och tillämpar villkorliga uttalanden för att utföra åtgärder i enlighet därmed.
2) Genom att använda och href -attribut:
Här specificerar vi våra kontrollelement (som knappar) inom och tilldelar en sträng, char, länk som du vill validera med villkorliga uttalanden och sedan kallar vi webServer.on () för att få input för validering.
Som visat..
Steg 4: Om användaren skriver fel autentiseringsuppgifter
Vad jag hade gjort, ändra helt enkelt den existerande inloggningssidkoden och lägg till en ny rubrik som informerar om att användaren har angett fel autentiseringsuppgifter.
Verifiera först inloggningsuppgifterna om det är fel, rikta användaren till en ny redigerad inloggningssida som visar felmeddelande.
Som visat..
Steg 5: Lägga till bild på din webbsida
Det är väldigt enkelt, för här lagrar vi inte våra bilder till en fysisk lagring så att vi tillhandahåller en sökväg för att hämta den bilden som vi vanligtvis gör vid html -sida.
så det vi gör är att helt enkelt konvertera våra bilder till base64 och klistra in det i vår sidkod Som visas..
Steg 6: Vilka komponenter behöver vi.
1)- nodMCU
2)- Arduino IDE för att blinka nodMCU
3) jumper trådar (F-2-F)
4) -Relämodul
5) -En WiFi-aktiverad smartphone eller bärbar dator för att testa
Steg 7: Anslutningar.
Lägg till relämodul till deklarerade IO -stift i kod.
Anslut Relä till elektrisk utrustning som du vill styra enligt bilden..
Steg 8: Testa nu och njut.
Steg 9: Koden är här
Skriv gärna dina värdefulla kommentarer..
Rekommenderad:
Hemmautomation WiFi-ljusströmbrytare med ESP-01 och relämodul med tryckknapp: 7 steg
Hemmautomation WiFi-ljusbrytare med ESP-01 och relämodul med tryckknapp: Så i de tidigare instruktionerna programmerade vi en ESP-01 med Tasmota med en ESP-blinkare och kopplade ESP-01 till våra wifi-nätverk. Nu kan vi börja programmera den för att slå på/stänga av en strömbrytare med WiFi eller tryckknappen
Hemmautomation med Raspberry Pi med hjälp av reläkort: 7 steg
Hemmautomation med Raspberry Pi med hjälp av reläkort: Ett stort antal människor vill ha stor komfort men till rimliga priser. Vi känner oss lata för att lysa upp husen varje kväll när solen går ner och nästa morgon, släcka lamporna igen Eller för att slå på/av luftkonditioneringen/fläkten/värmare
Hemmautomation med ESP8266 WiFi utan att använda Blynk !: 24 steg (med bilder)
Hemmautomation med ESP8266 WiFi utan att använda Blynk !: För det första vill jag tacka alla för att jag blev en vinnare i Automation Contest 2016 för denna INSTRUKTABELA. Så, som jag lovade dig, här är instruktionerna för att styra hushållsapparater med ESP8266 WiFi -modul
Hemmautomation Steg för steg Användning av Wemos D1 Mini med PCB -design: 4 steg
Hemmautomation Steg för steg Användning av Wemos D1 Mini Med PCB -design: Hemautomation Steg för steg med Wemos D1 Mini med PCB -design För några veckor sedan publicerade vi en självstudie “Hemmautomation med hallon Pi” på rootsaid.com som blev väl mottagen bland hobbyister och College studenter. Sedan kom en av våra medlemmar
ESP32 Captive Portal för att konfigurera statiska och DHCP IP -inställningar: 8 steg
ESP32 Captive Portal för att konfigurera statiska och DHCP IP -inställningar: ESP 32 är en enhet med integrerad WiFi och BLE. Det är en välsignelse för IoT -projekten. Ge bara dina SSID, lösenord och IP -konfigurationer och integrera sakerna i molnet. Men att hantera IP -inställningarna och användaruppgifterna kan vara ett huvud