Servidor web en tarjeta NodeMCU ESP8266

Crear servidor web con NodeMCU ESP8266

En este artículo te mostraré cómo configurar la tarjeta NodeMCU como punto de acceso, AP o SoftAP para poder conectarte a ella usando WiFi y pode consultar un web server.

Dentro de la tarjeta vamos a “embeber” un servidor web, que no es otra cosa más que responder con HTML a las peticiones, pero podemos modificar ese HTML ya que tenemos el lenguaje C++ en la tarjeta.

De hecho eso hacen todos los lenguajes de programación del lado del servidor: leen peticiones y modifican HTML para mostrarlo.

Esto abre un mundo de posibilidades, pues podremos hacer bastantes cosas, pero comencemos con lo básico y es convertir la tarjeta en un servidor web.

Nota: si tú no quieres crear una red WiFi y solo quieres crear el servidor web para que se conecte a tu red WiFi (de modo que puedas acceder a él en tu red local con su IP), mira este tutorial que a su vez es más fácil.

Lecturas recomendadas

Te recomiendo configurar tu entorno con PlatformIO y después hacer el Hola mundo. Si ya has probado lo básico con esta tarjeta entonces vamos al tutorial.

Configuración de la red y el servidor web

Vamos a crear un softAP. Necesitamos definir la IP, puerta de enlace, máscara de subred, SSID (nombre de la red) y contraseña del punto de acceso.

También vamos a crear un servidor web que escuchará en el puerto 80. Todo eso se define en algunas constantes:

Antes de iniciar el punto de acceso necesitamos definir algunas funciones manejadoras.

Funciones del servidor

Podemos hacer que, dependiendo de la ruta que se consulte al wifi de la esp8266 se realice algo. Por ejemplo, si visitan la ruta “encender” se puede encender una bombilla, y si visitan la ruta “apagar” se puede apagar.

Por el momento solo vamos a escuchar a la raíz / y también vamos a manejar las rutas que no se encuentren, es decir, mostrar el error 404.

Si has programado con la web y los enrutadores de la misma, esto se te hará familiar. Tenemos dos funciones:

La más importante es la que maneja la raíz. Creamos una respuesta HTML en una string, misma respuesta puede ser concatenada con variables y ser creada a partir de funciones, comparaciones, etcétera.

Para responder invocamos al método send que recibe el código HTTP (200 porque es de OK, encontrado), el tipo de respuesta (que será html) y finalmente el cuerpo.

También tenemos la función rutaNoEncontrada que envía el texto 404 así como el código HTTP 404.

Encender AP y servidor web

En el método setup vamos a crear el punto de acceso, iniciar el servidor y definir las funciones que se llamarán dependiendo de una ruta.

Fíjate en servidor.on, pues ahí definimos las ruta solicitada y la función. Después, el servidor comienza a “escuchar” con begin.

Ahora, para manejar las peticiones, dentro del loop invocamos a servidor.handleClient y eso es todo:

Código completo

Todo el código queda como se ve a continuación:

Conectar al AP y visitar página

Ahora sube el código a la tarjeta, después conecta tu teléfono o computadora a la red recién creada. Debe aparecer como una red WiFi completamente normal.

Conectar a la red creada por ESP8266
Conectar a la red creada por ESP8266

Abre el navegador y visita la IP configurada previamente que, si no modificaste, es 192.168.1.1; se debe ver lo siguiente:

Servidor web en tarjeta NodeMCU ESP8266
Servidor web en tarjeta NodeMCU ESP8266

¡Enhorabuena! tenemos un servidor web embebido en nuestra tarjeta. Con esto podemos hacer miles de cosas.

En próximos tutoriales te mostraré cómo encender y apagar un LED usando este servidor, y también vamos a explorar cómo convertirlo en cliente.

Encantado de ayudarte


Estoy disponible para trabajar en tu proyecto, modificar el programa del post o realizar tu tarea pendiente, no dudes en ponerte en contacto conmigo.

No te pierdas ninguno de mis posts

Suscríbete a mi canal de Telegram para recibir una notificación cuando escriba un nuevo tutorial de programación.

Dejar un comentario