5.11 Web-gestuurde slimme boerderij
5.11.0 Verbind het ESP32-bord met het netwerk
Het ESP32-bord is uitgerust met Wi-Fi (2.4G) en Bluetooth (4.2), waardoor het eenvoudig verbinding kan maken met Wi-Fi en kan communiceren met andere apparaten in het netwerk.
Wat moet je voorbereiden:
-Een 2.4 GHz WiFi (dit kan een mobiele hotspot of een router zijn)
-De WIFI-naam en het wachtwoord
-Een telefoon/IPAD/computer die verbinding kan maken met dezelfde WiFi.
Arduino IDE biedt u het bibliotheekbestand <WiFi.h>, dat Wi-Fi-configuraties en ESP32 Wi-Fi-netwerkbewaking ondersteunt.
A. Basisstationmodus (STA of Wi-Fi client-side modus): In deze modus maakt ESP32 verbinding met de Wi-Fi-hotspot (AP).
B. AP-modus (Soft-AP of Wi-Fi hotspot-modus): In deze modus maken andere Wi-Fi-apparaten verbinding met ESP32.
C. AP-STA-modus: In deze modus is ESP32 zowel een Wi-Fi-hotspot als een Wi-Fi-apparaat dat verbinding maakt met een andere Wi-Fi-hotspot.
D. Deze modi zijn compatibel met meerdere veilige modi, zoals WPA, WPA2 en WEP.
E. Het is in staat om Wi-Fi-hotspots te scannen, inclusief actieve en passieve scans.
F. Het ondersteunt de promiscuous-modus om IEEE802.11 Wi-Fi-pakketten te monitoren.
Voor wifi-details, zie:
https://docs.espressif.com/projects/esp-idf/en/latest/esp32/api-reference/network/esp_wifi.html
Officiële website van ESPRESSIF: https://www.espressif.com.cn/en/home
Open de code 5.11.0Connect-the-ESP32-to-the-Network met Arduino IDE.
#include <WiFi.h>
const char* ssid = "your_SSID";
const char* password = "your_PASSWORD";
void setup() {
Serial.begin(9600);
//Initialiseer Wifi
WiFi.begin(ssid, password);
//Scan naar wifi. Als de verbinding mislukt, blijf dan verbinden en voer de "while" lus uit
while (WiFi.status() != WL_CONNECTED) {
delay(1000);
Serial.println("Verbinden met WiFi...");
}
//Verbonden. Print het IP-adres
Serial.println("Verbonden met WiFi");
Serial.println(WiFi.localIP());
}
void loop() {
}
Verander your_SSID in de code naar de naam van je wifi, en your_PASSWORD naar het wifi-wachtwoord
const char* ssid = "your_SSID";
const char* password = "your_PASSWORD";
Kies het ESP32 Dev Module bord en de COM poort, en upload de code.

Testresultaat:
Upload de code, en het bord zal verbinding maken met het Wi-Fi-netwerk en het IP-adres op de seriële monitor afdrukken.

5.11.1 Een website opzetten - HELLOWORLD
Zolang er verbinding is met Wi-Fi, kan de Webserver-bibliotheek van ESP32 webpagina’s leveren. In het volgende voorbeeldcode zetten we een eenvoudige website op om “Hello, World!” te tonen.
Open de code 5.11.1WiFi-HTML-HELLOWORLD met Arduino IDE.
#include <WiFi.h>
#include <WebServer.h>
const char* ssid = "your_SSID";
const char* password = "your_PASSWORD";
WebServer server(80); //Stel de serverpoort in op 80. Voer de website in via het IP-adres in plaats van het poortnummer.
//Initialiseer de website
void handleRoot() {
//Wordt gebruikt om HTTP naar de client-side te sturen voor respons, het verzenden van 200 betekent succes.
server.send(200, "text/html", "<h1>Hello, World!</h1>");
}
void setup() {
Serial.begin(9600);
//Initialiseer wifi
WiFi.begin(ssid, password);
//Scan naar wifi. Als de verbinding mislukt, blijf dan verbinden en voer de "while" lus uit
while (WiFi.status() != WL_CONNECTED) {
delay(1000);
Serial.println("Verbinden met WiFi...");
}
//Verbonden. Print het IP-adres
Serial.println("Verbonden met WiFi");
Serial.println(WiFi.localIP());
server.on("/", handleRoot);
//Start server
server.begin();
Serial.println("Webserver gestart");
}
void loop() {
server.handleClient();
}
Verander your_SSID in de code naar de naam van je wifi, en your_PASSWORD naar het wifi-wachtwoord. Upload vervolgens de code.
const char* ssid = "your_SSID";
const char* password = "your_PASSWORD";
Kies het ESP32 Dev Module bord en de COM poort, en upload de code.

