Taula de continguts:
- Pas 1: declaracions inicials
- Pas 2: Codi HTML per a la interfície és a dir. Pàgina d'inici de sessió
- Pas 3: Ús dels mètodes WebServer.arg () i WebServer.on ()
- Pas 4: si l’usuari escriu credencials incorrectes
- Pas 5: Com afegir una imatge a la vostra pàgina web
- Pas 6: quins components necessitem
- Pas 7: connexions
- Pas 8: ara proveu i gaudiu
- Pas 9: El codi és aquí
Vídeo: Domòtica mitjançant Portal captiu: 9 passos
2024 Autora: John Day | [email protected]. Última modificació: 2024-01-30 08:13
Aquí crearem un projecte molt interessant de domòtica basada en Portal captiu que utilitza nodeMCU des de zero.. Així doncs, comencem …
Pas 1: declaracions inicials
Declareu els pins d'E / S de nodeMCU per dur a terme accions, fitxers de capçalera i codi per crear el servidor DNS … que apareixen a la imatge..
Pas 2: Codi HTML per a la interfície és a dir. Pàgina d'inici de sessió
Com es mostra a la imatge, declareu el codi html dins d’una variable de cadena que enviem a l’usuari final per validar el codi d’accés.
* Per capturar les dades introduïdes per l'usuari aquí, estem utilitzant el panell d'ancoratge i l'etiqueta href
* Bàsicament, l'etiqueta d'ancoratge s'utilitza per afegir una altra pàgina web a la pàgina web i l'etiqueta href defineix la destinació de l'enllaç.
* Però, aquí rebem les dades introduïdes per l'usuari dins del camp del codi d'accés mitjançant el panell d'ancoratge i l'etiqueta href …
Com, esmentaré sobre dos mètodes per captar l'entrada de la interfície web fins a la finalització dels nostres mitjans.
Pas 3: Ús dels mètodes WebServer.arg () i WebServer.on ()
Com, esmento en el pas anterior, us explicaré dos mètodes diferents …
1) Mitjançant el mètode webServer.arg ():
Aquí especifiquem l’atribut d’enfocament automàtic juntament amb l’element tal com es mostra a la imatge, el que fa l’enfocament automàtic és que és un atribut booleà quan és cert, significa que assegura que l’element d’entrada es concentra quan es carrega la pàgina.
i després, anomenem el mètode args () a l'objecte servidor. Aquest mètode retornarà el nombre de paràmetres de consulta que s'han passat a l'HTTP i aplicarà sentències condicionals per realitzar accions en conseqüència.
2) Mitjançant l'ús de l'atribut i href:
Aquí especifiquem els nostres elements de control (com els botons) dins i assignem una cadena, char, enllaç que voleu validar mitjançant sentències condicionals i després cridem a webServer.on () per rebre l'entrada per validar-la.
Com es mostra..
Pas 4: si l’usuari escriu credencials incorrectes
El que havia fet, simplement canvieu el codi de pàgina d'inici de sessió existent i afegiu una nova capçalera que informi que l'usuari havia introduït una credencial incorrecta.
Valideu primer la credencial si és incorrecta, dirigiu l’usuari a la nova pàgina d’inici de sessió editada que mostra un missatge d’error.
Com es mostra..
Pas 5: Com afegir una imatge a la vostra pàgina web
És molt senzill, perquè aquí no emmagatzemem les nostres imatges en un emmagatzematge físic, de manera que proporcionem un camí per obtenir la imatge que normalment fem en cas de pàgina html.
així que el que fem és simplement convertir les nostres imatges a base64 i enganxar-les al codi de la nostra pàgina.
Pas 6: quins components necessitem
1) - nodeMCU
2) - ID Arduino per fer flash a nodeMCU
3) cables de salt (F-2-F)
4) -Mòdul de retransmissió
5) -Un telèfon intel·ligent o portàtil habilitat per WiFi per provar
Pas 7: connexions
Afegiu un mòdul de relé als pins IO declarats del codi.
Connecteu el relé als equips elèctrics que vulgueu controlar, tal com es mostra a la imatge.
Pas 8: ara proveu i gaudiu
Pas 9: El codi és aquí
Escriviu els vostres valuosos comentaris..
Recomanat:
Domòtica mitjançant ESP8266 o NODEMCU: 6 passos
Domòtica mitjançant ESP8266 o NODEMCU: Mai heu volgut automatitzar la vostra llar mitjançant wifi? Voleu controlar els llums, el ventilador i tots els altres electrodomèstics des del vostre telèfon intel·ligent? O mai heu volgut obtenir informació sobre els dispositius connectats i començar-hi? Aquest projecte de domòtica serà
Assistent de Google - Domòtica Iot mitjançant Esp8266: 6 passos
Assistent de Google | Automatització domèstica: no utilitzo Esp8266: en aquest instructable us mostraré domòtica controlada per assistent de Google
ESP32 Portal captiu per configurar la configuració IP estàtica i DHCP: 8 passos
ESP32 Portal captiu per configurar els paràmetres IP estàtics i DHCP: ESP 32 és un dispositiu amb WiFi i BLE integrats. És una mena de benefici per als projectes IoT. Simplement doneu les vostres configuracions d’SSID, contrasenya i IP i integreu les coses al núvol. Però, gestionar la configuració d’IP i les credencials d’usuari pot ser un cap
Domòtica: Tauler de commutació automàtic amb control de regulació mitjançant Bluetooth mitjançant Tiva TM4C123G: 7 passos
Domòtica: placa de commutació automàtica amb control dimmer mitjançant Bluetooth mitjançant Tiva TM4C123G: Avui en dia tenim comandaments a distància per als nostres aparells de televisió i altres sistemes electrònics, que ens han facilitat la vida. Alguna vegada us heu preguntat sobre la domòtica que donaria la possibilitat de controlar llums de tubs, ventiladors i altres elements elèctrics
Arduino MusicStump: lleuger, tacte captiu i un brunzidor: 3 passos
Arduino MusicStump: llum, tacte captiu i un brunzidor: un arbre interactiu amb un anell LED a la part superior, un brunzidor per fer so i un sensor tàctil captiu que canvia el color a mesura que el toqueu. Per fer aquesta cosa divertida, necessitareu el següent: Electrònica: - 1x Arduino Uno- 15x cables- 1x així