Bu derste Basit ESP8266 Web Sunucusunun Nasıl Oluşturulacağını göstereceğim. Bu ESP8266 NodeMCU bağımsız Web Sunucusuna, yerel ağda web tarayıcısı olan herhangi bir cihazdan (Cep Telefonları, Dizüstü Bilgisayarlar, Tabletler) erişilebilir. ESP8266 web sunucusunun çalışmasını göstermek için iki LED'i kontrol eden bir web sayfası oluşturacağız.
İnternet sunucusu nedir?
Web Sunucusu, web sayfalarının Web İstemcilerine bakımı, getirilmesi ve sunulmasından sorumlu olan Donanım ve Yazılımın birleşimidir. Web sayfalarındaki bilgiler HTML Belgeleri, Görseller, Video, Uygulamalar vb. biçiminde Metin olabilir. Dizüstü bilgisayarlardaki ve cep telefonlarınızdaki Web Tarayıcıları web istemcileridir. Web Sunucusu ve Web İstemci terimlerine dikkat ettiyseniz evet, bu tür iletişime İstemci – Sunucu Modeli denir.
Genel olarak Web Sunucularının kısa tanıtımıyla artık bağımsız bir ESP8266 Web Sunucusunun gereksinimlerinin neler olduğunu anlayacağız. Bir ESP8266 Web Sunucusu, HTML Metni biçiminde bir web sayfası içermelidir.
ESP8266 için Web Sunucusu oluşturmaya devam etmeden önce, ESP8266'daki farklı Wi-Fi çalışma modlarına göz atacağız. ESP8266'yı WiFi'ye Bağlama eğitimini hatırlarsanız daha önce bu modlardan bahsetmiştim. Ancak bu web sunucusu eğitimi için bunları bir kez daha gözden geçireceğiz.
Temel olarak ESP8266 Wi-Fi Modülü üç WiFi çalışma modunda çalışır. Bunlar:
- İstasyon Modu (STA)
- Yazılım Erişim Noktası Modu (AP)
- İstasyon + Soft AP Modu
Bir web sunucusu oluşturmak için ESP8266 Wi-Fi Modülünü İstasyon Modunda veya Erişim Noktası Modunda yapılandırabilirsiniz. Aradaki fark, istasyon modunda tüm cihazların (Mobil cihazlar, dizüstü bilgisayarlar, ESP8266 vb.) Kablosuz Yönlendiricinin WiFi Ağına bağlı olması ve tüm cihazlara (ESP8266'nın Web Sunucusu dahil) IP Adresinin yönlendirici tarafından atanmasıdır.
Bu IP Adresini kullanarak istemciler Web Sayfasına erişebilir. Ek olarak, istemciler Yönlendiriciden gelen internet bağlantısını kaybetmezler.
Ancak AP Modunda ESP8266 için Web Sunucusu oluşturursak, istemcilerin Web Sayfalarına erişebilmeleri için kendi SSID'sini ve Şifresini kullanarak ESP8266 tarafından sağlanan ağa bağlanmaları gerekir. Soft AP Modu olduğundan istemcilerin internet bağlantısı yoktur.
İstasyon Modunda veya Soft AP Modunda ESP8266 Web Sunucusu oluşturmak, ESP8266'nın yapılandırma kısmı dışında çok benzer.
Bu eğitimde size İstasyon Modunda (STA) yapılandırılmış ESP8266 üzerinde Web Sunucusunun nasıl oluşturulacağını göstereceğim.
NodeMCU ESP8266 Web Sunucusu
Web sunucusunu ESP8266 üzerinde oluşturup istemciler üzerinde erişmenin yanı sıra, Sunucunun, ESP8266 NodeMCU Kartının GPIO Pinlerine bağlı iki LED'i kontrol ederek istemcilerden gelen farklı isteklere nasıl yanıt verdiğini de göreceğiz.
Bunu göstermek için, ilgili akım sınırlama dirençleri (220Ω) aracılığıyla iki adet 5 mm LED'i ESP8266'nın GPIO4 ve GPIO5'ine bağladım. NodeMCU'da GPIO4 D2 olarak etiketlenir ve GPIO5 D1 olarak etiketlenir.
KOD
Önemli ve ilginç konulara gelecek olursak, ESP8266'daki Web Sunucusunun asıl kodu. Bu sadece bir miktar metin, birkaç düğme ve bir miktar stilizasyon içeren bir HTML Kodudur.
Aşağıdaki blok ESP8266 Web Sunucusunun tam kodunu gösterir. Kodu bir sonraki bölümde açıklayacağım.
Yukarıdaki kodun 6. ve 7. satırlarında Wi-Fi Ağ Ayarlarınıza göre değişiklik yapmanız gerekmektedir. Bunlar Wi-Fi Ağının SSID'si ve Şifresidir.
const char* ssid = "ESP8266-WiFi"; /* Yönlendiricinizin SSID'sini ekleyin */ const char* şifre = "12345678"; /*Şifreyi ekleyin */
Gerekli değişiklikleri yaptıktan sonra devre şemasına göre gerekli bağlantıları yapın, NodeMCU'yu bilgisayara bağlayın, doğru COM Port'u seçin ve kodu yükleyin.
ESP8266 ve NodeMCU'da yeniyseniz, NodeMCU'ya Başlarken eğitimi Arduino IDE'yi yapılandırmanıza yardımcı olacaktır.
Seri Monitörü açın ve ESP8266 NodeMCU, Wi-Fi Bağlantısının ilerlemesi, IP Adresi ve Web Sunucusunun URL'si (esasen ESP8266'nın IP Adresi olan) gibi bazı önemli bilgileri yazdıracaktır.
Yani benim durumumda ESP8266'nın IP Adresi 192.168.1.6'dır.
ESP8266 Web Sunucusuna İstemcilerden Erişme
Bir dizüstü bilgisayarda veya cep telefonunda bir Web Tarayıcısı açın ve IP Adresini yazın. Bu hakikat anıdır. Her şey yolunda giderse ESP8266 Web Sunucusu tarafından barındırılan basit bir web sayfasını görebilmeniz gerekir.
Aşağıda, ESP8266'nın Web Sunucusuna erişen bir dizüstü bilgisayardaki Chrome Web Tarayıcısının ekran görüntüsü bulunmaktadır.
Seri Monitöre bakarsanız, bir istemci her bağlanmaya çalıştığında (veya bir istek gönderdiğinde), bazı önemli bilgiler seri monitöre yazdırılır. Bu bilgiyi (bu aslında müşteriden gelen talebin bir parçası) bir sonraki bölümde anlatacağım.
Daha sonra aynı şeyi bir Cep Telefonunda denedim. Mükemmel çalışıyor.
NOT: Cep telefonları, dizüstü bilgisayarlar vb. gibi tüm istemciler, ESP8266 Modülü ile aynı ağa bağlı olmalıdır.
ESP8266 NodeMCU Web Sunucusu Nasıl Çalışır?
Şimdi kodu analiz ederek ESP8266 Web Server'ın nasıl çalıştığını anlamaya çalışalım. Kodun tüm önemli kısımlarını açıklayacağım ve basit şeyleri (LED'i açmak gibi) sizin keşfetmenize bırakacağım.
İlk kurulum
Öncelikle ESP8266WiFi Kitaplığıyla ilgili yalnızca bir başlık dosyası eklemeniz gerekir.
#include <ESP8266WiFi.h>
Ardından, iki LED'i bağlamak için GPIO pinlerini atayın. GPIO4 ve GPIO5 kullandım.
#define gpio4LEDPin 4 #define gpio5LEDPin 5Daha önce de belirttiğim gibi Wi-Fi Ağınızın SSID ve Şifresini buraya ekleyin.
const char* ssid = "SSID'NİZİ GİRİN"; const char* şifre = "ŞİFRENİZİ GİRİN";HTTP Sunucusu oluşturmak istediğimiz için Web Sunucusunu 80 numaralı bağlantı noktasıyla kurmamız gerekir (bu, HTTP Sunucuları için varsayılan bağlantı noktasıdır).
WiFiServer espServer(80);
Daha sonra setup() fonksiyonunda 115200 baud hızıyla seri iletişime başlayın ve GPIO pinlerini OUTPUT olarak yapılandırın. Ayrıca GPIO pinlerini DÜŞÜK olarak başlatın.
Serial.begin(115200 ); pinMode(gpio4LEDPin, ÇIKIŞ); pinMode(gpio5LEDPin, ÇIKIŞ); digitalWrite(gpio4LEDPin, DÜŞÜK); digitalWrite(gpio5LEDPin, DÜŞÜK);Sonraki birkaç kod satırı Wi-Fi Bağlantısını başlatmak için kullanılır.
WiFi.mode(WIFI_STA ); WiFi.begin(ssid , şifre); while(WiFi.status() != WL_CONNECTED) { Seri.baskı ("*"); gecikme(500); }Başarılı bağlantıdan sonra Web Sunucusunu başlatın ve ESP8266'nın IP Adresini yazdırın. Bu IP adresi aynı zamanda istemcinin web tarayıcısına girilmesi gereken Web Sunucusu için URL görevi de görür.
Serial.println("ESP8266 Web Sunucusu Başlatılıyor..."); espServer.begin (); Serial.println("ESP8266 Web Sunucusu Başlatıldı"); Serial.print("\n S Serial.print(" ESP8266 Web Sunucusu: "); Serial.print("https ; Serial.println(WiFi.localIP());Bu, Web Sunucusunun ilk kurulumunu tamamlar.
Müşteriyi Bekliyor ve Yanıt Veriyorum
Daha sonra, loop() işlevinde Sunucu, herhangi bir istemcinin kendi hizmetini isteyip istemediğini kontrol eder. Müşteri yoksa tekrar kontrol edin. Bir müşteriden gelen bir istek varsa, istekle yanıt vermeye devam edin.
WiFiClient istemcisi = espServer.available(); if(!istemci) { geri dönmek; }Bir istemci tarayıcısına ESP8266'nın IP Adresini girdiğinde, Sunucu basit bir web sayfasıyla yanıt verir. Bu ilk istek – yanıttır, dolayısıyla herhangi bir GPIO eylemi olmayacaktır. İstemciden gelen istek HTTP GET Yöntemi biçimindedir.
Aşağıdaki görüntüde sunucudan gelen ilk isteğin seri monitör çıktısını görebilirsiniz; yani istemci, tarayıcısına IP Adresini girer. Talep “GET / HTTP/1.1” idi. Sondaki “1.1” HTTP sürümüdür.
İstemci web sayfasını başarıyla açabiliyorsa, web sunucusu düzgün çalışıyor demektir ve istemci ile sunucu arasındaki HTTP İletişimi başarılıdır. Artık LED'in durumuna bağlı olarak düğmeler iki eylem gerçekleştirir. LED KAPALI ise ve düğmeye tıklarsak, istemci LED'i açmak için bir istek gönderir ve bunun tersi de geçerlidir.
İki isteği birbirinden ayırmak için, LED'in durumuna göre sunucuya gönderilen aynı düğme tıklaması için iki URL kullandık. Yani her iki LED için de toplam dört URL'miz var. Bunlar:
- /GPIO4ON
- /GPIO4OFF
- /GPIO5ON
- /GPIO5OFF
İstemci bu URL'leri kullanarak isteği gönderir ve isteğin formatı aşağıdaki formlarda olacaktır:
- /GPIO4ON HTTP/1.1'İ ALIN
- /GPIO4OFF HTTP/1.1'İ AL
- /GPIO5ON HTTP/1.1'İ ALIN
- GET /GPIO5OFF HTTP/1.1
Bir sonraki kod parçası istemciden gelen bu isteği çözer ve gerekli eylemi gerçekleştirir, yani GPIO4 veya GPIO5'i DÜŞÜK veya YÜKSEK yapar.
if (request.indexOf("/GPIO4ON") != -1) { Serial.println("GPIO4 LED'i AÇIK"); digitalWrite(gpio4LEDPin, YÜKSEK); gpio4Value = YÜKSEK; } if (request.indexOf("/GPIO4OFF") != -1) { Serial.println("GPIO4 LED'i KAPALI"); digitalWrite(gpio4LEDPin, DÜŞÜK); gpio4Value = DÜŞÜK; } if (request.indexOf("/GPIO5ON") != -1) { Serial.println("GPIO5 LED'i AÇIK"); digitalWrite(gpio5LEDPin, YÜKSEK); gpio5Value = YÜKSEK; } if (request.indexOf("/GPIO5OFF") != -1) { Serial.println("GPIO5 LED'i KAPALI"); digitalWrite(gpio5LEDPin, DÜŞÜK); gpio5Value = DÜŞÜK; }Gerçek Web Sayfası
Kodun son ve ilgi çekici kısmı asıl web sayfasının kendisi içindir. Daha önce de belirttiğim gibi, web sayfası bazı bilgiler ve birkaç düğme (CSS Stili) içeren bir HTML Metni olarak tasarlanmıştır.
Kodun ilk birkaç satırında, esas olarak Sunucunun türünü ve ayrıca bu sunucunun barındırdığı belgelerin türünü yapılandırıyoruz.
client.println("HTTP/1.1 200 TAMAM"); client.println("İçerik Türü: metin/html"); client.println(); client.println("<!DOCTYPE HTML>");Sonraki iki satır, web sayfasının herhangi bir tarayıcıda (cep telefonu, dizüstü bilgisayar) erişilebilir olmasını sağlamak ve ayrıca favicon'dan gelen istekleri engellemek için gereklidir.
client.println("<meta name=\"viewport\" content=\"width=device-width, startup-scale=1\">"); client.println("<link rel=\"icon\" href=\"data:,\">");Şimdi kodun düğme stili kısmı geliyor. Sonraki birkaç satır, düğmeler için CSS stili ve yazı tipi, yazı tipi boyutu, düğmenin rengi vb. gibi genel web sayfasıdır. Bu bölüm gerekli değildir ancak web sayfasını daha çekici hale getirir.
client.println("<stil>"); client.println("html { font-family: Courier New; display: satır içi blok; kenar boşluğu: 0px otomatik; text-align: center;}"); client.println(".button {kenarlık: yok; renk: beyaz; dolgu: 10 piksel 20 piksel; metin hizalama: orta;"); client.println("metin dekorasyonu: yok; yazı tipi boyutu: 25 piksel; kenar boşluğu: 2 piksel; imleç: işaretçi;}"); client.println(".button1 {arka plan rengi: #13B3F0;}"); client.println(".button2 {arka plan rengi: #3342FF;}"); client.println("</style>");Sonraki, web sayfasının gerçek gövdesinin kodudur. Öncelikle “ESP8266 Web Server” diyen basit bir başlık içeriyor. Bunu GPIO4'e bağlı LED'in durumunu gösteren bir metin takip eder. Bunun ardından üzerinde etkileşimli bir metin bulunan GPIO4 düğmesi gelir.
LED durum metni ve buton GPIO5 için de tekrarlanır.
client.println("<gövde>"); client.println("<h2>ESP8266 Web Sunucusu</h2>"); if(gpio4Değeri == DÜŞÜK) { client.println("<p>GPIO4 LED Durumu: KAPALI</p>"); client.print("<p> <a AÇIK\"> <button class=\"button Button1\">AÇMAK için tıklayın</button></a> </p>"); } başka { client.println("<p>GPIO4 LED Durumu: AÇIK</p>"); client.print("<p> <a OFF\"> <button class=\"button Button2\">KAPATMAK için tıklayın</button></a></p>"); } if(gpio5Değeri == DÜŞÜK) { client.println("<p>GPIO5 LED Durumu: KAPALI</p>"); client.print("<p> <a AÇIK\"> <button class=\"button Button1\">AÇMAK için tıklayın</button></a></p>"); } başka { client.println("<p>GPIO5 LED Durumu: AÇIK</p>"); client.print("<p> <a OFF\"> <button class=\"button Button2\">KAPATMAK için tıklayın</button></a></p>"); } client.println("</body>");Son olarak aşağıdaki kod satırını kullanarak istemciyle olan bağlantıyı kapatın.
client.stop ();ESP8266 AP Modu Web Sunucusu Kodunu Değiştirme
ESP8266'nın Erişim Noktası (Soft AP) olarak görev yaptığı bir web sunucusu oluşturmak istiyorsanız, önceki kodu küçük değişikliklerle kullanmaya devam edebilirsiniz.
Değiştirilmesi gereken ilk önemli şey SSID ve Şifredir. STA Modunda (istasyon modu) Router’ın SSID ve Şifresini giriyoruz. Ancak AP modunda, istemcilerin bu ağa bağlanabilmesi için ESP8266'yı kendi SSID'si ve Şifresi ile kullanarak bir Wi-Fi Ağı oluşturmamız gerekir.
Örneğin SSID'yi “ESP8266-WIFI” ve şifreyi “12345678” olarak koyabilirsiniz. Bu SSID istemciler tarafından görülebilecektir ve bu ağa bağlanmak için yukarıdaki şifreyi kullanın.
const char* ssid = " ESP8266-WIFI "; const char* şifre = "12345678";Daha sonra IP adresi, ağ geçidi ve alt ağ gelir. Bu bilgi, Wi-Fi Ağı oluşturmak amacıyla AP Modunda ESP8266 için gereklidir.
IPAdresi ip(192,168,1,1); IPAdresi ağ geçidi(192,168,1,1); IPAdresi alt ağı(255,255,255,0);Artık ESP8266'yı AP Modunda başlatabilir ve aşağıdaki iki satırı kullanarak IP adresini de yapılandırabiliriz.
WiFi.softAP(ssid, şifre); WiFi.softAPConfig(ip, ağ geçidi, alt ağ);Çözüm
ESP8266 NodeMCU Kartını kullanarak bir Web Sunucusunun nasıl oluşturulacağına ilişkin eksiksiz bir adım adım eğitim. Web sunucuları, ESP8266'nın farklı çalışma modları, ESP8266 Web Sunucusunun nasıl oluşturulacağı ve bu sunucuya farklı istemcilerden nasıl erişileceği hakkında bazı önemli temel bilgileri öğrendiniz.
Yorum Gönder