ESP32 devkit v1 Servidor Web

El siguiente proyecto es para el control de componentes por medio de internet pero va paso a paso desde una simple pagina web, hasta una pagina mas pesada y mas compleja utilizando un modulo de SD.

Este proyecto esta basado en https://startingelectronics.org/tutorials/arduino/ethernet-shield-web-server-tutorial/ el cual muestra un servidor web con arduino uno y ethernet shield.

Componentes Principales
ESP-32
*Previamente debe tener los Divers instalados en la PC
youtu.be/Odh0LWXOZZk  ----- aquí un vídeo de como instalarlo

Comenzando....
Es de aclarar que para este código no necesitamos componentes mas que conectar nuestro ESP32
Tenemos el siguiente código



#include <WiFi.h>
WiFiServer server(80);

const char* ssid     = "Contrasena es contrasena123"; //Nombre de la red WiFi
const char* password = "contrasena123";       //Contraseña de la red

//variables globales
int contconexion = 0;

String header; // Variable para guardar el HTTP request


//Codigo HTML
String pagina = "<!DOCTYPE html>"
                 "<title>ESP32</title>"
                 "</head>"
                 "<body>"
                 "<h1>HELLO FROM SP32</h1>"
                 "<p>A web page from the ESP32 server</p>"
                 "</body>"
                 "</html>";

void setup() {
  Serial.begin(115200);
  Serial.println("");
  

  // Conexión WIFI
  WiFi.begin(ssid, password);
  //Cuenta hasta 50 si no se puede conectar lo cancela
  while (WiFi.status() != WL_CONNECTED and contconexion <50) { 
    ++contconexion;
    delay(500);
    Serial.print(".");
  }
  if (contconexion <50) {
      //para usar con ip fija
      IPAddress ip(192,168,1,180); 
      IPAddress gateway(192,168,1,1); 
      IPAddress subnet(255,255,255,0); 
      WiFi.config(ip, gateway, subnet); 
      
      Serial.println("");
      Serial.println("WiFi conectado");
      Serial.println(WiFi.localIP());
      server.begin(); // iniciamos el servidor
  }
  else { 
      Serial.println("");
      Serial.println("Error de conexion");
  }
}

void loop(){
  WiFiClient client = server.available();   // Escucha a los clientes entrantes

  if (client) {                             // Si se conecta un nuevo cliente
    Serial.println("New Client.");          // 
    String currentLine = "";                //
    while (client.connected()) {            // loop mientras el cliente está conectado
      if (client.available()) {             // si hay bytes para leer desde el cliente
        char c = client.read();             // lee un byte
        Serial.write(c);                    // imprime ese byte en el monitor serial
        header += c;
        if (c == '\n') {                    // si el byte es un caracter de salto de linea
          // si la nueva linea está en blanco significa que es el fin del 
          // HTTP request del cliente, entonces respondemos:
          if (currentLine.length() == 0) {
            client.println("HTTP/1.1 200 OK");
            client.println("Content-type:text/html");
            client.println("Connection: close");
            client.println();
            
            
            // Muestra la página web
            client.println(pagina);
            
            // la respuesta HTTP temina con una linea en blanco
            client.println();
            break;
          } else { // si tenemos una nueva linea limpiamos currentLine
            currentLine = "";
          }
        } else if (c != '\r') {  // si C es distinto al caracter de retorno de carro
          currentLine += c;      // lo agrega al final de currentLine
        }
      }
    }
    // Limpiamos la variable header
    header = "";
    // Cerramos la conexión
    client.stop();
    Serial.println("Client disconnected.");
    Serial.println("");
  }
}



Tendremos un resultado como este
















Aclarando que el los campos de"contraseña es contrasena" y de"contrasena123" Solo son para objeto de ejemplo y que se debe cambiar a la de su router const char* ssid     = "Contrasena es contrasena123"; //Nombre de la red WiFi const char* password ="contrasena123"; //Contraseña de la red







Comentarios