Encender y apagar un LED en el ESP8266 con un formulario Web Deja un comentario

Continuamos con las entradas del ESP8266 viendo cómo encender un LED a través de un formulario Web en una página Web servida desde el ESP8266.

En la entrada anterior ya vimos cómo recibir información con el ESP8266 actuando como servidor a través de un formulario Web. Ya adelantamos que existen diversas formas de comunicar una web con el ESP8266 actuando como el servidor. Los formularios Web son una de las más sencillas pero (ni mucho menos) la mejor.

Sin embargo, estos ejemplos sencillos nos preparan para los tutoriales más avanzados que veremos más adelante, y nos permiten introducir conceptos poco a poco. Entre ellos, un ejemplo sencillo y muy típico es encender un LED a través de una sencilla página web.

El código para el programa principal queda igual que en el ejemplo anterior, solo que hemos definido el pin asociado al led integrado en la placa como salida.

Por su parte, el fichero ‘server.hpp’ queda de la siguiente forma.

Donde vemos que hemos definido un Endpoint para ‘/LED’ bajo el método post, que llama a la función ‘handleFormLed(…)’.

En esta función obtenemos el parámetro ‘status’, y encendemos o apagamos el LED integrado en la placa en función del valor recibido.

Finalmente, el contenido de ‘index.html’ que tenemos en la carpeta ‘data’ y subiremos al SPIFFS es el siguiente

Donde únicamente hemos añadido dos radio button asociados al valor ‘ON’ y ‘OFF’

Si cargamos esto en el ESP8266 veremos nuestra (aún feísima) página web, con los dos radio button y el botón de ‘Send’ que envía el formulario.

Si cambiamos la selección y pulsamos el botón de envío, comprobamos que recibimos los datos correctamente por el puerto serie y que, efectivamente, se enciende y se apaga el LED integrado en la placa.

¡Así de fácil! Un sencillo ejemplo que muestra cómo procesar la información recibida por el ESP8266 para ejecutar acciones en el backend.

Por supuesto, podríamos hacer cualquier otra acción, cambiar una salida, tomar una medición, actuar en un motor, o cualquier otra función. ¡Lo que necesitéis!

En la siguiente entrada veremos otro ejemplo típico, encender un LED PWM, para lo cuál añadiremos un poquito de JavaScript en la página Web servida. ¡Hasta pronto!

Descarga el código

Todo el código de esta entrada está disponible para su descarga en GitHub.


Descubre más desde Electrogeek

Suscríbete y recibe las últimas entradas en tu correo electrónico.

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

Este sitio usa Akismet para reducir el spam. Aprende cómo se procesan los datos de tus comentarios.

Enviar Whatsapp
Hola 👋
¿En qué podemos ayudarte?