Testresultaat:
In deze voorbeeldcode zetten we een webserver op met de WebServer-bibliotheek op ESP32. De functie handleRoot() vraagt om verwerking in het rootpad en stuurt een HTML-antwoord van “Hello, World!” naar de client-side. Vervolgens stelt setup() de rootroute in, en server.begin() start de webserver.
Klik op de seriële monitor om het IP-adres te bekijken:

OPMERKING: Wanneer pc, mobiele telefoons en ESP32-bord met één netwerk zijn verbonden, kunt u deze website tegelijkertijd bezoeken op pc en telefoons.
Open het IP-adres in de pc-browser of telefoonbrowser:

Opmerking: Vereist 2.4 GHz WIFI, geen 5G. De pc of mobiele telefoon die toegang heeft tot het IP-adres moet verbonden zijn met dezelfde WIFI als het ESP32-bord.

5.11.2 Web-gestuurde slimme boerderij

Open de code 5.11.2WiFi-HTML-Smart-Farm met Arduino IDE.
#include <Arduino.h>
#include <WiFi.h>
#include <WebServer.h>
#include <LiquidCrystal_I2C.h>
#include <dht11.h>
#include <ESP32Servo.h>
// Pin definities
#define DHT11PIN 17 // Pin van temperatuur- en vochtigheidssensor
#define LEDPIN 27 // LED-pin
#define SERVOPIN 26 // Servo-pin
#define FANPIN1 19 // Ventilator IN+ pin
#define FANPIN2 18 // Ventilator IN- pin
#define STEAMPIN 35 // Stoom sensor pin
#define LIGHTPIN 34 // Lichtsensor pin
#define SOILHUMIDITYPIN 32 // Bodemvochtigheidssensor pin
#define WATERLEVELPIN 33 // Waterniveau sensor pin
#define RELAYPIN 25 // Relais pin
// Initialiseer sensoren en componenten
dht11 DHT11;
LiquidCrystal_I2C lcd(0x27, 16, 2);
Servo myservo; // Servo-object om de servo te bedienen
// WiFi-gegevens
const char *SSID = "your_SSID";
const char *PASS = "your_PASSWORD";
// Maak WebServer object
WebServer server(80);
// Variabelen voor het regelen van statussen
static int A = 0;
static int B = 0;
static int C = 0;
// HTML Webpagina inhoud
const char index_html[] PROGMEM = R"rawliteral(
<!DOCTYPE HTML>
<html>
<title>TEST HTML ESP32</title>
<head>
<meta charset="utf-8">
<style>
html, body {
margin: 0;
width: 100%;
height: 100%;
display: flex;
justify-content: center;
align-items: center;
flex-direction: column;
background-color: #f0f0f0;
}
/* De hoofdknopcontainer */
.btn {
display: flex;
justify-content: center; /* Centreer de knoppen */
gap: 10px; /* Voeg ruimte toe tussen knoppen */
width: 320px; /* Stel breedte in om ervoor te zorgen dat knoppen strak verpakt zijn */
flex-wrap: wrap; /* Sta toe dat knoppen naar nieuwe regels springen indien nodig */
margin-bottom: 20px; /* Ruimte tussen knoppen en gegevensweergave */
}
/* Knopstijl */
.btn button {
width: 70px; /* Stel breedte in voor knoppen */
height: 70px; /* Stel hoogte in voor knoppen */
border: none;
font-size: 16px;
color: #fff;
background-color: #89e689;
cursor: pointer;
}
.btn button:active {
top: 2px;
}
/* Het gegevensweergavegebied */
#dht {
text-align: center; /* Centreer de tekst */
width: 320px; /* Zelfde breedte als de knopcontainer */
color: #fff;
background-color: #47a047;
font-size: 18px; /* Pas lettergrootte aan voor leesbaarheid */
padding: 10px;
border-radius: 10px; /* Afgeronde hoeken */
box-sizing: border-box;
margin-bottom: 10px; /* Voeg ruimte toe tussen de gegevensweergave en knoppen */
}
</style>
</head>
<body>
<!-- Weergavegebied voor sensorgegevens -->
<div id="dht"></div>
<!-- Knoppenrij -->
<div class="btn">
<button id="btn-led" onclick="setLED()">LED</button>
<button id="btn-fan" onclick="setFan()">Fan</button>
<button id="btn-feeding" onclick="setFeeding()">Feeding</button>
<button id="btn-watering" onclick="setWatering()">Watering</button>
</div>
<script>
function setLED() {
var payload = "A";
var xhr = new XMLHttpRequest();
xhr.open("GET", "/set?value=" + payload, true);
xhr.send();
}
function setFan() {
var payload = "B";
var xhr = new XMLHttpRequest();
xhr.open("GET", "/set?value=" + payload, true);
xhr.send();
}
function setFeeding() {
var payload = "C";
var xhr = new XMLHttpRequest();
xhr.open("GET", "/set?value=" + payload, true);
xhr.send();
}
function setWatering() {
var payload = "D";
var xhr = new XMLHttpRequest();
xhr.open("GET", "/set?value=" + payload, true);
xhr.send();
}
setInterval(function () {
var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function () {
if (this.readyState == 4 && this.status == 200) {
document.getElementById("dht").innerHTML = this.responseText;
}
};
xhttp.open("GET", "/dht", true);
xhttp.send();
}, 1000)
</script>
</body>
</html>
)rawliteral";
// Functie om sensorgegevens samen te voegen in HTML-formaat
String Merge_Data(void) {
String dataBuffer;
String Humidity;
String Temperature;
String Steam;
String Light;
String SoilHumidity;
String WaterLevel;
// Lees DHT11-sensor
int chk = DHT11.read(DHT11PIN);
// Lees andere sensoren
Steam = String(analogRead(STEAMPIN) / 4095.0 * 100);
Light = String(analogRead(LIGHTPIN));
int shvalue = analogRead(SOILHUMIDITYPIN) / 4095.0 * 100 * 2.3;
shvalue = shvalue > 100 ? 100 : shvalue;
SoilHumidity = String(shvalue);
int wlvalue = analogRead(WATERLEVELPIN) / 4095.0 * 100 * 2.5;
wlvalue = wlvalue > 100 ? 100 : wlvalue;
WaterLevel = String(wlvalue);
Temperature = String(DHT11.temperature);
Humidity = String(DHT11.humidity);
// Construeer HTML-inhoud
dataBuffer += "<p>";
dataBuffer += "<h1>Sensor Data</h1>";
dataBuffer += "<b>Temperatuur:</b><b>" + Temperature + "</b><b>℃</b><br/>";
dataBuffer += "<b>Vochtigheid:</b><b>" + Humidity + "</b><b>%rh</b><br/>";
dataBuffer += "<b>Waterniveau:</b><b>" + WaterLevel + "</b><b>%</b><br/>";
dataBuffer += "<b>Stoom:</b><b>" + Steam + "</b><b>%</b><br/>";
dataBuffer += "<b>Licht:</b><b>" + Light + "</b><br/>";
dataBuffer += "<b>Bodemvochtigheid:</b><b>" + SoilHumidity + "</b><b>%</b><br/>";
dataBuffer += "</p>";
return dataBuffer;
}
// Configureer acties op basis van ontvangen HTTP-verzoeken
void Config_Callback() {
if (server.hasArg("value")) {
String HTTP_Payload = server.arg("value");
Serial.printf("[%lu]%s\r\n", millis(), HTTP_Payload.c_str());
if (HTTP_Payload == "A") {
if (A) {
digitalWrite(LEDPIN, LOW);
A = 0;
} else {
digitalWrite(LEDPIN, HIGH);
A = 1;
}
}
if (HTTP_Payload == "B") {
if (B) {
digitalWrite(FANPIN1, LOW);
digitalWrite(FANPIN2, LOW);
B = 0;
} else {
delay(500);
digitalWrite(FANPIN1, HIGH);
digitalWrite(FANPIN2, LOW);
delay(500);
B = 1;
}
}
if (HTTP_Payload == "C") {
if (C) {
myservo.write(80);
delay(500);
C = 0;
} else {
C = 1;
myservo.write(180);
delay(500);
}
}
if (HTTP_Payload == "D") {
digitalWrite(RELAYPIN, HIGH);
delay(400);
digitalWrite(RELAYPIN, LOW);
delay(650);
}
}
server.send(200, "text/plain", "OK");
}
// Behandel ongeldige URL-toegang
void notFound() {
server.send(404, "text/plain", "Niet gevonden");
}
void setup() {
Serial.begin(9600);
// Maak verbinding met WiFi
WiFi.begin(SSID, PASS);
while (!WiFi.isConnected()) {
delay(500);
Serial.print(".");
}
Serial.println("WiFi verbonden.");
Serial.println("IP-adres: ");
Serial.println(WiFi.localIP());
// Stel pinnen in
pinMode(LEDPIN, OUTPUT);
pinMode(STEAMPIN, INPUT);
pinMode(LIGHTPIN, INPUT);
pinMode(SOILHUMIDITYPIN, INPUT);
pinMode(WATERLEVELPIN, INPUT);
pinMode(RELAYPIN, OUTPUT);
pinMode(FANPIN1, OUTPUT);
pinMode(FANPIN2, OUTPUT);
delay(1000);
// Koppel servo aan de pin
myservo.attach(SERVOPIN);
myservo.write(180);
// Initialiseer LCD
lcd.init();
lcd.backlight();
lcd.clear();
lcd.setCursor(0, 0);
lcd.print("IP:");
lcd.setCursor(0, 1);
lcd.print(WiFi.localIP());
// Stel serverroutes in
server.on("/", HTTP_GET, []() {
server.send(200, "text/html", index_html);
});
server.on("/dht", HTTP_GET, []() {
server.send(200, "text/plain", Merge_Data().c_str());
});
server.on("/set", HTTP_GET, Config_Callback);
server.onNotFound(notFound);
// Start de server
server.begin();
}
void loop() {
server.handleClient();
}
Wijzig your_SSID in de code naar de naam van uw wifi, en your_PASSWORD naar het wifi-wachtwoord. Upload vervolgens de code.
const char* ssid = "your_SSID";
const char* password = "your_PASSWORD";
Kies het ESP32 Dev Module bord en de COM poort, en upload de code.

Testresultaat:
OPMERKING: Wanneer pc, mobiele telefoons en ESP32-bord met één netwerk zijn verbonden, kunt u deze website tegelijkertijd bezoeken op pc en telefoons.
Bekijk het IP-adres van LCD1602:

Voer het IP-adres in browsers op mobiele telefoons of pc in, u kunt de sensorwaarden bovenaan de pagina zien en de LED, ventilator, voederbak en waterpomp bedienen met de onderstaande knoppen.

Opmerking: Vereist 2,4 GHz WIFI, geen 5G. De pc of mobiele telefoon die toegang heeft tot het IP-adres moet verbonden zijn met dezelfde WIFI als het ESP32-bord.
