I den här ESP32-artikeln kommer vi att utforska hur vi kan ansluta ett ESP32-kort med en åtkomstpunkt och designa dess webbserver. Med hjälp av den webbservern kommer vi att styra lysdioder och AC-apparater med hjälp av en relämodul.
Innehåll:
- ESP32 webbserver
- Hur man skapar ESP32-webbserver med Arduino IDE
- ESP32 webbserverkod
- ESP32 webbserver IP-adress
- Styra lysdioder med ESP32 webbserver
- Skrivbordsgränssnitt
- Mobilt gränssnitt
- Styra AC-apparater med ESP32 webbserver
- Slutsats
1. ESP32 webbserver
Webbservern har ett speciellt program som kan bearbeta och skicka webbsidor till webbklienter. För att öppna en webbplats använder vi en webbläsare. Denna webbläsare kallas även en webbklient. Webbplatsen du vill se lagras på en annan dator som kallas webbserver.
För att prata med varandra använder webbservern och webbklienten ett gemensamt språk som kallas HTTP. Så här fungerar det: webbklienten ber webbservern om en webbsida med hjälp av en HTTP-förfrågan. Webbservern skickar tillbaka webbsidan som efterfrågas. Om webbsidan inte finns kommer du att se ett felmeddelande.
I ESP32 kan vi designa en webbserver, eftersom ESP32 inte bara kan ansluta till andra enheter över ett nätverk utan också kan skapa sin webbserver och svara på mottagna förfrågningar. Detta är allt möjligt eftersom ESP32 kan arbeta i tre olika lägen:
- Station
- Åtkomstpunkt
- Både station och accesspunkt
Du kan kolla in den här artikeln för att få en inblick i alla tre lägena för ESP32:
Hur man ställer in en ESP32 Access Point (AP) med Arduino IDE
2. Hur man skapar ESP32 webbserver med Arduino IDE
För att skapa en ESP32-webbserver med Arduino IDE kan du ansluta ESP32 till en åtkomstpunkt och generera en IP-adress för webbservern. Du kan använda lite HTML och CSS för att designa ditt servergränssnitt.
När du förstår att ESP32-åtkomstpunkten fungerar kan du enkelt designa en ESP32-webbserver med Arduino IDE-koden. ESP32-webbserverkoden använder ESP32 Wi-Fi-biblioteket. Detta gör vårt arbete enklare, eftersom detta bibliotek innehåller alla viktiga funktioner som behövs för att ansluta ESP32 till en accesspunkt.
Låt oss designa en ESP32-webbserver med Arduino IDE-kod.
3. ESP32 webbserverkod
ESP32-webbserverkoden involverar ESP32-anslutningen med åtkomstpunkten och att få serverns IP-adress. När du har fått IP-adressen måste du ansluta till samma nätverk för att komma åt ESP32-webbservern. Därifrån kan du styra lysdioder och andra enheter.
Öppna Arduino IDE och anslut ditt ESP32-kort med det:
Installation av ESP32-kortet i Arduino IDE
När ESP32-kortet är anslutet laddar du upp följande kod till ditt kort.
/**************Linuxhint.com
ESP32 webbserver för att styra lysdioder
**************/
// Importera biblioteket för Wi-Fi-anslutning
#include
// Ange ditt Wi-Fi-namn och lösenord
konst röding * ssid = 'ESP32' ;
konst röding * lösenord = '123456789' ;
// Välj portnummer för webbservern
WiFiServer server ( 80 ) ;
// Skapa en variabel för att lagra webbförfrågan
Stränghuvud;
// Skapa variabler för att lagra status för utgångarna
String output26State = 'AV' ;
String output27State = 'AV' ;
// Tilldela utgångsstiften till variablerna
const int output26 = 26 ;
const int output27 = 27 ;
unsigned long currentTime = millis ( ) ;
unsigned long previousTime = 0 ;
// Välj den tid begränsa för webbförfrågan i millisekunder
const lång timeoutTime = 2000 ;
ogiltig installation ( ) {
Serial.begin ( 115200 ) ;
// Ställ in utgångsstiften som utgångar
pinMode ( utgång26, OUTPUT ) ;
pinMode ( utgång27, OUTPUT ) ;
// Stäng av utgångarna
digitalWrite ( output26, LÅG ) ;
digitalWrite ( output27, LÅG ) ;
// Anslut till Wi-Fi-nätverket
Serial.print ( 'Ansluter till' ) ;
Serial.println ( ssid ) ;
WiFi.start ( ssid, lösenord ) ;
// Vänta fram tills anslutningen upprättas
medan ( WiFi.status ( ) ! = WL_CONNECTED ) {
dröjsmål ( 500 ) ;
Serial.print ( '.' ) ;
}
Serial.println ( '' ) ;
Serial.println ( 'WiFi ansluten.' ) ;
Serial.println ( 'IP-adress: ' ) ;
Serial.println ( WiFi.localIP ( ) ) ;
server.begin ( ) ;
}
tom slinga ( ) {
WiFiClient-klient = server.tillgänglig ( ) ; // Kolla upp för nya kunder
om ( klient ) { // Om en klient är ansluten,
aktuellTid = millis ( ) ;
föregående Tid = aktuell Tid;
Serial.println ( 'Ny klient.' ) ; // Meddela den seriella porten
String currentLine = '' ; // Skapa en sträng för att lagra klientdata
medan ( klient.ansluten ( ) && aktuellTid - föregående Tid = 0 ) {
Serial.println ( 'GPIO 26 på' ) ;
output26State = 'PÅ' ;
digitalWrite ( output26, HÖG ) ;
} annan om ( header.indexOf ( 'FÅ /26/av' ) > = 0 ) {
Serial.println ( 'GPIO 26 av' ) ;
output26State = 'AV' ;
digitalWrite ( output26, LÅG ) ;
} annan om ( header.indexOf ( 'GET /27/on' ) > = 0 ) {
Serial.println ( 'GPIO 27 på' ) ;
output27State = 'PÅ' ;
digitalWrite ( output27, HÖG ) ;
} annan om ( header.indexOf ( 'FÅ /27/av' ) > = 0 ) {
Serial.println ( 'GPIO 27 av' ) ;
output27State = 'AV' ;
digitalWrite ( output27, LÅG ) ;
}
client.println ( '' ) ;
client.println ( '' ) ;
client.println ( '
// CSS för att styla knapparna
client.println ( '