Statik və DHCP IP Ayarlarını Konfiqurasiya ESP32 Captive Portal: 8 Addım

2024 Müəllif: John Day | [email protected]. Son dəyişdirildi: 2024-01-30 07:46

ESP 32, inteqrasiya edilmiş WiFi və BLE ilə işləyən bir cihazdır. IoT layihələri üçün bir növ nemətdir. Sadəcə SSID, parol və IP konfiqurasiyalarınızı verin və şeyləri buluda inteqrasiya edin. Ancaq IP parametrlərini və İstifadəçi məlumatlarını idarə etmək istifadəçi üçün baş ağrısı ola bilər.

İstifadəçi WiFi etimadnaməsini dəyişdirmək istəsə nə olar?

İstifadəçi DHCP/Statik IP parametrlərini dəyişdirmək istəsə nə olar?

ESP32 -nin hər dəfə yanması etibarlı deyil və hətta bu problemlərin həlli deyil. Burada bu təlimatlı şəkildə nümayiş etdirəcəyik.

• Əsir bir portal necə yaradılır.
• ESP32 -dən bir veb forması yerləşdirmək.
• SPIFFS ESP32 -dən oxumaq və yazmaq.
• Yumşaq bir giriş nöqtəsi yaratmaq və bir stansiyaya qoşulmaq

Addım 1: Avadanlıq və Proqram Təminatı

Avadanlıq spesifikasiyası

• ESP32 WiFi/BLE
• Simsiz Temperatur və Nəmlik Sensoru

Proqram Təminatı

Arduino IDE

Addım 2: Əsir Portal Yaratmaq

Əsir portal, yeni istifadəçilərə şəbəkə mənbələrinə daha geniş giriş verilməzdən əvvəl göstərilən bir veb səhifəsidir. Burada DHCP və Statik IP Ayarları arasında seçim etmək üçün üç veb səhifəyə xidmət edirik. IP ünvanını ESP -yə iki şəkildə təyin edə bilərik.

• DHCP IP ünvanı- cihaza IP ünvanını dinamik olaraq təyin etməyin bir yoludur. ESP -nin standart IP ünvanı 192.168.4.1 -dir
• Statik IP ünvanı- şəbəkə cihazımıza daimi bir IP ünvanı təyin etmək. cihaza statik IP təmin etmək üçün IP ünvanını, ağ geçidi ünvanını və alt şəbəkə maskasını təyin etməliyik.

İlk veb səhifədə İstifadəçiyə DHCP və Statik IP parametrləri arasında seçim etmək üçün radio düymələri verilir. Növbəti veb səhifədə, daha çox davam etmək üçün IP ilə əlaqəli məlumatları təqdim etməliyik.

HTML kodu

Veb səhifələr üçün HTML kodunu bu Github deposunda tapa bilərsiniz.

HTML veb səhifələri yaratmaq üçün Sublime və ya notepad ++ kimi hər hansı bir IDE və ya mətn redaktorundan istifadə edə bilərsiniz.

• Əvvəlcə DHCP və Statik IP Ayarları arasında seçim etmək üçün iki radio düyməsi olan bir HTML veb səhifəsi yaradın.
• İndi cavabınızı göndərmək üçün düyməni yaradın
• Radio düymələrinə bir ad verin. ESP Web server sinfi bu adları arqument olaraq qəbul edəcək və bu arqumentləri istifadə edərək radio düymələrinin cavabını alacaq
• İndi cavabı cihaza göndərmək üçün 'SUBMIT' düyməsini daxil edin.
• Digər veb səhifələrdə mətn qutularımız var. Mətn qutusuna adın dəyərini və Giriş növünü daxil edin və cavabı göndərmək üçün 'SUBMIT' düyməsinə əlavə edin.
• Mətn sahəsinin məzmununu sıfırlamaq üçün 'RESET' düyməsini yaradın.

// Radio Button DHCP Ayarı

Statik IP Ayarı

// Giriş mətn qutuları

// Göndər düyməsi

giriş [type = "submit"] {background-color: #3498DB; / * Yaşıl */ sərhəd: yox; rəng: ağ; doldurma: 15 piksel 48 piksel; mətn hizalama: mərkəz; mətn bəzəyi: heç biri; ekran: inline blok; şrift ölçüsü: 16 piksel; }

// Sıfırlama Düyməsi

giriş [type = "submit"] {background-color: #3498DB; / * Yaşıl */ sərhəd: yox; rəng: ağ; doldurma: 15 piksel 48 piksel; mətn hizalama: mərkəz; mətn bəzəyi: heç biri; ekran: daxili blok; şrift ölçüsü: 16 piksel; }

Addım 3: Veb Səhifələrindən ESP32 -ə Veb Cavabını Alın

ESP 32 cihazından veb səhifələrə xidmət etmək çox əyləncəlidir. Veb səhifədəki temperatur məlumatlarını göstərməkdən, ledləri xüsusi veb səhifədən çevirməkdən və ya İstifadəçi WiFi etimadnaməsini bir veb səhifədə saxlamaqdan başqa bir şey ola bilər. Bu məqsədlə, ESP 32, web səhifələrini serverə qoymaq üçün WebServer Class istifadə edir.

• Əvvəlcə 80 portunda (HTTP portu) WebServer sinifinin bir nümunəsini yaradın.
• İndi ESP cihazını softAP olaraq qurun. SSID və keçid açarını verin və cihaza statik bir IP təyin edin.
• Serverə başlayın.

// ********* SSID və AP üçün Pass **************/

const char *ssidAP = "SSID ver"; const char *passAP = "keçid açarı";

// ********* Statik IP Konfiqurasiyası **************/IPAddress ap_local_IP (192, 168, 1, 77); IPAddress ap_gateway (192, 168, 1, 254); IPAddress ap_subnet (255, 255, 255, 0);

// ********* SoftAP Config **************/

WiFi rejimi (WIFI_AP);

Serial.println (WiFi.softAP (ssidAP, passAP)? "Soft-AP setup": "Ulaşmaq alınmadı");

gecikmə (100); Serial.println (WiFi.softAPConfig (ap_local_IP, ap_gateway, ap_subnet)? "Soft AP -nin Konfiqurasiyası": "Konfiqurasiyada Xəta"); Serial.println (WiFi.softAPIP ());

// serverə başlayın

server.begin ();

• Fərqli geri çağırışlardan istifadə edərək URL yaradın və xidmət edin.
• və handleClient istifadə edərək müştəri asinxron şəkildə idarə edin.

server.on ("/", handleRoot);

server.on ("/dhcp", handleDHCP); server.on ("/statik", handleStatic); // cavabları idarə edin server.handleClient ();

• Veb səhifələrə daxil olmaq üçün. WiFi şəbəkələriniz daxilində yeni yaratdığınız AP -yə qoşulun. İndi brauzerə gedin, son addımda qurduğunuz IP -ni daxil edin və veb səhifəsinə daxil olun.
• Veb server sinfi girişlərə verilən adı ('mətn', 'düymə', 'radiobutton' və s.) Arqument olaraq alır. Bu girişlərin cavablarını arqument olaraq saxlayır və dəyərləri əldə edə və ya args, arg, hasArg metodlarından istifadə edərək yoxlaya bilərik.

if (server.args ()> 0) {for (int i = 0; i <= server.args (); i ++) {

Serial.println (String (server.argName (i)) + '\ t' + String (server.arg (i)));

}

əgər (server.hasArg ("ipv4static") && server.hasArg ("ağ geçidi") && server.hasArg ("alt şəbəkə")) {staticSet (); } başqa halda (server.arg ("ipv4")! = "") {dhcpSetManual (); } başqa {dhcpSetDefault (); }

Addım 4: Statik IP Konfiqurasiyası

İndiyə qədər AP -yə necə qoşulacağımızı və veb səhifənin giriş sahələrindən dəyərləri necə əldə edəcəyimizi başa düşdük

Bu addımda Statik IP -ni konfiqurasiya edəcəyik

• Statik IP Ayarını seçin və Göndər düyməsini basın. Növbəti səhifəyə yönləndiriləcəksiniz.
• Növbəti səhifədə statik IP ünvanını, şluzun ünvanını və alt şəbəkə Maskasını daxil edin, bu səhifəyə statik geri çağırma üsulu ilə idarə olunan "/static" xidmət göstəriləcək.
• Server.arg () metodundan istifadə edərək mətn sahələrinin dəyərini əldə edin.

String ipv4static = String (server.arg ("ipv4static"));

String ağ geçidi = String (server.arg ("ağ geçidi")); String alt şəbəkəsi = String (server.arg ("alt şəbəkə"));

• İndi bu dəyərlər JSON Formatına seriallaşdırılır.
• Sonra JSON -u SPIFFS -ə yazacağıq.

kök ["statickey"] = "staticSet";

kök ["staticIP"] = ipv4static;

kök ["ağ geçidi"] = ağ geçidi;

kök ["alt şəbəkə"] = alt şəbəkə;

Fayl fileToWrite = SPIFFS.open ("/ip_set.txt", FILE_WRITE);

əgər (root.printTo (fileToWrite)) {

Serial.println ("-Fayl Yazılıb"); }

• Bu konfiqurasiya SPIFFS -də saxlanılır. Daha sonra bu dəyərlər SPIFFS -dən oxunur.
• Statik IP dəyərləri daha sonra JSON -dan ayrılır.

Fayl faylı = SPIFFS.open ("/ip_set.txt", "r");

while (file.available ()) {

debugLogData += char (file.read ()); }

if (debugLogData.length ()> 5) {

JsonObject & readRoot = jsonBuffer.parseObject (debugLogData);

if (readRoot.containsKey ("statickey")) {

String ipStaticValue = readRoot ["staticIP"];

String gatewayValue = readRoot ["ağ geçidi"];

String subnetValue = readRoot ["alt şəbəkə"];

Addım 5: DHCP Ayarları

Bu addımda DHCP Ayarlarını konfiqurasiya edəcəyik

İndeks səhifəsindən DHCP Ayarlarını seçin və "Göndər" düyməsini basın

• Növbəti səhifəyə yönləndiriləcəksiniz. Növbəti səhifədə IP ünvanını daxil edin və ya varsayılanı seçin və cavabı göndərmək üçün "Göndər" düyməsini basın. Bu səhifə handleDHCP geri zəng metodu ilə idarə olunan "/dhcp" ünvanında xidmət göstəriləcək. Server.arg () metodundan istifadə edərək mətn sahələrinin dəyərini əldə edin. Tıklandığında standart onay kutusunu seçin. 192.168.4.1 IP cihaza veriləcək.
• İndi bu dəyərlər JSON Formatına seriallaşdırılır.
• Sonra JSON -u SPIFFS -ə yazacağıq.

JsonObject & root = jsonBuffer.createObject ();

kök ["dhcpManual"] = "dhcpManual";

kök ["dhcpIP"] = "192.168.4.1";

Fayl fileToWrite = SPIFFS.open ("/ip_set.txt", FILE_WRITE);

əgər (root.printTo (fileToWrite)) {

Serial.println ("-Fayl Yazılıb"); }

• Bu konfiqurasiya SPIFFS -də saxlanılır. Daha sonra bu dəyərlər SPIFFS -dən oxunur.
• Dhcp IP dəyərləri daha sonra JSON -dan ayrılır.

Fayl faylı = SPIFFS.open ("/ip_set.txt", "r"); while (file.available ()) {debugLogData += char (file.read ()); } if (debugLogData.length ()> 5) {JsonObject & readRoot = jsonBuffer.parseObject (debugLogData);

əgər (readRoot.containsKey ("dhcpDefault")))

String ipdhcpValue = readRoot ["dhcpIP"];

Serial.println (ipdhcpValue);

dhcpAPConfig ();}

Addım 6: WiFi Etimadnaməsini Saxlayın

Hələlik IP konfiqurasiyasını seçmişik. İndi İstifadəçinin wifi məlumatlarını saxlamalıyıq. Bu vəziyyəti həll etmək üçün. Bu proseduru izlədik.

• Beləliklə, indi son addımlarda qeyd olunan əsir portaldan seçdiyimiz DHCP və ya Statik IP konfiqurasiyasında cihaz AP quruluşumuz var.
• Tutaq ki, Statik IP konfiqurasiyasını seçmişik.
• Bu IP -də softAP -ı konfiqurasiya edəcəyik.
• SPIFFS -dən dəyərləri oxuduqdan və bu dəyərləri JSON -dan təhlil etdikdən sonra. SoftAP -ı bu IP -də konfiqurasiya edəcəyik.
• IP Stringini baytlara çevirin.

bayt ip [4];

parseBytes (ipv4Arr, '.', ip, 4, 10);

ip0 = (uint8_t) ip [0];

ip1 = (uint8_t) ip [1];

ip2 = (uint8_t) ip [2];

ip3 = (uint8_t) ip [3];

IPAddress ap_local (ip0, ip1, ip2, ip3);

// *************** Stringdən baytları təhlil edin ****************** //

boş parseBytes (const char* str, char sep, byte* bytes, int maxBytes, int base) {

üçün (int i = 0; i <maxBytes; i ++) {

bayt = strtoul (str, NULL, əsas);

str = strchr (str, sep);

əgər (str == NULL || *str == '\ 0') {

fasilə;

}

str ++;

}}

İndi softAP -ı bu IP -də konfiqurasiya edəcəyik

Serial.println (WiFi.softAPConfig (ap_localWeb_IP, ap_gate, ap_net)? "SoftAP -ın konfiqurasiyası": "bağlı deyil"); Serial.println (WiFi.softAPIP ());

• İndi veb serverini işə salın və bu IP -də bir veb səhifəsinə xidmət edin. İstifadəçinin WiFi etimadnaməsini daxil etmək üçün.
• Veb səhifə, SSID və Şifrə daxil etmək üçün iki mətn sahəsindən ibarətdir.
• handleStaticForm, veb səhifəsinə xidmət edən geri çağırma metodudur.
• server.handleClient (), veb səhifədən gələn və gələn sorğu və cavablara diqqət yetirir.

server.begin ();

server.on ("/", handleStaticForm);

server.onNotFound (handleNotFound);

STimer = milis ();

while (millis ()-STimer <= S Interval) {

server.handleClient (); }

HTML forması SPIFFS -də saxlanılır. server.arg () istifadə edərək uyğun arqumentləri yoxlayırıq. SSID və Şifrənin dəyərini əldə etmək üçün

Fayl faylı = SPIFFS.open ("/WiFi.html", "r");

server.streamFile (fayl, "text/html");

file.close ();

Addım 7: SPIFFS -dən oxuyun və yazın

SPIFFS

Serial Periferik İnterfeys Flash Fayl Sistemi və ya qısa olaraq SPIFFS. SPI flaş çipi olan mikro nəzarətçilər üçün yüngül bir fayl sistemidir. ESP32 -nin daxili flaş çipində veb səhifələriniz üçün çox yer var. Veb səhifəmizi də Flash Sistemində saxladıq. Məlumatları spifflərə yükləmək üçün izləməli olduğumuz bir neçə addım var

ESP 32 SPIFFS məlumat yükləmə vasitəsini yükləyin:

• Arduino eskiz kitabçanızda hələ yoxdursa, alətlər kataloqunu yaradın
• Aləti alətlər qovluğuna yığın (yol /Arduino/tools/ESP32FS/tool/esp32fs.jar kimi görünəcək)
• Arduino IDE -ni yenidən başladın
• Bir eskiz açın (və ya yenisini yaradın və qeyd edin)
• Eskiz kataloquna gedin (Sketch> Sketch Qovluğunu Göstər seçin)
• Məlumat adlanan bir qovluq yaradın və oradakı fayl sistemində istədiyiniz faylları yaradın. Webform.html adı ilə HTML səhifəmizi yüklədik
• Bir lövhə, port və qapalı Serial Monitor seçdiyinizə əmin olun
• Alətlər> ESP8266 Sketch Məlumat Yükləmə seçin. Bu, faylları ESP8266 flash fayl sisteminə yükləməyə başlamalıdır. Tamamlandıqda, IDE vəziyyət çubuğunda SPIFFS Şəkil Yüklənmiş mesajı görünəcək.

void handleDHCP () {Fayl faylı = SPIFFS.open ("/page_dhcp.html", "r"); server.streamFile (fayl, "text/html"); file.close ();}

void handleStatic () {

Fayl faylı = SPIFFS.open ("/page_static.html", "r"); server.streamFile (fayl, "text/html"); file.close ();}

SPIFFS -ə yazmaq

Burada saxlanan ayarı SPIFFS -ə yazırıq ki, cihaz sıfırlandıqda istifadəçilər bu addımlardan keçməsinlər.

• Veb səhifədən alınan arqumentləri JSON obyektlərinə çevirin
• Bu JSONu SPIFFS -də saxlanılan.txt faylına yazın.

String ipv4static = String (server.arg ("ipv4static"));

String şluzu = String (server.arg ("ağ geçidi")); String alt şəbəkəsi = String (server.arg ("alt şəbəkə")); kök ["statickey"] = "staticSet"; kök ["staticIP"] = ipv4static; kök ["ağ geçidi"] = ağ geçidi; kök ["alt şəbəkə"] = alt şəbəkə; String JSONStatic; char JSON [120]; root.printTo (Serial); root.prettyPrintTo (JSONStatic); JSONStatic.toCharArray (JSON, sizeof (JSONStatic) +2); Fayl fileToWrite = SPIFFS.open ("/ip_set.txt", FILE_WRITE); if (! fileToWrite) {Serial.println ("SPIFFS açarkən xəta"); } if (fileToWrite.print (JSON)) {Serial.println ("-Fayl Yazılıb"); } başqa {Serial.println ("-Fayl Yazarkən Hata"); } fileToWrite.close ();

Addım 8: Ümumi Kod

HTML və ESP32 üçün Aşırı kodu bu Github Deposunda tapa bilərsiniz