En este artículo te voy a mostrar cómo encender y apagar un LED a través de Wifi usando la tarjeta NodeMCU ESP8266. Lo que haremos será:

  • Dentro de la tarjeta crear un servidor web
  • Mostrar una página HTML con una interfaz para encender y apagar un LED
  • Dependiendo de la opción seleccionada el LED se va a apagar o encender

En resumen vamos a controlar un LED usando solo WiFi desde una computadora o teléfono móvil con un navegador web.

Lecturas recomendadas

Mira cómo hacer el Hola mundo con el ESP8266. De hecho en este tutorial vamos a combinar dos anteriores:

Voy a continuar con el post asumiendo que has entendido cómo funciona de manera básica el servidor web y la conexión del LED.

Circuito

Como el módulo WiFi ya viene integrado a la tarjeta solo tenemos que conectar el LED con una resistencia. Tomaré el circuito de mi post anterior:

LED con NodeMCU ESP8266_bb

LED con NodeMCU ESP8266

Eso es todo lo que necesitamos conectar.

Función que dibuja la interfaz HTML

Comenzamos viendo la función que enviará el HTML al cliente. Dependiendo del estado del led (encendido o apagado) vamos a mostrar un enlace para apagarlo o encenderlo.

Si queremos apagarlo vamos a ir al enlace /apagar y si queremos encenderlo vamos a ir al enlace /encender:

Estamos pre procesando el HTML y mostrando un enlace u otro dependiendo de la ruta.

Relacionado:  Filtros en Vue.js: tutorial con ejemplos

Manejando rutas

Anteriormente definimos los enlaces que llevarán a una ruta dentro de la red del ESP8266, ahora vamos a definir el manejador de cada ruta:

Todos envían la respuesta HTML que devuelve la función vista anteriormente. En este punto tenemos una bandera que define el estado del LED.

La función rutaEncenderLed enciende el LED y cambia el estado de la variable; después devuelve el HTML dependiendo del estado. De igual modo la función rutaApagarLed apaga el LED y cambia el estado.

También definimos la ruta raíz que por defecto no realiza ninguna acción pero debe mostrar el HTML.

El método loop y setup

Finalmente veamos cómo configurar el AP, además del web server para que dependiendo de la ruta llame a determinada función.

Dentro del loop atendemos la petición del cliente.

Poniendo todo junto

El código completo queda como se ve a continuación:

Es momento de enviarlo a la tarjeta y probar.

Probando servidor web

Al conectar al servidor web se muestra el estado del LED y el enlace para encenderlo. Si selecciono apagar, el LED se apaga y muestra lo siguiente:

LED apagado - Opción para encender con WiFi

LED apagado – Opción para encender con WiFi

Si yo hago click en encender el LED será obviamente encendido y el estado cambiará a:

NodeMCU ESP8266 - Servidor web para apagar LED

NodeMCU ESP8266 – Servidor web para apagar LED

Así podemos probar de manera infinita, conectándonos desde cualquier cliente.

Con esto se abren varias posibilidades, entre ellas las de conectar un relevador en lugar de un LED para controlar diferentes corrientes, o mostrar valores de sensores.

Si el post fue de tu agrado muestra tu apoyo compartiéndolo, suscribiéndote al blog, siguiéndome o realizando una donación.

Relacionado:  Crear proyecto de Buefy (Bulma CSS + Vue) usando la CLI de Vue

Suscribir por correo

Ingresa tu correo y recibirás mis últimas entradas sobre programación, open source, bases de datos y todo lo relacionado con informática

Únete a otros 375 suscriptores


parzibyte

Programador freelancer listo para trabajar contigo. Aplicaciones web, móviles y de escritorio. PHP, Java, Go, Python, JavaScript, Kotlin y más :) https://parzibyte.me/blog/software-creado-por-parzibyte/

0 Comments

Deja un comentario

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

A %d blogueros les gusta esto: