{"id":1623,"date":"2019-03-19T09:05:57","date_gmt":"2019-03-19T14:05:57","guid":{"rendered":"http:\/\/blog.espol.edu.ec\/edelros\/?p=1623"},"modified":"2026-08-04T21:55:06","modified_gmt":"2026-08-05T02:55:06","slug":"esp32-webserver-blink","status":"publish","type":"post","link":"https:\/\/blog.espol.edu.ec\/girni\/esp32-webserver-blink\/","title":{"rendered":"ESP32 WebServer Blink"},"content":{"rendered":"\n

Encender y Apagar el LED incorporado (Pin 5) en el m\u00f3dulo ESP32 desde una p\u00e1gina web.<\/p>\n\n\n\n

\"https:\/\/learn.sparkfun.com\/tutorials\/esp32-thing-hookup-guide\"<\/a><\/figure>\n\n\n\n

El m\u00f3dulo se configura como un Web Server para responder a las petici\u00f3n desde un browser. La direcci\u00f3n mostrada en la figura es un ejemplo.<\/em><\/p>\n\n\n\n

La librer\u00eda  b\u00e1sica usada es WiFi.h con los valores de SSID y Password para acceder a la red existente, valores que se deben actualizar de acuerdo a la configuraci\u00f3n de su red. El router asigna una direcci\u00f3n IP de forma autom\u00e1tica, y su valor se muestra en el monitor serial, direcci\u00f3n usada en un brower para observar el resultado.<\/p>\n\n\n\n

Monitor Serial<\/p>\n\n\n\n

ets Jun 8 2016 00:22:57\n\nrst:0x10 (RTCWDT_RTC_RESET),boot:0x13 (SPI_FAST_FLASH_BOOT)\nconfigsip: 0, SPIWP:0xee\nclk_drv:0x00,q_drv:0x00,d_drv:0x00,cs0_drv:0x00,hd_drv:0x00,wp_drv:0x00\nmode:DIO, clock div:1\nload:0x3fff0018,len:4\nload:0x3fff001c,len:1100\nload:0x40078000,len:10088\nload:0x40080400,len:6380\nentry 0x400806a4\n\nConectando a RedWifi\n..\nWiFi conectado \nDirecci\u00f3n IP: 192.168.10.104<\/strong><\/em><\/code><\/pre>\n\n\n\n
Para simplificar las instrucciones, la secci\u00f3n de conexi\u00f3n a la red WiFi se realiza en la funci\u00f3n inicia_wifi()<\/code>.<\/p>\n\n\n\n
Instrucciones<\/em><\/strong>:<\/p>\n\n\n\n
Para iniciar el modo servidor web se requiere WifiServer server(puertoweb), el puerto web es el 80.<\/p>\n\n\n\n
En el programa se revisa el estado del cliente (client): conectado, disponible, leyendo cada caracter enviado por el browser e interpretando las instrucciones por cada fin de l\u00ednea ('\\n').<\/p>\n\n\n\n
Si la l\u00ednea recibida finaliza con \"GET \/H\" o \"GET \/L\" se realiza el cambio de estado del LED.<\/p>\n\n\n\n
Al final se cierra la conexi\u00f3n, y se continua monitoreando el estado del cliente.<\/p>\n\n\n
\n\/* ESP32 web server para encender LED_Pin\nforma b\u00e1sica con la funci\u00f3n inicia_wifi\nReferencia: https:\/\/www.arduino.cc\/en\/Tutorial\/WiFiWebServer  \n*\/\n#include <WiFi.h>\n\nconst char* ssid     = "";\nconst char* password = "";\n\n\/\/ puerto de servidor web 80\nconst PROGMEM uint8_t puertoweb = 80;\nWiFiServer server(puertoweb);\n\n\n\/\/ LED monitor interno\n\/\/ESP01-pin=1, ESP07-pin=2; ESP32-pin=5\nconst PROGMEM uint8_t LED_pin = 5; \n\nvoid setup()\n{\n    \/\/ Conexion serial\n    Serial.begin(115200);\n    Serial.setTimeout(500);\n    \/\/ espera inicializar serial\n    while(!Serial) { }\n\n    \/\/ LED monitor\n    pinMode(LED_pin, OUTPUT);\n    delay(10);\n\n    inicia_wifi();\n    server.begin();\n}\n\nvoid loop(){\n    WiFiClient client = server.available();\n    if (client){\n        String linea = "";\n        Serial.println();\n        Serial.println("Nuevo cliente.");\n        while (client.connected()) {\n            if (client.available()) {\n                char c = client.read();\n                Serial.write(c);\n                if (c == '\\n') {\n                    \/\/ Si recibe fin de linea y la linea es vacia,\n                    \/\/ la peticion http finaliz\u00f3, se responde:\n                    if (linea.length() == 0) {\n                        \/\/ HTTP headers inician con \u00e9sta secuencia:\n                        client.println("HTTP\/1.1 200 OK");\n                        client.println("Content-type:text\/html");\n                        client.println();\n                        \/\/ contenido despues de headers\n                        client.print("Click <a href="\\"\/H\\"">ENCIENDE LED<\/a>\n");\n                        client.print("Click <a href="\\"\/L\\"">   APAGA LED<\/a>\n");\n                        \/\/ finaliza contenido:\n                        client.println();\n                        \/\/ sale del lazo:\n                        break;\n                    } else {\n                        linea = "";\n                    }\n                } else if (c != '\\r') {\n                    linea = linea + c;\n                }\n            \/\/ Revisa click del cliente "GET \/H" or "GET \/L":\n            if (linea.endsWith("GET \/H")) {\n                digitalWrite(LED_pin, HIGH);\n            }\n            if (linea.endsWith("GET \/L")) {\n                digitalWrite(LED_pin, LOW);\n            }\n        }\n    }\n    delay(1); \/\/ espera que browser procese\n    client.stop(); \/\/ cierra conexi\u00f3n:\n    Serial.println("Cliente desconectado.");\n    }\n}\n\nvoid inicia_wifi() {\n    \/\/ conexion WiFi\n    Serial.print("\\n Conectando a ");\n    Serial.println(ssid);\n    WiFi.begin(ssid, password);\n    int cuenta = 0;\n    while (WiFi.status() != WL_CONNECTED){\n        Serial.print(".");\n        cuenta = cuenta+1;\n        if (cuenta>=40){\n            Serial.println();\n            cuenta = 0;}\n        \/\/ LED interno enciende en LOW\n        digitalWrite(LED_pin, LOW);\n        delay(250);\n        digitalWrite(LED_pin, HIGH);\n        delay(250);\n        }\n    Serial.print("\\n WiFi conectado \\n Direcci\u00f3n IP: ");\n    Serial.println(WiFi.localIP());\n    delay(10);\n}\n<\/pre><\/div>\n\n\n
Puntos por desarrollar<\/strong><\/p>\n\n\n\n