Controllare ESP32 da smartphone: BlueGrays IoT in 5 passi

Controllare l'ESP32 da smartphone significa accendere e spegnere un relè, un LED o un motore collegato alla scheda con il telefono che hai in tasca, e leggere sul telefono i valori dei sensori. È anche il primo passo più divertente per imparare l'IoT. L'ESP32 integra Wi-Fi a 2,4 GHz e Bluetooth, quindi non serve nessun modulo aggiuntivo. La vera domanda è quale strada scegliere. Per il controllo dell'ESP32 tramite app puoi scrivere il tuo web server, collegarti via Bluetooth o creare un bot Telegram. Anche le dashboard cloud come Blynk e Arduino IoT Cloud sono un'opzione. Ogni metodo ha tempi di configurazione, portata e limiti diversi.

In questa guida costruirai passo passo la strada più breve: la funzione BlueGrays IoT dell'app BlueGrays. Il codice te lo prepara Ohmi. Tu devi solo montare il circuito e caricare il codice sull'ESP32 con l'Arduino IDE. La scheda si collega al server BlueGrays con una connessione cifrata, quindi telefono e scheda non devono stare sulla stessa rete. Puoi accendere la lampada di casa anche dal lavoro, con i dati mobili. Prima realizzerai un interruttore per lampada con un relè. Poi aggiungerai un DHT22 e porterai sul telefono temperatura e umidità come valori in tempo reale e grafici. In fondo all'articolo trovi anche un confronto con gli altri metodi e una tabella con le soluzioni agli errori più frequenti.

5 modi per controllare l'ESP32 dallo smartphone

• Web server locale: l'ESP32 serve una pagina web e tu apri l'indirizzo IP della scheda dal browser del telefono. Non serve nessun account, ma di norma è raggiungibile solo dalla stessa rete Wi-Fi. Tutti i dettagli nell'articolo ESP32 Async Web Server.
• Bluetooth Classic e BLE: non servono internet né router, il telefono si collega direttamente alla scheda. In ambienti interni la portata è in genere di circa 10 metri. Abbiamo spiegato entrambi i tipi nella guida ESP32 Bluetooth.
• Bot Telegram: invii comandi alla scheda tramite messaggi e ricevi notifiche dalla scheda. Funziona anche fuori casa, ma non offre una dashboard con grafici o slider. Per la configurazione puoi leggere l'articolo ESP32 Telegram Bot.
• Dashboard cloud (Blynk, Arduino IoT Cloud): definisci template e variabili nella console web, scrivi il codice da solo e progetti da solo la dashboard sul telefono. È una strada flessibile, ma devi imparare diverse schermate e concetti. Per Blynk è pronta la Guida Blynk ESP32.
• BlueGrays IoT: nell'app scegli uno degli 8 template pronti. Ohmi prepara il codice con le tue impostazioni dei pin e la tua chiave del dispositivo. Interruttori, slider, selettore colore e grafici compaiono sul telefono in automatico in base al template. Non devi progettare una dashboard né installare un server.

Cosa serve: componenti e software

Come funziona il controllo dell'ESP32 tramite app?

In BlueGrays IoT il telefono e l'ESP32 non si collegano direttamente tra loro. All'accensione la scheda si connette prima alla rete Wi-Fi di casa a 2,4 GHz. Poi apre una connessione WebSocket cifrata (TLS) verso il server BlueGrays sulla porta 443 e la mantiene sempre aperta. Anche l'app sul telefono si collega allo stesso server. Quando tocchi l'interruttore della lampada, il comando va dal telefono al server e dal server alla scheda. Dato che la connessione è già aperta, il comando arriva senza attese. Il valore di temperatura inviato dalla scheda segue lo stesso percorso in senso inverso. La 443 è la stessa porta usata dai siti web. Per questo non devi configurare il port forwarding sul router, installare un tuo server o conoscere l'indirizzo IP della scheda.

Ciò che identifica la scheda presso il server è la chiave del dispositivo. È una stringa segreta che inizia con bgd_, generata dall'app quando crea il dispositivo. La scheda invia la chiave nell'intestazione della connessione quando la apre. Così il server inoltra alla scheda giusta i comandi che arrivano dal telefono. La chiave non viene stampata nel Monitor seriale. Se la connessione cade, la libreria BlueGraysIoT riprova da sola a intervalli crescenti. I valori misurati mentre era offline li invia appena si ricollega, e quando torna la corrente ripristina l'ultimo stato degli interruttori. Basta che scheda e telefono abbiano accesso a internet: la scheda può stare sul Wi-Fi di casa e il telefono in un'altra città con i dati mobili.

Circuito: collegare il modulo relè all'ESP32

Nei template Lampada con relè e Stazione ambiente i pin predefiniti sono questi: il pin IN del relè va a GPIO26, il pin dati del DHT22 a GPIO4. Puoi cambiarli al passo 3 della configurazione. Controlla la piedinatura della tua scheda con lo strumento Pinout. Su alcune schede il pin a 5 V è marcato VIN, su altre 5V.

Configurare BlueGrays IoT: i 5 passi nell'app

Nell'app segui il percorso Officina › I miei dispositivi › Aggiungi nuovo dispositivo. In alto vedrai un contatore come "Passo 1 di 5". I primi tre passi si fanno sul telefono, il quarto sul computer e il quinto di nuovo sul telefono.

1. Scheda e template: alla domanda "Quale scheda hai?" scegli ESP32, alla domanda "Cosa deve fare?" seleziona uno degli 8 template. Per la prima prova "Lampada con relè" o la "Stazione ambiente" con sensore sono un ottimo punto di partenza. Dai al dispositivo un nome facile da riconoscere, come "Lampada soggiorno".
2. Componenti e circuito: l'elenco "Prepara i componenti" mostra i pezzi richiesti dal template. Lo schema "Collega i cavi" indica quale terminale va su quale pin. Nei template con relè vedrai l'avviso "Se lavorerai con i 220 V, fallo con qualcuno esperto. Prova prima con un LED."
3. Wi-Fi e codice: inserisci nome e password della rete Wi-Fi. Il nome della rete deve essere identico e appartenere alla banda a 2,4 GHz. Se vuoi, nella sezione "Pin di collegamento" sostituisci GPIO26 e GPIO4 con altri pin. Poi premi il pulsante "Crea il dispositivo e prepara il codice". Ohmi prepara il codice con la tua chiave del dispositivo; trasferiscilo al computer con "Copia codice" o "Condividi".
4. Carica con l'Arduino IDE: carichi il codice sull'ESP32. I sotto-passi dell'app li spieghiamo uno per uno nella prossima sezione.
5. Connessione: la schermata "In attesa della scheda" avanza da sola nel momento in cui la scheda si collega al server.

Passi 4 e 5: caricare il codice e verificare la connessione

1. Se non hai l'Arduino IDE, installalo. I passaggi sono nell'articolo Installare l'Arduino IDE.
2. In Gestore schede cerca "esp32" e installa il pacchetto esp32 di Espressif. Serve la versione 3.x di questo pacchetto; se hai la vecchia 2.x, aggiornala. L'installazione del pacchetto è spiegata anche nell'articolo Che cos'è l'ESP32?.
3. Collega la scheda con un cavo USB che trasmetta dati. Dal menu Strumenti › Scheda scegli ESP32 Dev Module (o il modello della tua scheda), dal menu Strumenti › Porta la porta appena comparsa. Se la porta non compare, cambia cavo. Poi installa il driver CP210x o CH340 in base al chip USB della tua scheda.
4. In Gestore librerie cerca BlueGraysIoT e premi Installa. Quando ti chiede delle dipendenze, scegli "Installa tutto": così vengono installate anche WebSockets, ArduinoJson e DHT sensor library. Se ti blocchi, consulta la guida Aggiungere una libreria Arduino.
5. Apri un nuovo sketch, cancella il contenuto, incolla il codice copiato dall'app e premi Carica. Se nella finestra in basso resta bloccato su "Connecting…", tieni premuto il pulsante BOOT sulla scheda. Rilascialo quando iniziano a comparire le percentuali di scrittura.
6. Apri il Monitor seriale e imposta la velocità a 115200. Dovresti vedere prima "Wi-Fi connected" e dopo qualche secondo la riga "BlueGrays IoT: connected".

Appena nel monitor seriale compare la scritta di connessione, la schermata "In attesa della scheda" sul telefono passa a "Connesso: i valori ora arrivano in tempo reale." Ora tocca l'interruttore della lampada: dovresti sentire il clic del relè o vedere il LED accendersi. Se la scheda non si collega entro 2 minuti, l'app ti chiede di controllare tre cose. Hai scelto la rete a 2,4 GHz? Nel monitor seriale compare "Wi-Fi connected"? Maiuscole e minuscole della password sono corrette? Se la prima riga non arriva mai, il problema è sul lato Wi-Fi. In quel caso ti aiuta la checklist dell'articolo ESP32 non si connette al WiFi.

Primo codice: accendere e spegnere una lampada dallo smartphone

Il codice che l'app prepara per il template "Lampada con relè" è simile a quello qui sotto. Le tre righe in alto arrivano già compilate con la tua chiave del dispositivo, il nome della rete e la password; qui sono mostrate con dei segnaposto. Il resto del codice è breve: una funzione per il relè, la definizione di un interruttore e un loop() di una sola riga.

1/*
2 * Salon lambası · BlueGrays IoT
3 * BlueGrays · bluegrays.com
4 * Bu kodu paylaşma: içinde cihaz anahtarın ve Wi-Fi şifren var.
5 * Do not share this code: it contains your device key and Wi-Fi password.
6 */
7
8#include <BlueGraysIoT.h>
9
10// Uygulama bu üç satırı senin bilgilerinle doldurur / The app fills these three lines with your details
11const char *DEVICE_KEY = "bgd_UYGULAMADAKI_ANAHTARIN";
12const char *WIFI_NAME = "EV_AGI_2_4_GHZ";
13const char *WIFI_PASSWORD = "WIFI_SIFREN";
14
15BlueGraysIoT bg(DEVICE_KEY);
16
17const int RELAY_PIN = 26;
18const bool RELAY_ACTIVE_LOW = true;  // çoğu röle modülü LOW ile çeker / most relay modules switch on LOW
19void setRelay(bool on) { digitalWrite(RELAY_PIN, (on != RELAY_ACTIVE_LOW) ? HIGH : LOW); }
20
21void setup() {
22  Serial.begin(115200);
23  pinMode(RELAY_PIN, OUTPUT);
24  setRelay(false);                  // açılışta lamba kapalı / lamp off at power-up
25  bg.onSwitch("lamba", setRelay);   // uygulamadaki "Lamba" anahtarı / the "Lamba" switch in the app
26  bg.setDebug(Serial);              // durum mesajları Seri Port Ekranı'na / status messages to the Serial Monitor
27  bg.setLanguage(BG_LANG_TR);
28  bg.begin(WIFI_NAME, WIFI_PASSWORD);
29}
30
31void loop() {
32  bg.loop();  // burada uzun delay() kullanma / avoid long delay() calls here
33}
34

Aggiungere un sensore: Stazione ambiente (relè + DHT22)

Ora aggiungiamo un DHT22 alla stessa scheda e inviamo dati al telefono. Se nell'app scegli il template "Stazione ambiente", accanto all'interruttore della lampada compaiono anche i valori di temperatura (°C) e umidità (%) con i rispettivi grafici. Il DHT22 misura da -40 a 80 °C con una precisione di circa ±0,5 °C. L'umidità la misura nell'intervallo 0–100% e si può leggere al massimo una volta ogni 2 secondi. Collega il pin dati a GPIO4, VCC a 3V3 e GND a GND. Il funzionamento della famiglia DHT è spiegato a confronto nell'articolo Sensore di temperatura e umidità DHT11.

1/*
2 * Oda istasyonu · BlueGrays IoT
3 * BlueGrays · bluegrays.com
4 * Bu kodu paylaşma: içinde cihaz anahtarın ve Wi-Fi şifren var.
5 * Do not share this code: it contains your device key and Wi-Fi password.
6 */
7
8#include <BlueGraysIoT.h>
9#include <DHT.h>
10
11const char *DEVICE_KEY = "bgd_UYGULAMADAKI_ANAHTARIN";
12const char *WIFI_NAME = "EV_AGI_2_4_GHZ";
13const char *WIFI_PASSWORD = "WIFI_SIFREN";
14
15BlueGraysIoT bg(DEVICE_KEY);
16
17const int RELAY_PIN = 26;
18const bool RELAY_ACTIVE_LOW = true;  // çoğu röle modülü LOW ile çeker / most relay modules switch on LOW
19void setRelay(bool on) { digitalWrite(RELAY_PIN, (on != RELAY_ACTIVE_LOW) ? HIGH : LOW); }
20DHT dht(4, DHT22);                   // DHT22 veri ucu GPIO4 / DHT22 data on GPIO4
21unsigned long lastReadMs = 0;
22
23void setup() {
24  Serial.begin(115200);
25  pinMode(RELAY_PIN, OUTPUT);
26  setRelay(false);
27  bg.onSwitch("lamba", setRelay);
28  dht.begin();
29  bg.setDeadband("sicaklik", 0.1);   // 0,1 °C değişmeden gönderme / send only after a 0.1 °C change
30  bg.setDeadband("nem", 1.0);        // %1 değişmeden gönderme / send only after a 1 % change
31  bg.setDebug(Serial);
32  bg.setLanguage(BG_LANG_TR);
33  bg.begin(WIFI_NAME, WIFI_PASSWORD);
34}
35
36void loop() {
37  bg.loop();  // burada uzun delay() kullanma / avoid long delay() calls here
38  if (millis() - lastReadMs >= 2000) {  // DHT22 en fazla 2 saniyede bir okunur / DHT22 reads at most every 2 s
39    lastReadMs = millis();
40    bg.send("sicaklik", dht.readTemperature());
41    bg.send("nem", dht.readHumidity());
42  }
43}
44

La parte del relè è uguale al primo codice; le novità sono tre. La prima è la riga bg.send("sicaklik", dht.readTemperature()): invia un valore dalla scheda all'app e il primo parametro è il nome della variabile nell'app. La seconda è la riga bg.setDeadband("sicaklik", 0.1). Imposta la variazione minima: la temperatura non viene reinviata finché non cambia di 0,1 °C, per l'umidità la soglia è dell'1%. La terza è il controllo millis() - lastReadMs >= 2000 dentro loop. Il sensore viene letto ogni 2 secondi, ma nel frattempo bg.loop() continua a girare senza attese. La libreria invia il valore solo quando cambia e non supera la frequenza del piano. Per la stessa variabile, tra due invii passa almeno 1 secondo nel piano gratuito e almeno 0,2 secondi con Premium. Questi limiti sono controllati dal server; cambiare i numeri nel codice non li aggira. Se la temperatura della stanza resta per minuti a 23,4 °C, la scheda non invia nuovi valori; quando passa a 23,5 °C parte un solo messaggio. Se un cavo è allentato o manca la pull-up, la lettura non è valida (NaN). Se il valore non arriva, controlla prima il collegamento di GPIO4 e l'alimentazione.

Cosa vedi sul telefono?

• Stato: in alto nella schermata del dispositivo compare Online o Offline, e sotto l'indicazione "Ultimo dato … fa". È il primo posto dove capisci se la scheda è davvero connessa.
• Controlli: nel template lampada compare un interruttore on/off. Nel template striscia RGB arrivano selettore colore, luminosità 0–100% e scelta dell'effetto. Nel template tenda c'è uno slider per l'angolo da 0 a 180°.
• Valori in tempo reale e grafici: ci sono gli intervalli 1 h, 24 h, 7 giorni e 30 giorni. Nelle viste a 7 e 30 giorni viene mostrata la media oraria. Sul grafico compaiono Minimo, Massimo e Ultimo valore. Finché la scheda resta connessa, ogni minuto si aggiunge un nuovo punto.
• Codice e chiave: qui puoi rivedere in qualsiasi momento il codice completo, la chiave del dispositivo e i dati Wi-Fi. Se devi riprogrammare la scheda, copia il codice da qui.
• Rigenera chiave: usalo se qualcuno ha visto la tua chiave o se hai cambiato scheda. La vecchia chiave diventa subito non valida; basta caricare una volta il nuovo codice sulla scheda.
• Rimuovi dispositivo: il dispositivo e lo storico dei grafici vengono cancellati e ti viene restituito lo slot del dispositivo.

Gratuito e Premium: quanto puoi usarlo?

Il primo dispositivo è gratuito. Per realizzare un interruttore per lampada o una stazione ambiente con un ESP32 non ti serve altro. Nella Stazione ambiente temperatura e umidità sono due variabili distinte. Nel piano gratuito arrivano sul telefono i valori in tempo reale di entrambe, ma lo storico dei grafici viene conservato per una sola variabile. Le differenze tra i piani sono qui sotto; i dettagli nell'articolo Cosa sblocca BlueGrays Premium?.

Confronto con gli altri metodi

La scelta giusta dipende dalle tue esigenze. Se non hai proprio internet, Bluetooth o web server locale sono l'unica opzione. BlueGrays IoT, Blynk e Arduino IoT Cloud richiedono che scheda e telefono abbiano accesso a internet. Se vuoi configurazioni flessibili, come progettare l'interfaccia da zero o collegarti a Home Assistant, ESP32 MQTT e le dashboard cloud offrono più possibilità. In BlueGrays IoT i template pronti sono 8. In compenso schema del circuito, elenco componenti, codice e interfaccia del telefono arrivano pronti e coerenti tra loro. Mentre impari, le probabilità di sbagliare qualcosa si riducono.

Sicurezza: chiave, password Wi-Fi e codice

• La chiave del dispositivo è l'identità della scheda. Chi conosce la chiave che inizia con bgd_ può spacciarsi per la tua scheda. Per questo non condividerla in screenshot, forum o gruppi di messaggistica.
• La password Wi-Fi resta sul telefono. La password non viene inviata al server; il nome della rete invece viene salvato con il dispositivo per poterti mostrare di nuovo il codice. Nel codice caricato sulla scheda, però, la password è scritta in chiaro.
• Non condividere il codice. Come avvisa anche l'app, nel codice ci sono la tua chiave del dispositivo e la password Wi-Fi. Se vuoi mostrarlo su un forum per chiedere aiuto, cancella prima le righe DEVICE_KEY, WIFI_NAME e WIFI_PASSWORD.
• La connessione è cifrata. Il traffico tra scheda e server passa in TLS sulla porta 443: chi è sulla stessa rete non può leggere i comandi.
• Se hai dubbi, rigenera la chiave. Il pulsante Rigenera chiave invalida subito la vecchia chiave. Anche se dai la scheda a qualcun altro, rigenera la chiave o rimuovi il dispositivo.

Errori comuni e soluzioni

Idee per progetti IoT con l'ESP32

• Interruttore per lampada: la versione completa del primo circuito di questo articolo è nel progetto Interruttore IoT per lampada con ESP32 (relè). Il progetto include schema elettrico ed elenco componenti.
• Stazione ambiente: relè e DHT22 insieme, con grafico della temperatura: Stazione ambiente IoT con ESP32 (relè + DHT22).
• Irrigazione piante: il sensore di umidità del terreno va su GPIO34 (un pin ADC1). Quando l'umidità scende sotto lo slider Soglia di irrigazione sul telefono la pompa si accende, e si spegne quando sale di 10 punti sopra la soglia. Pagina del progetto: Irrigazione IoT con ESP32 (sensore di umidità + pompa). Per la calibrazione del sensore leggi anche l'articolo Sensore di umidità del terreno.
• Striscia LED RGB: scegli dal telefono colore, luminosità ed effetto (Fisso, Arcobaleno, Respiro, Lampeggio) della striscia WS2812B da 30 LED su GPIO13: Striscia LED RGB IoT con ESP32 (WS2812B). 30 LED al bianco pieno possono assorbire circa 1,8 A; alimenta la striscia da una sorgente a 5 V separata. Dettagli nell'articolo WS2812B NeoPixel.
• Apritenda: ruota il servo SG90 su GPIO18 con uno slider da 0 a 180°: Apritenda IoT con ESP32 (servo SG90). Alimenta anche il servo da una sorgente a 5 V separata e collega insieme le GND.
• Altri template: i progetti sensore porta, contatore di movimenti e temperatura e umidità sono spiegati con il Pico W. Nell'app puoi scegliere questi template anche per l'ESP32.

Una volta creato il percorso tra scheda, server e telefono, aggiungere un nuovo dispositivo ti richiede pochi minuti. Inizia con l'interruttore per la lampada, poi guarda i dati del DHT22 arrivare sul telefono, e quindi passa a progetti più grandi come l'irrigazione o la tenda. Nell'app BlueGrays trovi questi progetti IoT con ESP32 passo passo, con schema elettrico e codice. Puoi usare il filtro progetti IoT in Esplora e, con la scheda "Configura come dispositivo IoT" nella pagina del progetto, collegare lo stesso circuito direttamente al tuo telefono.