Controle de LEDs e Relés através do Web Server do ESP32

Introdução🔗

O ESP32 é um microcontrolador poderoso que combina recursos de Wi-Fi e Bluetooth, tornando-o ideal para projetos de Internet das Coisas (IoT). Controlar dispositivos como LEDs e relés através de um Web Server permite a criação de sistemas de automação residencial, controle industrial e protótipos interativos.

Objetivos🔗

• Configurar um Web Server no ESP32.
• Controlar LEDs e relés através de uma interface web.
• Compreender a interação entre hardware e software no contexto do ESP32.

Materiais Necessários🔗

• 1 x ESP32 DevKit.
• 1 x LED (qualquer cor).
• 1 x Resistor de 220Ω para o LED.
• 1 x Módulo relé 5V.
• Protoboard e jumpers.

Conceitos Fundamentais🔗

Antes de mergulharmos na prática, é essencial entender alguns conceitos teóricos:

O que é um Web Server no ESP32?

Um Web Server é um programa que, rodando no ESP32, aguarda conexões HTTP de clientes (como navegadores web) e responde a essas requisições. Isso permite interagir com o microcontrolador através de páginas web.

Como funciona o controle de GPIOs via Web?

Ao receber uma requisição HTTP, o ESP32 pode executar funções específicas, como alterar o estado de um pino GPIO. Assim, ao clicar em um botão na interface web, enviamos um comando para o ESP32 alterar o estado de um dispositivo conectado.

Montagem do Circuito🔗

Conexão do LED

1. Anodo (+) do LED: conectar a um resistor de 220Ω.

2. Outra extremidade do resistor: conectar ao pino GPIO 15 do ESP32.

3. Catodo (-) do LED: conectar ao GND do ESP32.

Conexão do Relé

1. VCC do módulo relé: conectar ao 5V do ESP32.

2. GND do módulo relé: conectar ao GND do ESP32.

3. IN do módulo relé: conectar ao pino GPIO 14 do ESP32.

Nota: Certifique-se de utilizar um isolador óptico se estiver controlando cargas altas com o relé.

Desenvolvendo o Código🔗

Configurando as Bibliotecas

Utilizaremos a Arduino IDE para programar o ESP32. As bibliotecas necessárias são:

• WiFi.h: para conectividade Wi-Fi.
• WebServer.h: para criar o servidor web.

#include <WiFi.h>
#include <WebServer.h>

Definindo as Credenciais Wi-Fi

const char* ssid = "SEU_SSID";
const char* password = "SUA_SENHA";

Inicializando o Servidor Web

WebServer server(80);

Configurando os Pinos

const int ledPin = 15;
const int relayPin = 14;
void setup()
{
    pinMode(ledPin, OUTPUT);
    pinMode(relayPin, OUTPUT);
    digitalWrite(ledPin, LOW);
    digitalWrite(relayPin, LOW);
    Serial.begin(115200);
    connectToWiFi();
    setupWebServer();
}

Função de Conexão Wi-Fi

void connectToWiFi()
{
    Serial.println("Conectando ao Wi-Fi...");
    WiFi.begin(ssid, password);
    while (WiFi.status() != WL_CONNECTED)
    {
        delay(500);
        Serial.print(".");
    }
    Serial.println("");
    Serial.print("Conectado: ");
    Serial.println(WiFi.localIP());
}

Configurando as Rotas do Servidor

void setupWebServer()
{
    server.on("/", handleRoot);
    server.on("/led/on", handleLedOn);
    server.on("/led/off", handleLedOff);
    server.on("/relay/on", handleRelayOn);
    server.on("/relay/off", handleRelayOff);
    server.begin();
    Serial.println("Servidor iniciado.");
}

Implementando as Funções de Manipulação

void handleRoot()
{
    String html = "<h1>Controle de Dispositivos</h1>";
    html += "<p><a href=\"/led/on\">Ligar LED</a></p>";
    html += "<p><a href=\"/led/off\">Desligar LED</a></p>";
    html += "<p><a href=\"/relay/on\">Ligar Relé</a></p>";
    html += "<p><a href=\"/relay/off\">Desligar Relé</a></p>";
    server.send(200, "text/html", html);
}
void handleLedOn()
{
    digitalWrite(ledPin, HIGH);
    server.sendHeader("Location", "/");
    server.send(303);
}
void handleLedOff()
{
    digitalWrite(ledPin, LOW);
    server.sendHeader("Location", "/");
    server.send(303);
}
void handleRelayOn()
{
    digitalWrite(relayPin, HIGH);
    server.sendHeader("Location", "/");
    server.send(303);
}
void handleRelayOff()
{
    digitalWrite(relayPin, LOW);
    server.sendHeader("Location", "/");
    server.send(303);
}

Loop Principal

void loop()
{
    server.handleClient();
}

Explicação Detalhada do Código🔗

Bibliotecas e Variáveis Globais

Começamos incluindo as bibliotecas necessárias e definindo as credenciais da rede Wi-Fi. Em seguida, instanciamos o objeto WebServer na porta 80, a porta padrão para HTTP.

Setup

No setup(), configuramos os pinos dos dispositivos como saídas e estabelecemos a conexão Wi-Fi. Utilizamos Serial.begin(115200) para permitir a visualização de logs no monitor serial.

Função connectToWiFi()

Esta função gerencia a conexão com a rede Wi-Fi. Utilizamos um while para aguardar até que o estado da conexão seja WL_CONNECTED.

