Bu ESP32 makalesinde, bir ESP32 kartını bir erişim noktasına nasıl bağlayabileceğimizi ve web sunucusunu nasıl tasarlayabileceğimizi keşfedeceğiz. Bu web sunucusunu kullanarak LED'leri ve AC cihazlarını bir röle modülü yardımıyla kontrol edeceğiz.
İçindekiler:
- ESP32 Web Sunucusu
- Arduino IDE Kullanarak ESP32 Web Sunucusu Nasıl Oluşturulur
- ESP32 Web Sunucusu Kodu
- ESP32 Web Sunucusu IP Adresi
- ESP32 Web Sunucusunu Kullanarak LED'leri Kontrol Etme
- Masaüstü Arayüzü
- Mobil Arayüz
- ESP32 Web Sunucusunu Kullanarak AC Cihazlarını Kontrol Etme
- Çözüm
1.ESP32 Web Sunucusu
Web sunucusu, web sayfalarını web istemcilerine gönderebilen ve işleyebilen özel bir programa sahiptir. Bir web sitesini açmak için bir web tarayıcısı kullanırız. Bu web tarayıcısına web istemcisi de denir. Görmek istediğiniz web sitesi, web sunucusu adı verilen başka bir bilgisayarda depolanır.
Web sunucusu ve web istemcisi birbirleriyle konuşmak için HTTP adı verilen ortak bir dil kullanır. Bu şekilde çalışır: Web istemcisi, bir HTTP isteği kullanarak web sunucusundan bir web sayfası ister. Web sunucusu istenen web sayfasını geri gönderir. Web sayfası mevcut değilse bir hata mesajı göreceksiniz.
ESP32'de bir Web sunucusu tasarlayabiliriz, çünkü ESP32 sadece ağ üzerinden diğer cihazlara bağlanmakla kalmaz aynı zamanda kendi web sunucusunu oluşturup gelen isteklere yanıt verebilir. Bunların hepsi mümkündür çünkü ESP32 üç farklı modda çalışabilir:
- İstasyon
- Erişim noktası
- Hem İstasyon hem de Erişim Noktası
ESP32'nin üç moduna da ilişkin bilgi edinmek için bu makaleye göz atabilirsiniz:
Arduino IDE Kullanarak ESP32 Erişim Noktası (AP) Nasıl Ayarlanır
2. Arduino IDE Kullanarak ESP32 Web Sunucusu Nasıl Oluşturulur
Arduino IDE kullanarak bir ESP32 web sunucusu oluşturmak için ESP32'yi bir Erişim noktasına bağlayabilir ve Web sunucusu için bir IP adresi oluşturabilirsiniz. Sunucu arayüzünüzü tasarlamak için biraz HTML ve CSS uygulayabilirsiniz.
ESP32 erişim noktasının çalışmasını anladıktan sonra Arduino IDE kodunu kullanarak kolayca bir ESP32 web sunucusu tasarlayabilirsiniz. ESP32 web sunucusu kodu, ESP32 Wi-Fi kitaplığını kullanır. Bu kitaplık, ESP32'yi bir erişim noktasına bağlamak için gereken tüm önemli işlevleri içerdiğinden işimizi kolaylaştırır.
Arduino IDE kodunu kullanarak bir ESP32 Web sunucusu tasarlayalım.
3. ESP32 Web Sunucusu Kodu
ESP32 web sunucusu kodu, erişim noktasıyla ESP32 bağlantısını ve sunucunun IP adresini almayı içerir. IP adresini aldıktan sonra ESP32 web sunucusuna erişmek için aynı ağa bağlanmanız gerekir. Buradan LED'leri ve diğer cihazları kontrol edebilirsiniz.
Arduino IDE'yi açın ve ESP32 kartınızı ona bağlayın:
ESP32 Kartını Arduino IDE'ye Takma
ESP32 kartı bağlandıktan sonra aşağıdaki kodu kartınıza yükleyin.
/****************Linuxhint.com
LED'leri Kontrol Etmek İçin ESP32 Web Sunucusu
**************/
// Kitaplığı içe aktar için Wi-Fi bağlantısı
#include
// Wi-Fi adınızı ve şifrenizi girin
sabit karakter * ssid = 'ESP32' ;
sabit karakter * şifre = '123456789' ;
// Bağlantı noktası numarasını seçin için web sunucusu
WiFiSunucu sunucusu ( 80 ) ;
// Web isteğini depolamak için bir değişken oluşturun
Dize başlığı;
// Çıkışların durumunu saklamak için değişkenler oluşturun
Dize çıkışı26Durum = 'KAPALI' ;
Dize çıkışı27Durum = 'KAPALI' ;
// Çıkış pinlerini değişkenlere atayın
sabit int çıktı26 = 26 ;
sabit int çıktı27 = 27 ;
imzasız uzun currentTime = milisaniye ( ) ;
imzasız uzun öncekiZaman = 0 ;
// Seç zaman sınır için web isteği içinde milisaniye
const uzun timeoutTime = 2000 ;
geçersiz kurulum ( ) {
Seri.başlangıç ( 115200 ) ;
// Çıkış pinlerini ayarlayın gibi çıktılar
pin Modu ( çıkış26, ÇIKIŞ ) ;
pin Modu ( çıkış27, ÇIKIŞ ) ;
// Çıkışları kapat
dijitalYazma ( çıkış26, DÜŞÜK ) ;
dijitalYazma ( çıkış27, DÜŞÜK ) ;
// Wi-Fi ağına bağlanın
Seri.baskı ( 'Bağlanıyor ' ) ;
Seri.println ( ssid ) ;
WiFi.begin ( ssid, şifre ) ;
// Beklemek değin bağlantı kuruldu
sırasında ( WiFi.durumu ( ) ! = WL_CONNECTED ) {
gecikme ( 500 ) ;
Seri.baskı ( '.' ) ;
}
Seri.println ( '' ) ;
Seri.println ( 'WiFi bağlandı.' ) ;
Seri.println ( 'IP adresi: ' ) ;
Seri.println ( WiFi.localIP ( ) ) ;
sunucu.begin ( ) ;
}
geçersiz döngü ( ) {
WiFiClient istemcisi = sunucu.kullanılabilir ( ) ; // Kontrol etmek için yeni müşteriler
eğer ( müşteri ) { // Bir istemci bağlıysa,
akımZaman = milisaniye ( ) ;
öncekiZaman = geçerliZaman;
Seri.println ( 'Yeni müşteri.' ) ; // Seri bağlantı noktasına bildirimde bulunun
String currentLine = '' ; // İstemci verilerini depolamak için bir Dize oluşturun
sırasında ( istemci.bağlı ( ) && currentTime - öncekiTime = 0 ) {
Seri.println ( 'GPIO 26 açık' ) ;
çıktı26Durum = 'AÇIK' ;
dijitalYazma ( çıkış26, YÜKSEK ) ;
} başka eğer ( başlık.indexOf ( 'AL/26/kapalı' ) > = 0 ) {
Seri.println ( 'GPIO 26 kapalı' ) ;
çıktı26Durum = 'KAPALI' ;
dijitalYazma ( çıkış26, DÜŞÜK ) ;
} başka eğer ( başlık.indexOf ( 'AL /27/on' ) > = 0 ) {
Seri.println ( 'GPIO 27 açık' ) ;
çıktı27Durum = 'AÇIK' ;
dijitalYazma ( çıkış27, YÜKSEK ) ;
} başka eğer ( başlık.indexOf ( 'AL /27/kapalı' ) > = 0 ) {
Seri.println ( 'GPIO 27 kapalı' ) ;
çıktı27Durum = 'KAPALI' ;
dijitalYazma ( çıkış27, DÜŞÜK ) ;
}
client.println ( '' ) ;
client.println ( '' ) ;
client.println ( '
// Düğmelere stil vermek için CSS
client.println ( '
client.println ( 'gövde { arka plan: doğrusal degrade (sağa doğru, #0f0c29, #302b63, #24243e); }' ) ;
// Parlama efektli neon mavisi düğmeler
client.println ( '.button { arka plan rengi: #08f; kenarlık: yok; renk: beyaz; dolgu: 16 piksel 40 piksel;' ) ;
client.println ( 'metin dekorasyonu: yok; yazı tipi boyutu: 30 piksel; kenar boşluğu: 2 piksel; imleç: işaretçi; kutu gölgesi: 0 0 20 piksel #08f;}' ) ;
// Parlama efektli koyu gri düğmeler
client.println ( '.button2 {arka plan rengi: #333; kutu gölgesi: 0 0 20px #333;}' ) ;
// Geçiş efekti için tuşlar
client.println ( '.button, .button2 {geçiş: tüm 0,3 saniyelik giriş çıkış kolaylığı;}' ) ;
// Yuvarlak düğmeler
client.println ( '.button, .button2 {kenarlık yarıçapı: %50;}' ) ;
// Web sayfası başlığı
client.println ( '
Linuxhint ESP32 Web Sunucusu
'// Web sayfası başlığı
client.println ( '
ESP32 Web Sunucusu
');// Durumu ve düğmeleri göster için GPIO 26
client.println ( '
GPIO 26 - Durum'
+ çıktı26Durum + '' ) ;
// AÇIK düğmesini göster eğer durum KAPALI
eğer ( çıktı26Durum == 'KAPALI' ) {
client.println ( '' ) ;
} başka { // KAPALI düğmesini göster eğer durum AÇIK
client.println ( '
' ) ;
}
// Durumu ve düğmeleri göster için GPIO 27
client.println ( '
GPIO 27 - Durum'
+ çıktı27Durum + '' ) ;
// AÇIK düğmesini göster eğer durum KAPALI
eğer ( çıktı27Durum == 'KAPALI' ) {
client.println ( '
' ) ;
} başka { // KAPALI düğmesini göster eğer durum AÇIK
client.println ( '
' ) ;
}
client.println ( '' ) ;
// HTTP yanıtını boş bir satırla sonlandırın
client.println ( ) ;
// Çıkış sırasında döngü
kırmak ;
} başka { // Geçerli satırı temizle eğer BT yeni satır
akımSatırı = '';
}
} else if (c != ' \R ') { // Eğer öyleyse baytı geçerli satıra ekleyin' bir at arabası değil geri dönmek
akımSatırı += c;
}
}
}
// Başlığı sıfırla
başlık = '' ;
// İstemci bağlantısını kapatın
istemci.durdurma ( ) ;
Seri.println ( 'İstemcinin bağlantısı kesildi.' ) ;
Seri.println ( '' ) ;
}
}
Kod Açıklaması
ESP32 web sunucusu kodu, Wifi bağlantısı kurularak başlatıldı. İlk olarak WiFi.h kütüphanesini içerir. Daha sonra bu kod, ESP32 kartınızı bağlamak istediğiniz ağın SSID'sini ve Şifresini girmenizi gerektirir. Daha sonra çıkışların durumunu saklayacak değişkenler oluşturduk ve çıkış pinlerini bu değişkenlere atadık. Burada 26 ve 27 numaralı GPIO pinlerini kullanıyoruz, ancak cihazları veya LED'leri bağlamak için diğer GPIO pinlerini de kullanabilirsiniz.
Kodun ikinci kısmında seri iletişime geçiliyor. Bu, ESP32 kartının ve ona bağlı çevre birimlerinin durumunu kontrol etmemize yardımcı olacaktır. Bunlarla birlikte bağlı olan iki LED'in farklı durumları için seri çıkışı tanımladık. LED ışıkları bağlayabilir ve durumlarını AÇIK ve KAPALI olarak tanımlayabilirsiniz. Bu kod kısmı, kodu yükledikten sonra ESP32 web sunucusunun IP adresini de yazdıracaktır. IP adresini içeren kod kısmı, Setup() fonksiyonunun içinde olduğundan yalnızca bir kez yazdırılacaktır.
Üçüncü bölümde, yani Loop() fonksiyonunun içinde, Web isteklerini işlemek ve GPIO pinlerini kontrol etmek için gereken kodu tanımladık. Bu kod kısmı, loop() işlevinde olduğu gibi tekrar tekrar yürütülecektir. Yeni istemcileri kontrol eder ve istemcilerden gelen verileri okur. Okuduktan sonra HTTP isteklerini ayrıştırır ve bir LED'i AÇMAK veya KAPATMAK gibi uygun bir yanıt gönderir. Bu kod kısmı aynı zamanda ESP32 web sunucusunun temel stiline ilişkin bilgileri de içerir. Arayüz LED düğmelerini ve bunların mevcut durumlarını içerir.
4. ESP32 Web Sunucusu IP Adresi
ESP32 web sunucusu IP adresi, cihazın ağdaki benzersiz tanımlayıcısıdır. ESP32 web sunucusuna erişmek için bu IP adresine ihtiyacınız olacaktır. Yukarıdaki kodu yükledikten sonra IP adresi, Dinamik IP olarak da bilinen yönlendirici tarafından otomatik olarak atanır. Ancak Statik IP olarak da bilinen bir IP adresini manuel olarak da atayabilirsiniz.
ESP32 sunucunuzun IP adresini öğrenmek için kodu yükledikten sonra Arduino IDE seri monitörünü kontrol edebilirsiniz. Bu IP adresinin yalnızca ESP32 kartı bir erişim noktasına başarıyla bağlandığında görüntüleneceğini unutmayın.
Not : ESP32 kartınızı bir erişim noktasına bağlamakta zorlanıyorsanız yönlendiricinin (erişim noktası) SSID'sini değiştirmeyi deneyin. SSID'nizde özel karakterlerden kaçınmaya çalışın.
5. ESP32 Web Sunucusunu Kullanarak LED'leri Kontrol Etme
Şimdi ESP32 kartı ile iki LED kurup bunları ESP32 web sunucusunu kullanarak kontrol edeceğiz. Kodun içinde tanımlanan aynı GPIO pinlerini kullanabilir veya diğer GPIO pinlerinin kodunu değiştirebilirsiniz. Burada bir LED'i GPIO 26'ya, diğerini GPIO 27'ye bağlayacağız.
Masaüstü Arayüzü
Donanım hazır olduğunda bir sonraki adım, Arduino IDE terminalindeki ESP32 tarafından verilen IP adresinin aynısını kullanarak web sunucusuna erişmektir. Bunun için sisteminizin aynı ağa bağlanması gerekir. Masaüstünde WiFi ayarlarını açın ve ağa bağlanın.
Bağlandıktan sonra, bir web tarayıcısı (Chrome) kullanarak web sunucusuna erişebilirsiniz. URL çubuğuna ESP32 web sunucusu IP'sini yazın ve tuşuna basın. Girmek . Açtığınızda aşağıdaki arayüzü göreceksiniz.
Kodun içinde ayarlandığı gibi mevcut durumda her iki LED de KAPALI. Yani ESP32'yi PC'ye bağladıktan sonra LED'lerden hiçbirinin yanmadığını göreceksiniz.
GPIO 26'daki LED'i AÇIK konuma getirerek başlayacağız. KAPALI anahtarını değiştirin ve LED'in yandığını göreceksiniz.
GPIO 26'daki LED AÇIK.
Benzer şekilde, GPIO 27'deki LED için ikinci düğmeyi açın.
Şimdi GPIO 27'ye bağlı ikinci LED'in de yandığını göreceksiniz.
Ayrıca düğmelerini değiştirerek her iki LED'i de açabilirsiniz.
Her iki LED'i de değiştirdikten sonra her iki LED'in de yandığını göreceksiniz.
Mobil Arayüz
ESP32 web sunucusuna yalnızca masaüstü tarayıcılarla sınırlı değildir, akıllı telefon veya tablet gibi diğer cihazlardan da erişebilirsiniz. ESP32 web sunucusuna bağlanmak için WiFi ağ ayarlarını açın ve kodda tanımladığınız SSID'nin aynısını arayın.
Erişim noktasını aradıktan sonra akıllı telefonunuzu bu erişim noktasına bağlayın.
Bağlandıktan sonra akıllı telefonunuzdaki tarayıcıyı açın ve ESP32 IP adresini kullanarak web sunucusuna erişin. Akıllı telefondaki arayüz masaüstüne benzer. Tıpkı bir masaüstü tarayıcısında olduğu gibi GPIO pinlerinizi kontrol etmek için tam kontrole sahipsiniz.
6. ESP32 Web Sunucusunu Kullanarak AC Cihazlarını Kontrol Etme
Şimdilik basit bir LED'i ESP32'ye bağladık ve ESP32 web sunucusunu kullanarak kontrol ettik. Ancak bu yalnızca ESP32 web sunucusu için basit bir programdır. Aynı konsepti herhangi bir sensöre veya modüle uygulayabilir ve istediğiniz çıktıyı oluşturabilirsiniz.
Örneğin, ESP32'ye bir röle modülü bağlayabilir ve yukarıda verilen aynı web sunucusu kodunu kullanarak herhangi bir AC cihazını kontrol edebilirsiniz.
Okumak : Arduino IDE Kullanarak ESP32'li Röle
Şimdi bir röle modülü kullanarak bir AC ampulü ESP32'ye bağlayacağız. Burada AC ampulünü kontrol etmek için GPIO pin 26'yı kullanacağım. Röleyi kontrol etmek için istediğiniz GPIO pinlerini tanımlayabilirsiniz.
| ESP32 Pimi | Röle Modülü Pimleri |
|---|---|
| VIN/3V3 | Vcc |
| GND | GND |
| GPIO 26 veya GPIO 27 | IN1 veya IN2 |
Aşağıda bir röle modülü ve bir AC ampulü olan ESP32'nin şematik diyagramı bulunmaktadır.
Röle modülünü bağladıktan sonra ESP32 web sunucusunu açın ve GPIO 26 anahtarını değiştirin.
Ampulün yanacağını göreceksiniz.
Başarılı bir şekilde bir ESP32 web sunucusu oluşturduk ve onunla hem AC hem de DC cihazlarını kontrol ettik. Aynı kodu başka herhangi bir sensöre uygulayabilir ve projenize özel web sunucularınızı oluşturabilirsiniz.
Çözüm
ESP32, bir Erişim noktasına bağlanabilen veya diğer cihazlar için erişim noktası görevi görebilen bir mikro denetleyici kartıdır. ESP32'nin bu özelliğini kullanarak bir ESP32 web sunucusu tasarlayabilirsiniz. İhtiyacınız olan tek şey ESP32 kartınızı bir erişim noktasına bağlamak ve web sunucusunun IP adresini almaktır. Bundan sonra herhangi bir web tarayıcısına aynı IP'yi yazmanız gerekir ve hemen web sunucusuna erişime sahip olursunuz. Ancak ESP32 web sunucusuna erişirken aynı ağa bağlı olduğunuzdan emin olun. Ayrıca verilen kodu değiştirebilir ve istediğiniz herhangi bir sensörü veya modülü kontrol edebilirsiniz.