ESP32 პორტირებული პორტალი სტატიკური და DHCP IP პარამეტრების კონფიგურაციისთვის: 8 ნაბიჯი

2024 ავტორი: John Day | [email protected]. ბოლოს შეცვლილი: 2024-01-30 10:18

ESP 32 არის მოწყობილობა ინტეგრირებული WiFi და BLE. ეს ერთგვარი სიკეთეა IoT პროექტებისთვის. უბრალოდ მიუთითეთ თქვენი SSID, პაროლი და IP კონფიგურაცია და ინტეგრირეთ საგნები ღრუბელში. მაგრამ IP პარამეტრების და მომხმარებლის რწმუნებათა სიგელების მართვა შეიძლება მომხმარებლისთვის თავის ტკივილი იყოს.

რა მოხდება, თუ მომხმარებელს სურს შეცვალოს WiFi სერთიფიკატები?

რა მოხდება, თუ მომხმარებელს სურს DHCP/სტატიკური IP პარამეტრების შეცვლა?

ESP32- ის ყოველ ჯერზე განათება არ არის საიმედო და არც კი არის ამ პრობლემების გადაწყვეტა. აქ ამ სასწავლო ინსტრუქციაში ჩვენ ვაპირებთ დემონსტრირებას.

• როგორ შევქმნათ ტყვე პორტალი.
• ვებ ფორმის განთავსება ESP32– დან.
• კითხვა და წერა SPIFFS ESP32– დან.
• რბილი წვდომის წერტილის შექმნა და სადგურთან დაკავშირება

ნაბიჯი 1: აპარატურის და პროგრამული უზრუნველყოფის სპეციფიკაცია

აპარატურის სპეციფიკაცია

• ESP32 WiFi/BLE
• უკაბელო ტემპერატურის და ტენიანობის სენსორი

პროგრამული უზრუნველყოფის სპეციფიკაცია

Arduino IDE

ნაბიჯი 2: ტყვე პორტალის შექმნა

ტყვედ ჩავარდნილი პორტალი არის ვებ გვერდი, რომელიც ნაჩვენებია ახლად დაკავშირებულ მომხმარებლებამდე, სანამ მათ არ ექნებათ უფრო ფართო წვდომა ქსელის რესურსებზე. აქ ჩვენ ვემსახურებით სამ ვებ გვერდს, რათა შევარჩიოთ DHCP და სტატიკური IP პარამეტრები. ჩვენ შეგვიძლია განვსაზღვროთ IP მისამართი ESP– ს ორი გზით.

• DHCP IP მისამართი- ეს არის მოწყობილობა მოწყობილობისთვის IP მისამართის დინამიურად მინიჭების საშუალება. ESP– ის ნაგულისხმევი IP მისამართია 192.168.4.1
• სტატიკური IP მისამართი- მუდმივი IP მისამართის მინიჭება ჩვენს ქსელურ მოწყობილობაზე. მოწყობილობის სტატიკური IP მიწოდებისთვის ჩვენ უნდა განვსაზღვროთ IP მისამართი, კარიბჭის მისამართი და ქვექსელის ნიღაბი.

პირველ ვებგვერდზე მომხმარებელს ეძლევა რადიო ღილაკები DHCP და სტატიკური IP პარამეტრებს შორის ასარჩევად. მომდევნო ვებ გვერდზე, ჩვენ უნდა მივაწოდოთ IP– სთან დაკავშირებული ინფორმაცია შემდგომი გასაგრძელებლად.

HTML კოდი

ვებ გვერდების HTML კოდი შეგიძლიათ იხილოთ ამ Github საცავში.

HTML ვებ გვერდების შესაქმნელად შეგიძლიათ გამოიყენოთ ნებისმიერი IDE ან ტექსტური რედაქტორი, როგორიცაა Sublime ან notepad ++.

• პირველი შექმენით HTML ვებ გვერდი, რომელიც შეიცავს ორ რადიო ღილაკს, რათა აირჩიოთ DHCP და სტატიკური IP პარამეტრები.
• ახლა შექმენით ღილაკი თქვენი პასუხის გასაგზავნად
• მიეცით სახელი რადიო ღილაკებს. ESP ვებ სერვერის კლასი მიიღებს ამ სახელებს არგუმენტებად და მიიღებს რადიო ღილაკების პასუხს ამ არგუმენტების გამოყენებით
• ახლა ჩადეთ ღილაკი "SUBMIT", რომ გამოაგზავნოთ პასუხი მოწყობილობაზე.
• სხვა ვებ გვერდებზე ჩვენ გვაქვს ტექსტური ყუთები. მიეცით სახელის მნიშვნელობა და შეყვანის ტიპი ტექსტურ ყუთს და დაამატეთ გაგზავნის ღილაკი "გამოგზავნა" პასუხის გაგზავნა.
• შექმენით ღილაკი "გადატვირთვა" ტექსტური ველის შინაარსის გადასატვირთად.

// რადიო ღილაკი DHCP პარამეტრი

სტატიკური IP დაყენება

// ტექსტური ყუთების შეყვანა

// წარდგენის ღილაკი

input [type = "წარდგენა"] {background-color: #3498DB; / * მწვანე */ საზღვარი: არცერთი; ფერი: თეთრი; ბალიში: 15px 48px; text-align: ცენტრი; ტექსტი-გაფორმება: არცერთი; ჩვენება: შიდა ბლოკი; შრიფტის ზომა: 16px; }

// გადატვირთვის ღილაკი

input [type = "submit"] {background-color: #3498DB; / * მწვანე */ საზღვარი: არცერთი; ფერი: თეთრი; ბალიში: 15px 48px; text-align: ცენტრი; ტექსტი-გაფორმება: არცერთი; ჩვენება: შიდა ბლოკი; შრიფტის ზომა: 16px; }

ნაბიჯი 3: ვებ – გვერდის პასუხის მიღება ESP32– დან

ESP 32 მოწყობილობიდან ვებ გვერდების მომსახურება დიდი სიამოვნებაა. ეს შეიძლება იყოს არაფერი, ტემპერატურის მონაცემების ვებგვერდზე ჩვენება, პერსონალური ვებ – გვერდიდან LED– ების გადაქცევა ან მომხმარებლის WiFi მონაცემების შენახვა ვებ – გვერდის საშუალებით. ამ მიზნით, ESP 32 იყენებს ვებ სერვერის კლასს ვებ გვერდების სერვერზე.

• პირველი, შექმენით ვებ სერვერის კლასის მაგალითი 80 პორტში (HTTP პორტი).
• ახლა დააყენეთ ESP მოწყობილობა, როგორც softAP. მიეცით SSID და გასაღები და მიანიჭეთ მოწყობილობას სტატიკური IP.
• დაიწყეთ სერვერი.

// ********* SSID და Pass for AP **************/

const char *ssidAP = "მიეცი SSID"; const char *passAP = "გასაღები გასაღები";

// ********* სტატიკური IP კონფიგურაცია **************/IPAddress ap_local_IP (192, 168, 1, 77); IPAdress ap_gateway (192, 168, 1, 254); IPAddress ap_subnet (255, 255, 255, 0);

// ********* SoftAP კონფიგურაცია **************/

WiFi.mode (WIFI_AP);

Serial.println (WiFi.softAP (ssidAP, passAP)? "Soft-AP setup": "დაკავშირება ვერ მოხერხდა");

დაგვიანება (100); Serial.println (WiFi.softAPConfig (ap_local_IP, ap_gateway, ap_subnet)? "რბილი AP- ის კონფიგურაცია": "შეცდომა კონფიგურაციაში"); Serial.println (WiFi.softAPIP ());

// სერვერის დაწყება

server.begin ();

• შექმენით და მოემსახურეთ URL სხვადასხვა გამოძახების გამოყენებით.
• და გაუმკლავდეთ კლიენტს ასინქრონულად handleClient– ის გამოყენებით.

server.on ("/", handleRoot);

server.on ("/dhcp", handleDHCP); server.on ("/სტატიკური", handleStatic); // პასუხების დამუშავება server.handleClient ();

• ვებ გვერდებზე წვდომისათვის. დაუკავშირდით თქვენს მიერ შექმნილ AP– ს, რომელიც ჩამოთვლილია თქვენს WiFi ქსელებში. ახლა, გადადით ბრაუზერში, შეიყვანეთ ბოლო ეტაპზე თქვენ მიერ კონფიგურირებული IP და შედით ვებგვერდზე.
• ვებ სერვერის კლასი იღებს არგუმენტების სახით შეყვანის სახელებს ("ტექსტი", "ღილაკი", "რადიო ღილაკი" და სხვ.). ის ინახავს ამ შეყვანის პასუხებს არგუმენტებად და ჩვენ შეგვიძლია მივიღოთ მნიშვნელობები ან შევამოწმოთ ისინი args, arg, hasArg მეთოდების გამოყენებით.

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

Serial.println (სიმებიანი (server.argName (i)) + '\ t' + სიმებიანი (server.arg (i)));

}

if (server.hasArg ("ipv4static") && server.hasArg ("gateway") && server.hasArg ("ქვექსელი")) {staticSet (); } else if (server.arg ("ipv4")! = "") {dhcpSetManual (); } else {dhcpSetDefault (); }

ნაბიჯი 4: სტატიკური IP კონფიგურაცია

ჯერჯერობით ჩვენ გვესმის, თუ როგორ უნდა დავუკავშიროთ AP– ს და როგორ მივიღოთ მნიშვნელობები ვებ – გვერდის შეყვანის ველებიდან

ამ ეტაპზე ჩვენ დავაკონფიგურირებთ სტატიკურ IP- ს

• აირჩიეთ სტატიკური IP პარამეტრი და დააჭირეთ ღილაკს გაგზავნა. თქვენ გადამისამართდებით შემდეგ გვერდზე.
• მომდევნო გვერდზე შეიყვანეთ სტატიკური IP მისამართი, კარიბჭის მისამართი და ქვექსელის ნიღაბი.
• მიიღეთ ტექსტური ველების მნიშვნელობა server.arg () მეთოდის გამოყენებით.

სიმებიანი ipv4static = სიმებიანი (server.arg ("ipv4static"));

სიმებიანი კარიბჭე = სიმებიანი (server.arg ("კარიბჭე")); სიმებიანი ქვექსელი = სიმებიანი (server.arg ("ქვექსელი"));

• ახლა, ეს ღირებულებები სერიულია JSON ფორმატში.
• შემდეგ ჩვენ დავწერთ JSON– ს SPIFFS– ში.

root ["statickey"] = "staticSet";

root ["staticIP"] = ipv4static;

root ["gateway"] = კარიბჭე;

root ["subnet"] = ქვექსელი;

ფაილის ფაილიToWrite = SPIFFS.open ("/ip_set.txt", FILE_WRITE);

if (root.printTo (fileToWrite)) {

Serial.println ("-ფაილი დაწერილია"); }

• ეს კონფიგურაცია შენახულია SPIFFS– ში. მოგვიანებით, ეს მნიშვნელობები იკითხება SPIFFS– დან.
• შემდეგ სტატიკური IP მნიშვნელობები გაანალიზებულია JSON– დან.

ფაილის ფაილი = 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")) {

სიმებიანი ipStaticValue = readRoot ["staticIP"];

სიმებიანი gatewayValue = readRoot ["gateway"];

სიმებიანი subnetValue = readRoot ["ქვექსელი"];

ნაბიჯი 5: DHCP პარამეტრები

ამ ეტაპზე, ჩვენ დავაკონფიგურირებთ DHCP პარამეტრებს

აირჩიეთ DHCP პარამეტრები ინდექსის გვერდიდან და დააწკაპუნეთ "გაგზავნაზე"

• თქვენ გადამისამართდებით შემდეგ გვერდზე. შემდეგ გვერდზე შეიყვანეთ IP მისამართი ან შეარჩიეთ ნაგულისხმევი და დააწკაპუნეთ ღილაკზე "გაგზავნა" პასუხის გასაგზავნად. ეს გვერდი მოემსახურება "/dhcp" - ს, რომელსაც ამუშავებს handleDHCP გამოძახების მეთოდი. მიიღეთ ტექსტური ველების მნიშვნელობა server.arg () მეთოდის გამოყენებით. როდესაც დააწკაპუნეთ აირჩიეთ ნაგულისხმევი ყუთი. 192.168.4.1 IP მიეცემა მოწყობილობას.
• ახლა, ეს ღირებულებები სერიულია JSON ფორმატში.
• შემდეგ ჩვენ დავწერთ JSON– ს SPIFFS– ში.

JsonObject & root = jsonBuffer.createObject ();

root ["dhcpManual"] = "dhcpManual";

root ["dhcpIP"] = "192.168.4.1";

ფაილის ფაილიToWrite = SPIFFS.open ("/ip_set.txt", FILE_WRITE);

if (root.printTo (fileToWrite)) {

Serial.println ("-ფაილი დაწერილია"); }

• ეს კონფიგურაცია შენახულია SPIFFS– ში. მოგვიანებით, ეს მნიშვნელობები იკითხება SPIFFS– დან.
• Dhcp IP მნიშვნელობები შემდეგ გაანალიზებულია JSON– დან.

ფაილის ფაილი = 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 ("dhcpDefault")) {

სიმებიანი ipdhcpValue = readRoot ["dhcpIP"];

Serial.println (ipdhcpValue);

dhcpAPConfig ();}

ნაბიჯი 6: WiFi სერთიფიკატების შენახვა

ჯერჯერობით, ჩვენ შევარჩიეთ IP კონფიგურაცია. ახლა ჩვენ უნდა შევინახოთ მომხმარებლის wifi სერთიფიკატები. ამ სიტუაციის მოსაგვარებლად. ჩვენ მივყვებით ამ პროცედურას.

• ახლა ჩვენ გვაქვს ჩვენი მოწყობილობის AP დაყენება DHCP ან სტატიკური IP კონფიგურაციით, რომელიც ჩვენ შევარჩიეთ ბოლო ნაბიჯებში ნახსენები ტყვე პორტალიდან.
• ვთქვათ, ჩვენ შევარჩიეთ სტატიკური IP კონფიგურაცია.
• ამ IP– ზე ჩვენ დავაკონფიგურირებთ softAP– ს.
• SPIFFS– ის მნიშვნელობების წაკითხვისა და JSON– დან ამ მნიშვნელობების გაანალიზების შემდეგ. ჩვენ დავაკონფიგურირებთ softAP ამ IP– ზე.
• გადააქციეთ IP სტრიქონი ბაიტებად.

ბაიტი 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];

IP მისამართები ap_local (ip0, ip1, ip2, ip3);

// *************** სტრიქონიდან ბაიტების გაანალიზება ******************

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

for (int i = 0; i <maxBytes; i ++) {

ბაიტი = strtoul (str, NULL, base);

str = strchr (str, sep);

if (str == NULL || *str == '\ 0') {

შესვენება;

}

str ++;

}}

ახლა ჩვენ დავაკონფიგურიროთ softAP ამ IP– ზე

Serial.println (WiFi.softAPConfig (ap_localWeb_IP, ap_gate, ap_net)? "SoftAP კონფიგურაცია": "არ არის დაკავშირებული"); Serial.println (WiFi.softAPIP ());

• ახლა დაიწყეთ ვებ სერვერი და მიაწოდეთ ვებ გვერდი ამ IP– ზე. მომხმარებლის WiFi სერთიფიკატების შესასვლელად.
• ვებ გვერდი შედგება ორი ტექსტური ველისგან, სადაც უნდა შეიყვანოთ SSID და პაროლი.
• handleStaticForm არის გამოძახების მეთოდი, რომელიც ემსახურება ვებ გვერდს.
• server.handleClient () ზრუნავს მოთხოვნაზე და პასუხებზე ვებ გვერდზე და მისგან.

server.begin ();

server.on ("/", handleStaticForm);

server.onNotFound (handleNotFound);

STIMER = მილილი ();

while (millis ()-STimer <= SInterval) {

server.handleClient (); }

HTML ფორმა ინახება SPIFFS– ში. ჩვენ ვამოწმებთ შესაბამის არგუმენტებს server.arg () გამოყენებით. SSID და პაროლის მნიშვნელობის მისაღებად

ფაილის ფაილი = SPIFFS.open ("/WiFi.html", "r");

server.streamFile (ფაილი, "text/html");

file.close ();

ნაბიჯი 7: წაიკითხეთ და ჩაწერეთ SPIFFS– დან

SPIFFS