Configuração do Servidor Web

A função setupWebServer() define as rotas que o servidor irá responder. Para cada URL, associamos uma função que será executada quando a rota for acessada.

Funções de Manipulação (handle)

As funções handleLedOn() e handleLedOff() controlam o estado do LED. Da mesma forma, handleRelayOn() e handleRelayOff() controlam o relé. Após alterar o estado do dispositivo, redirecionamos o cliente de volta para a página inicial usando o código de status HTTP 303.

Loop Principal

No loop(), chamamos server.handleClient() continuamente para garantir que o servidor possa responder às requisições dos clientes.

Testando o Projeto🔗

1. Upload do Código: Carregue o código no ESP32 através da Arduino IDE.

2. Monitor Serial: Abra o monitor serial para visualizar o endereço IP atribuído ao ESP32.

3. Acessando o Web Server: No navegador web de um dispositivo conectado à mesma rede, digite o endereço IP do ESP32.

4. Interação: Utilize os links na página para ligar e desligar o LED e o relé.

Aprimoramentos e Personalizações🔗

Agora que o básico está funcionando, podemos considerar melhorias:

• Estilização da Interface: Adicionar CSS para melhorar a aparência da página.
• Feedback em Tempo Real: Utilizar AJAX para atualizar o estado dos dispositivos sem recarregar a página.
• Segurança: Implementar autenticação para proteger o acesso ao servidor.

Implementando CSS Básico

Podemos incorporar estilos inline ou referenciar estilos externos. Exemplo de adição de estilos:

String html = "<h1 style='color: blue;'>Controle de Dispositivos</h1>";

Utilizando AJAX para Atualização Dinâmica

Ao invés de recarregar a página a cada interação, podemos usar JavaScript para enviar requisições assíncronas:

<button onclick="toggleLed('on')">Ligar LED</button>
<button onclick="toggleLed('off')">Desligar LED</button>
<script>
function toggleLed(state)
{
    var xhttp = new XMLHttpRequest();
    xhttp.open("GET", "/led/" + state, true);
    xhttp.send();
}
</script>

No código acima, ao clicar no botão, uma requisição é enviada ao servidor sem recarregar a página.

Compreendendo Relés🔗

Um relé é um dispositivo eletromecânico que permite controlar circuitos de alta potência utilizando sinais de baixa potência. No contexto do ESP32:

• Isolamento: O relé isola eletricamente o microcontrolador do circuito que está sendo controlado.
• Aplicações: Controlar luzes, motores e outros dispositivos que operam em tensões mais altas.

Atenção: Sempre tenha cautela ao trabalhar com altas tensões. Certifique-se de compreender os riscos e utilizar o equipamento de proteção adequado.

Ajustes para Múltiplos Dispositivos🔗

Para controlar múltiplos LEDs ou relés, basta definir mais pinos e criar rotas correspondentes:

const int ledPin2 = 16;
pinMode(ledPin2, OUTPUT);

Crie as funções handleLed2On() e handleLed2Off(), e adicione as rotas ao servidor.

Solução de Problemas🔗

• Não consigo acessar o servidor web: Verifique se o ESP32 está conectado à rede e se o endereço IP está correto.
• Dispositivo não responde aos comandos: Certifique-se de que os pinos estão conectados corretamente e que os dispositivos funcionam.
• Erro de compilação na Arduino IDE: Verifique se as bibliotecas estão instaladas corretamente e se você selecionou a placa ESP32 nas configurações.

Conceitos Avançados🔗

Entendendo o Protocolo HTTP

O protocolo HTTP é a base da comunicação web. Cada requisição HTTP possui um método (como GET ou POST) e um caminho. No ESP32, utilizamos esses caminhos para definir ações específicas.

Estados Lógicos dos Pinos

O ESP32 opera em níveis de tensão de 0V a 3.3V. No contexto dos GPIOs:

• HIGH: geralmente 3.3V, representando o nível lógico 1.
• LOW: 0V, representando o nível lógico 0.

Para controlar dispositivos de 5V, como alguns módulos relé, é importante considerar os níveis de tensão e, se necessário, utilizar transistores ou drivers específicos.

Conclusão🔗

Controlar LEDs e relés através de um Web Server no ESP32 abre um vasto leque de possibilidades em automação e IoT. Compreendendo os fundamentos apresentados, você pode expandir o projeto para controlar diversos dispositivos, integrar sensores e desenvolver sistemas completos.

• Integração com Banco de Dados: Armazenar estados e históricos.
• Controle via Internet: Ajustar o roteador para acesso remoto ou utilizar serviços de nuvem.
• Implementação de Segurança: Utilizar HTTPS e autenticação robusta.

Dicas Finais🔗

• Organização do Código: À medida que o projeto cresce, é importante modularizar o código e comentar adequadamente.
• Aprendizado Contínuo: Explore documentações oficiais e comunidades para aprimorar suas habilidades.
• Experimentação: Não hesite em testar novas ideias e componentes.

Boa sorte em seus projetos com o ESP32!

Referências🔗

• Arduino IDE Official Website arduino.cc
• Documentação da Espressif docs.espressif.com
• Documentação de Apresentação do ESP32 espressif.com/en/products/socs/esp32
• Documentação do ESP32 Arduino Core docs.espressif.com/projects/arduino-esp32
• Repositório do ESP32 Arduino Core github.com/espressif/arduino-esp32