Servidor Web Arduino Uno WiFi: Controla un LED desde el Navegador

Componentes y Suministros

Sobre el Proyecto

WebServerBlink

Ejemplo demostrativo de cómo crear un servidor web simple con Arduino UNO WiFi para encender/apagar un LED desde el navegador.

1. Hardware

• Arduino UNO WiFi
• LED (o el integrado en pin 13)
• Resistencia 220 Ω (si LED externo)
• Cables y protoboard

2. Circuito

Conecta el ánodo del LED (pata larga) en serie con la resistencia de 220 Ω al pin 13. El cátodo a GND. Si usas el LED integrado, no necesitas cableado extra.

3. Código

Sube el sketch y accede desde el navegador a:

• https://<IP>/arduino/webserver/
• https://<hostname>.local/arduino/webserver/

#include <Wire.h>
#include <ArduinoWiFi.h>

void setup() {
  pinMode(13, OUTPUT);
  Wifi.begin();
  Wifi.println("WebServer Server is up");
}

void loop() {
  while (Wifi.available()) { process(Wifi); }
  delay(50);
}

void process(WifiData client) {
  String command = client.readStringUntil('/');
  if (command == "webserver") { WebServer(client); }
  if (command == "digital") { digitalCommand(client); }
}

void WebServer(WifiData client) {
  client.println("HTTP/1.1 200 OK");
  client.println("Content-Type: text/html");
  client.println();
  client.println("<html>");
  client.println("<head> </head>");
  client.print("<body>");
  client.print("Click<input type=button onClick=\"var w=window.open('/arduino/digital/13/1','_parent');w.close();\" value='ON'>pin13 ON<br>");
  client.print("Click<input type=button onClick=\"var w=window.open('/arduino/digital/13/0','_parent');w.close();\" value='OFF'>pin13 OFF<br>");
  client.print("</body>");
  client.println("</html>");
  client.print(DELIMITER); // Importante para terminar comunicación
}

void digitalCommand(WifiData client) {
  int pin = client.parseInt();
  if (client.read() == '/') {
    int value = client.parseInt();
    digitalWrite(pin, value);
  }
  client.println("Status: 200 OK\n");
  client.print(F("Pin D")); client.print(pin);
  client.print(F(" set to ")); client.print(value);
  client.print(EOL);
}

4. Resultado

Al acceder a la URL verás una página con dos botones:

• ON – Enciende el LED (pin 13)
• OFF – Apaga el LED

Nota: Usa la dirección IP o hostname.local de tu placa en el navegador para acceder al panel web del Arduino UNO WiFi.

Código

Archivo único: WebServer.ino (incluido arriba completo).

Esquemáticos