Referência da Biblioteca ESP32 WebServer
Visão Geral
A biblioteca DIYables_ESP32_WebServer oferece uma solução completa para criar servidores web com várias páginas e suporte a WebSocket em placas ESP32.
Hardware Necessário
Or you can buy the following kits:
| 1 | × | DIYables ESP32 Starter Kit (ESP32 included) | |
| 1 | × | DIYables ESP32 S3 Starter Kit (ESP32 S3 included) | |
| 1 | × | DIYables Sensor Kit (18 sensors/displays) |
Exemplos
Instalação
Passos Rápidos
Siga estas instruções passo a passo:
- Se esta é a sua primeira vez usando o ESP32, consulte o tutorial sobre como configurar o ambiente do ESP32 no Arduino IDE.
- Conecte a placa ESP32 ao seu computador com um cabo USB.
- Abra o Arduino IDE no seu computador.
- Selecione a placa ESP32 apropriada (por exemplo, ESP32) e a porta COM.
- Abra o Library Manager clicando no ícone Library Manager no lado esquerdo do Arduino IDE.
- Pesquise por Web Server for ESP32 e encontre a mWebSockets da DIYables.
- Clique no botão Install para adicionar a biblioteca mWebSockets.

Suporte a WebSocket (Integrado)
A funcionalidade WebSocket agora está integrada diretamente nesta biblioteca!
A implementação do WebSocket é baseada na excelente biblioteca mWebSockets de Dawid Kurek, que foi integrada e otimizada especificamente para o ESP32 para facilitar o uso:
- Não é necessário instalar nenhuma biblioteca adicional - o suporte a WebSocket já vem integrado
- Otimizada para o ESP32 - Implementação simplificada específica para a plataforma
- Compatível com WiFi - Usa a pilha WiFi nativa do ESP32
- Compatível com a RFC 6455 - Suporte completo ao protocolo WebSocket
- Comunicação em tempo real - Troca de dados bidirecional
Uso:
- Para tudo (Web Server + WebSocket): Use #include <DIYables_ESP32_WebServer.h>
- Só isso! - A funcionalidade WebSocket fica disponível automaticamente quando necessária
- Eficiente em memória - O código WebSocket não utilizado é removido automaticamente pelo compilador
Créditos: Implementação do WebSocket adaptada da biblioteca mWebSockets (licença LGPL-2.1) de Dawid Kurek, modificada e integrada para uma compatibilidade perfeita com o ESP32.
Classes da Biblioteca
Classe DIYables_ESP32_WebServer
A classe principal para criar e gerenciar servidores web.
Construtor
Cria uma instância de servidor web na porta especificada (padrão: 80).
Métodos
begin()
Inicia o servidor web e começa a escutar conexões de entrada.
Versões sobrecarregadas:
- begin(): Inicia somente o servidor (o WiFi deve ser conectado separadamente pela sua aplicação)
- begin(ssid, password): Conecta ao WiFi e inicia o servidor em uma única chamada (abordagem antiga)
setNotFoundHandler()
Define um tratador personalizado para respostas 404 Not Found.
printWifiStatus()
Imprime o status da conexão WiFi e o endereço IP no Serial Monitor.
handleClient()
Processa as requisições de clientes recebidas. Deve ser chamada repetidamente no loop principal.
on()
Registra uma função tratadora para um URI e um método HTTP específicos.
Parâmetros:
- uri: O caminho do URI (por exemplo, "/", "/led", "/api/data")
- method: Método HTTP (GET, POST, PUT, DELETE, etc.)
- fn: Função tratadora a ser executada quando a rota for acessada
Observação: Esta biblioteca usa o método addRoute() em vez de on(). Veja abaixo o uso correto.
addRoute()
Registra uma função tratadora para um URI específico. Este é o método realmente usado na biblioteca.
Formato da Função RouteHandler:
Os tratadores de rota devem seguir exatamente esta assinatura:
Parâmetros:
- client: Referência a WiFiClient para enviar as respostas
- method: Método HTTP como string ("GET", "POST", etc.)
- request: URI completo da requisição
- params: Parâmetros de consulta (objeto QueryParams)
- jsonData: Conteúdo JSON para requisições POST (vazio para GET)
Exemplos de Implementação de Tratadores:
- Tratador GET Básico:
- Tratador de API JSON (GET e POST):
- Tratador de Parâmetros de Consulta:
sendResponse()
Envia uma resposta HTTP ao cliente.
Parâmetros:
- client: Referência a WiFiClient (fornecida na função tratadora)
- content: Conteúdo do corpo da resposta
- contentType: Tipo MIME da resposta (padrão: "text/html")
Exemplos de Uso:
Métodos de Autenticação
enableAuthentication()
Habilita a Autenticação Básica HTTP para todas as rotas. Depois de habilitada, todas as rotas exigem autenticação.
Parâmetros:
- username: Nome de usuário para autenticação (máx. 31 caracteres)
- password: Senha para autenticação (máx. 31 caracteres)
- realm: Realm de autenticação exibido no navegador (máx. 63 caracteres, opcional)
Exemplo de Uso:
disableAuthentication()
Desabilita a autenticação, tornando todas as rotas públicas novamente.
Exemplo de Uso:
isAuthenticationEnabled()
Retorna true se a autenticação estiver habilitada no momento, ou false caso contrário.
Exemplo de Uso:
send401()
Envia uma resposta 401 Unauthorized com o cabeçalho WWW-Authenticate correto. É chamada automaticamente quando a autenticação falha, mas pode ser usada manualmente em tratadores personalizados.
Exemplo de Uso:
Envio Manual de Respostas
Para ter mais controle sobre os cabeçalhos HTTP e os códigos de status:
Acesso aos Parâmetros de Consulta
Estrutura QueryParams
O objeto QueryParams contém os parâmetros de consulta analisados a partir da URL:
Acessando os Parâmetros de Consulta
Funções Auxiliares de Parâmetros
Crie funções auxiliares para facilitar o acesso aos parâmetros:
Classes WebSocket (Integradas)
WebSocketServer
Alias de net::WebSocketServer - simplificado para uso por iniciantes.
WebSocket
Alias de net::WebSocket - representa uma conexão WebSocket.
Métodos do WebSocket
begin()
Inicia o servidor WebSocket.
loop()
Processa os eventos do WebSocket. Chame-a no seu loop principal.
onConnection()
Define o callback para novas conexões WebSocket.
onMessage()
Define o callback para mensagens WebSocket recebidas.
onClose()
Define o callback para o encerramento de conexões WebSocket.
send()
Envia uma mensagem pelo WebSocket.
close()
Fecha a conexão WebSocket.
Métodos Adicionais do WebSocket
broadcastTXT()
Transmite uma mensagem de texto para todos os clientes WebSocket conectados.
broadcastBIN()
Transmite dados binários para todos os clientes WebSocket conectados.
connectedClients()
Retorna o número de clientes WebSocket conectados no momento.
isListening()
Retorna true se o servidor WebSocket estiver escutando conexões ativamente.
Tipos de Evento do WebSocket
Enum DataType
- WebSocket::DataType::TEXT - Tipo de mensagem de texto
- WebSocket::DataType::BINARY - Tipo de dados binários
Enum CloseCode
Códigos padrão de encerramento do WebSocket, que indicam os motivos do término da conexão.
Uso Avançado do WebSocket
Configuração dos Tratadores de Eventos
Processamento de Mensagens
Transmitindo Dados de Sensores
Métodos HTTP
A biblioteca oferece suporte aos métodos HTTP padrão:
- HTTP_GET
- HTTP_POST
- HTTP_PUT
- HTTP_DELETE
- HTTP_PATCH
- HTTP_HEAD
- HTTP_OPTIONS
Integração com JavaScript no Lado do Cliente
Conexão WebSocket Básica
Enviando Comandos
Tratamento de Mensagens
Exemplos de WebSocket
Servidor Echo Simples
Processamento de Comandos JSON
Implementação de Heartbeat
Solução de Problemas do WebSocket
Problemas Comuns
Falha na Conexão WebSocket
- Verifique se a porta do servidor WebSocket (padrão: 81) está acessível
- Confirme que o endereço IP do ESP32 está correto e acessível
- Use as ferramentas de desenvolvedor do navegador para verificar erros na conexão WebSocket
Mensagens Não Estão Sendo Recebidas
- Verifique no Serial Monitor os logs de eventos do WebSocket
- Confirme que o formato da mensagem JSON está correto
- Teste com mensagens de texto simples antes de usar JSON
- Confirme que o tamanho da mensagem não excede os limites do buffer
Alto Uso de Memória
- Limite o número de conexões WebSocket simultâneas
- Limpe os buffers de mensagens regularmente
- Use um tratamento eficiente de String (evite concatenações frequentes)
- Monitore a memória heap livre
Auxiliares de Depuração
Monitoramento de Desempenho
A biblioteca oferece suporte a templates HTML com substituição de marcadores:
Marcadores comuns:
- %TEMPERATURE% - Valor da temperatura
- %LED_STATUS% - Status do LED
- %QUERY_PARAM% - Valores dos parâmetros de consulta
Recursos Avançados do Servidor Web
Suporte a CORS
Habilite requisições entre origens (cross-origin) para aplicações web:
Auxiliares de Resposta JSON
Simplifique o desenvolvimento de APIs JSON:
Validação de Requisições
Implemente uma validação de entrada robusta:
Processamento JSON Avançado
Para um tratamento complexo de JSON com a biblioteca ArduinoJson:
Tratamento de Erros
Tratador 404 Padrão
A biblioteca oferece uma página de erro 404 padrão. Você pode substituí-la:
Boas Práticas
- Gerenciamento de Memória: Use a macro F() para literais de string armazenados na memória flash
- Código Não Bloqueante: Mantenha as funções tratadoras leves para não bloquear o servidor
- Segurança: Valide os parâmetros de entrada e trate a saída
- Desempenho: Use códigos de status HTTP e tipos de conteúdo adequados
- WebSocket: Trate corretamente os estados de conexão e implemente a lógica de reconexão
Depuração
Habilite a depuração serial para monitorar a atividade do servidor:
Compatibilidade
- ESP32: Totalmente suportado
- Biblioteca WiFi: Necessária (incluída no Arduino IDE)
- Requisitos de Memória: Mínimo de 32KB de flash, 2KB de RAM
Limitações
Limitações do Servidor Web
- Máximo de conexões HTTP simultâneas: 4 (limitação de hardware)
- Comprimento máximo da URL: 256 caracteres
- Marcadores de template: Sem substituições aninhadas
Limitações do WebSocket
- Tamanho máximo da mensagem WebSocket: 1KB por mensagem
- Máximo de conexões WebSocket simultâneas: 4-6 (dependendo da memória disponível)
- Mensagens fragmentadas: Tratadas automaticamente, mas podem afetar o desempenho
- Tamanho das mensagens binárias: Limitado pela RAM disponível
- Tempo limite de conexão: 60 segundos por padrão (configurável)
Restrições de Memória
- Memória flash mínima necessária: 32KB
- RAM mínima necessária: 2KB para a funcionalidade básica
- Sobrecarga do WebSocket: ~200-500 bytes por conexão
- Buffer de mensagens: ~1KB por conexão ativa