სერიული პერიფერიული ინტერფეისი Flash ფაილური სისტემა, ან მოკლედ SPIFFS. ეს არის მსუბუქი ფაილური სისტემა მიკროკონტროლერებისთვის SPI ფლეშ ჩიპით. ESP32– ის საბორტო ფლეშ ჩიპს აქვს ბევრი ადგილი თქვენი ვებ გვერდებისათვის. ჩვენ ასევე შევინახეთ ჩვენი ვებ გვერდი Flash სისტემაში. არსებობს რამდენიმე ნაბიჯი, რომელიც უნდა დავიცვათ მონაცემების ასატვირთად სფიფებში

ჩამოტვირთეთ ESP 32 SPIFFS მონაცემთა ატვირთვის ინსტრუმენტი:

• თქვენს Arduino ჩანახატების კატალოგში შექმენით ინსტრუმენტების დირექტორია, თუ ის ჯერ არ არსებობს
• გახსენით ინსტრუმენტი ინსტრუმენტების დირექტორიაში (გზა გამოიყურება /Arduino/tools/ESP32FS/tool/esp32fs.jar)
• გადატვირთეთ Arduino IDE
• გახსენით ესკიზი (ან შექმენით ახალი და შეინახეთ)
• გადადით ესკიზის დირექტორიაში (აირჩიეთ ესკიზი> ესკიზის საქაღალდის ჩვენება)
• შექმენით დირექტორია სახელით მონაცემები და ნებისმიერი ფაილი, რომელიც გსურთ ფაილურ სისტემაში. ჩვენ ავტვირთეთ ჩვენი HTML გვერდი სახელწოდებით webform.html
• დარწმუნდით, რომ შეარჩიეთ დაფა, პორტი და დახურული სერიული მონიტორი
• აირჩიეთ ინსტრუმენტები> ESP8266 ესკიზის მონაცემთა ატვირთვა. ეს უნდა დაიწყოს ფაილების ატვირთვა ESP8266 ფლეშ ფაილურ სისტემაში. დასრულების შემდეგ, IDE სტატუსის ზოლი გამოჩნდება SPIFFS გამოსახულების ატვირთული შეტყობინება.

void handleDHCP () {ფაილის ფაილი = SPIFFS.open ("/page_dhcp.html", "r"); server.streamFile (ფაილი, "text/html"); file.close ();}

void handleStatic () {

ფაილის ფაილი = SPIFFS.open ("/page_static.html", "r"); server.streamFile (ფაილი, "text/html"); file.close ();}

წერა SPIFFS– ზე

აქ ჩვენ ვწერთ შენახულ პარამეტრს SPIFFS– ში, რათა მომხმარებლებმა არ უნდა გაიარონ ეს ნაბიჯები, როდესაც მოწყობილობა გადატვირთულია.

• გადააქციეთ ვებგვერდიდან მიღებული არგუმენტები JSON ობიექტებად
• ჩაწერეთ ეს JSON SPIFFS- ში შენახული.txt ფაილში.

სიმებიანი ipv4static = სიმებიანი (server.arg ("ipv4static"));

სიმებიანი კარიბჭე = სიმებიანი (server.arg ("კარიბჭე")); სიმებიანი ქვექსელი = სიმებიანი (server.arg ("ქვექსელი")); root ["statickey"] = "staticSet"; root ["staticIP"] = ipv4static; root ["gateway"] = კარიბჭე; root ["subnet"] = ქვექსელი; სიმებიანი JSONStatic; char JSON [120]; root.printTo (სერიული); root.prettyPrintTo (JSONStatic); JSONStatic.toCharArray (JSON, sizeof (JSONStatic) +2); ფაილის ფაილიToWrite = SPIFFS.open ("/ip_set.txt", FILE_WRITE); if (! fileToWrite) {Serial.println ("შეცდომა SPIFFS გახსნისას"); } if (fileToWrite.print (JSON)) {Serial.println ("-ფაილი დაწერილია"); } else {Serial.println ("-ფაილის ჩაწერის შეცდომა"); } fileToWrite.close ();

ნაბიჯი 8: საერთო კოდი

HTML და ESP32– ის ზედმეტი კოდი შეგიძლიათ იხილოთ ამ Github საცავში