የማይንቀሳቀስ እና የዲኤችሲፒ አይፒ ቅንብሮችን ለማዋቀር ESP32 Captive Portal: 8 ደረጃዎች

2024 ደራሲ ደራሲ: John Day | [email protected]. ለመጨረሻ ጊዜ የተሻሻለው: 2024-01-30 07:31

ESP 32 የተቀናጀ WiFi እና BLE ያለው መሣሪያ ነው። ለ IoT ፕሮጀክቶች ጥሩ ዓይነት ነው። የእርስዎን SSID ፣ የይለፍ ቃል እና የአይፒ ውቅሮች ብቻ ይስጡ እና ነገሮችን በደመና ውስጥ ያዋህዱ። ግን የአይፒ ቅንብሮችን እና የተጠቃሚ ምስክርነቶችን ማስተዳደር ለተጠቃሚው ራስ ምታት ሊሆን ይችላል።

ተጠቃሚው የ WiFi ምስክርነቶችን መለወጥ ቢፈልግስ?

ተጠቃሚው የ DHCP/Static IP ቅንብሮችን ለመቀየር ቢፈልግስ?

ESP32 ን ሁል ጊዜ ማብራት አስተማማኝ እና ለእነዚህ ችግሮች መፍትሄም አይደለም። እዚህ በዚህ መመሪያ ውስጥ እኛ ለማሳየት እንሄዳለን።

• ምርኮኛ መግቢያ እንዴት መፍጠር እንደሚቻል።
• የድር ቅጽ ከ ESP32 ማስተናገድ።
• ከ SPIFFS ESP32 ማንበብ እና መጻፍ።
• ለስላሳ የመዳረሻ ነጥብ መፍጠር እና ከአንድ ጣቢያ ጋር መገናኘት

ደረጃ 1 የሃርድዌር እና የሶፍትዌር ዝርዝር

የሃርድዌር ዝርዝር መግለጫ

• ESP32 WiFi/BLE
• የገመድ አልባ ሙቀት እና እርጥበት ዳሳሽ

የሶፍትዌር ዝርዝር

አርዱዲኖ አይዲኢ

ደረጃ 2 - ምርኮኛ ፖርታል መፍጠር

ምርኮኛ ፖርታል ለአውታረ መረብ ሀብቶች ሰፊ ተደራሽነት ከመሰጠታቸው በፊት ለአዲስ ለተገናኙ ተጠቃሚዎች የሚታይ የድር ገጽ ነው። በ DHCP እና በስታቲክ አይፒ ቅንብሮች መካከል ለመምረጥ እዚህ ሶስት የድር ገጾችን እያቀረብን ነው። የአይፒ አድራሻውን ለ ESP በሁለት መንገዶች መግለፅ እንችላለን።

• የ DHCP አይፒ አድራሻ- የአይፒ አድራሻውን ለመሣሪያው በተለዋዋጭ የመመደብ መንገድ ነው። የ ESP ነባሪ IP አድራሻ 192.168.4.1 ነው
• የማይንቀሳቀስ አይፒ አድራሻ- ለአውታረ መረብ መሣሪያችን ቋሚ የአይፒ አድራሻ መመደብ። የማይንቀሳቀስ አይፒን ለመሣሪያው የአይፒ አድራሻውን ፣ የመግቢያ አድራሻውን እና ንዑስ መረብ ጭምብልን ለመግለፅ ያስፈልገናል።

በመጀመሪያው ድረ -ገጽ ውስጥ በ DHCP እና በስታቲክ አይፒ ቅንብሮች መካከል ለመምረጥ ተጠቃሚው በሬዲዮ አዝራሮች ተሰጥቷል። በሚቀጥለው ድረ -ገጽ ፣ የበለጠ ለመቀጠል ከአይፒ ጋር የተዛመደ መረጃ ማቅረብ አለብን።

የኤችቲኤምኤል ኮድ

ለድር ገጾች የኤችቲኤምኤል ኮድ በዚህ የ Github ማከማቻ ውስጥ ሊገኝ ይችላል።

የኤችቲኤምኤል ድረ -ገጾችን ለመሥራት ማንኛውንም አይዲኢ ወይም የጽሑፍ አርታዒን እንደ Sublime ወይም notepad ++ መጠቀም ይችላሉ።

• በ DHCP እና በስታቲክ አይፒ ቅንብሮች መካከል ለመምረጥ በመጀመሪያ ሁለት የሬዲዮ ቁልፎችን የያዘ የኤችቲኤምኤል ድረ -ገጽ ይፍጠሩ።
• አሁን ምላሽዎን ለማስገባት አዝራሩን ይፍጠሩ
• ለሬዲዮ አዝራሮች የተወሰነ ስም ይስጡ። የ ESP ድር አገልጋይ ክፍል እነዚህን ስሞች እንደ ነጋሪ እሴት ወስዶ እነዚህን ክርክሮች በመጠቀም የሬዲዮ ቁልፎቹን ምላሽ ያገኛል
• ምላሹን ወደ መሣሪያው ለመላክ አሁን 'SUBMIT' የሚለውን ቁልፍ ያስገቡ።
• በሌሎች ድረ -ገጾች ውስጥ የጽሑፍ ሳጥኖች አሉን። ለጽሑፍ ሳጥኑ የስም እሴቱን እና የግቤት ዓይነቱን ይስጡ እና ምላሹን ወደ ‹አስገባ› የማስረከቢያ ቁልፍ ያክሉ።
• የጽሑፍ መስክ ይዘትን ዳግም ለማስጀመር የ «ዳግም አስጀምር» ቁልፍን ይፍጠሩ።

// የሬዲዮ አዝራር DHCP ቅንብር

የማይንቀሳቀስ አይፒ ቅንብር

// የግቤት የጽሑፍ ሳጥኖች

// አስገባ አዝራር

ግብዓት [type = "submit"] {የጀርባ ቀለም- #3498DB; / * አረንጓዴ */ ድንበር: የለም; ቀለም: ነጭ; መለጠፍ: 15 ፒክስል 48 ፒክስል; ጽሑፍ-አሰላለፍ: መሃል; ጽሑፍ-ማስጌጥ: የለም; ማሳያ: የመስመር ውስጥ ማገጃ; የቅርጸ-ቁምፊ መጠን-16 ፒክስል; }

// ዳግም አስጀምር አዝራር

ግብዓት [type = "submit"] {የጀርባ ቀለም- #3498DB; / * አረንጓዴ */ ድንበር: የለም; ቀለም: ነጭ; መለጠፍ: 15 ፒክስል 48 ፒክስል; ጽሑፍ-አሰላለፍ: መሃል; ጽሑፍ-ማስጌጥ: የለም; ማሳያ: የመስመር ውስጥ ማገጃ; የቅርጸ-ቁምፊ መጠን-16 ፒክስል; }

ደረጃ 3 የድር ምላሽ ከድር ገጾች ወደ ESP32 ማግኘት

ከ ESP 32 መሣሪያ የድር ገጾችን ማገልገል በጣም አስደሳች ነው። በድረ -ገፁ ውስጥ ያለውን የሙቀት መጠን መረጃ ከማሳየት ፣ መሪዎቹን ከብጁ ድረ -ገጽ በማዞር ወይም የተጠቃሚ WiFi ምስክርነቶችን በድረ -ገጽ በማከማቸት ከማንኛውም ነገር ሊሆን ይችላል። ለዚሁ ዓላማ ፣ ESP 32 የድር አገልጋይ ክፍልን ወደ አገልጋይ ድረ ገጾች ይጠቀማል።

• በመጀመሪያ ፣ ወደብ 80 (የኤችቲቲፒ ወደብ) ላይ የዌብ ሰርቨር ክፍል ምሳሌን ይፍጠሩ።
• አሁን የ ESP መሣሪያውን እንደ softAP ያዘጋጁ። SSID ን እና የይለፍ ቁልፍን ይስጡ እና የማይንቀሳቀስ አይፒን ለመሣሪያው ይመድቡ።
• አገልጋዩን ይጀምሩ።

// ********* SSID እና ለ AP **************/

const char *ssidAP = "SSID ን ይስጡ"; const char *passAP = "የማለፊያ ቁልፍ";

// ********* የማይንቀሳቀስ IP ውቅር **************/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.mode (WIFI_AP);

Serial.println (WiFi.softAP (ssidAP, passAP)? "Soft-AP setup": "መገናኘት አልተሳካም");

መዘግየት (100); Serial.println (WiFi.softAPConfig (ap_local_IP ፣ ap_gateway ፣ ap_subnet)? "Soft AP ን በማዋቀር ላይ": "በማዋቀር ላይ ስህተት"); Serial.println (WiFi.softAPIP ());

// አገልጋዩን ይጀምሩ

server.begin ();

• የተለያዩ ጥሪዎችን በመጠቀም ዩአርኤሉን ይፍጠሩ እና ያገልግሉ።
• እና የእጅ ደንበኛን በመጠቀም ደንበኛውን ባልተመጣጠነ ሁኔታ ያስተናግዱ።

server.on ("/", handleRoot);

server.on ("/dhcp" ፣ handleDHCP); server.on ("/የማይንቀሳቀስ" ፣ handleStatic); // የምላሽ አገልጋዩን ያስተናግዱ.handleClient ();

• የድር ገጾችን ለመድረስ። በ WiFi አውታረ መረቦችዎ ውስጥ ከተዘረዘሩት እርስዎ አሁን ከፈጠሩት AP ጋር ይገናኙ። አሁን ወደ አሳሽ ይሂዱ ፣ በመጨረሻው ደረጃ በእርስዎ የተዋቀረውን አይፒ ያስገቡ እና ወደ ድረ -ገጹ ይሂዱ።
• የድር አገልጋይ ክፍል ለግብዓቶች የተሰጠውን ስም ('ጽሑፍ' ፣ 'አዝራር' ፣ 'ራዲዮ ቡትቶን ወዘተ) እንደ ክርክር ይወስዳል። የእነዚህን ግብዓቶች ምላሾች እንደ ክርክር ያስቀምጣል እና እሴቶችን ማግኘት ወይም አርጎስ ፣ አርአር ፣ ሃአርግ ዘዴዎችን በመጠቀም ልንፈትሻቸው እንችላለን።

ከሆነ (server.args ()> 0) {ለ (int i = 0; i <= server.args (); i ++) {

Serial.println (ሕብረቁምፊ (server.argName (i)) + '\ t' + String (server.arg (i)));

}

ከሆነ (server.hasArg ("ipv4static") && server.hasArg ("gateway") && server.hasArg ("subnet")) {staticSet (); } ሌላ ከሆነ (server.arg ("ipv4")! = "") {dhcpSetManual (); } ሌላ {dhcpSetDefault (); }

ደረጃ 4: የማይንቀሳቀስ IP ውቅር

እስካሁን ድረስ ከኤፒአይ ጋር እንዴት እንደሚገናኙ እና እሴቶቹን ከድረ -ገፁ መስኮች እንዴት እንደሚያገኙ ተረድተናል።

በዚህ ደረጃ ፣ የማይንቀሳቀስ አይፒን እናዋቅራለን

• የማይንቀሳቀስ አይፒ ቅንብሩን ይምረጡ እና አስገባ የሚለውን ቁልፍ ጠቅ ያድርጉ። ወደ ቀጣዩ ገጽ ይዛወራሉ።
• በሚቀጥለው ገጽ ውስጥ የማይንቀሳቀስ የአይፒ አድራሻውን ፣ የመግቢያ አድራሻውን እና ንዑስ ጭምብልን ያስገቡ ይህ ገጽ በ “/የማይንቀሳቀስ” (“static”) በሚስተናገድበት የማይንቀሳቀስ የመደወያ ዘዴ ይስተናገዳል።
• Server.arg () ዘዴን በመጠቀም የጽሑፍ መስኮች ዋጋን ያግኙ።

ሕብረቁምፊ ipv4static = ሕብረቁምፊ (server.arg ("ipv4static")));

ሕብረቁምፊ መግቢያ በር = ሕብረቁምፊ (server.arg (“ጌትዌይ”)); ሕብረቁምፊ ንዑስ አውታረ መረብ = ሕብረቁምፊ (server.arg (“ንዑስ መረብ”));

• አሁን ፣ እነዚህ እሴቶች በ JSON ቅርጸት በተከታታይ ተደርገዋል።
• ከዚያ JSON ን ወደ SPIFFS እንጽፋለን።

ሥር ["statickey"] = "staticSet";

ሥር ["staticIP"] = ipv4static;

ሥር ["ጌትዌይ"] = መተላለፊያ;

ሥር ["ንዑስ መረብ"] = ንዑስ መረብ;

ፋይል ፋይል Toorite = SPIFFS.open ("/ip_set.txt" ፣ FILE_WRITE);

ከሆነ (root.printTo (fileToWrite)) {

Serial.println ("-ፋይል ተፃፈ"); }

• ይህ ውቅረት በ SPIFFS ውስጥ ይቀመጣል። በኋላ ፣ እነዚህ እሴቶች ከ SPIFFS ተነበዋል።
• የማይንቀሳቀስ የአይፒ እሴቶቹ ከዚያ ከ JSON ይተረጎማሉ።

የፋይል ፋይል = SPIFFS.open ("/ip_set.txt", "r");

ሳለ (ፋይል. ይገኛል ()) {

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

ከሆነ (debugLogData.length ()> 5) {

JsonObject & readRoot = jsonBuffer.parseObject (debugLogData);

ከሆነ (readRoot.containsKey ("statickey")) {

ሕብረቁምፊ ipStaticValue = readRoot ["staticIP"];

ሕብረቁምፊ ጌትዌይValue = readRoot ["gateway"];

ሕብረቁምፊ subnetValue = readRoot ["subnet"];

ደረጃ 5 የ DHCP ቅንብሮች

በዚህ ደረጃ ፣ የ DHCP ቅንብሮችን እናዋቅራለን

ከጠቋሚ ገጹ የ DHCP ቅንብሮችን ይምረጡ እና “አስገባ” ላይ ጠቅ ያድርጉ

• ወደ ቀጣዩ ገጽ ይዛወራሉ። በሚቀጥለው ገጽ ውስጥ የአይፒ አድራሻውን ያስገቡ ወይም ነባሪውን ይምረጡ እና ምላሹን ለማስገባት “አስገባ” ቁልፍን ጠቅ ያድርጉ። ይህ ገጽ በ ‹DCDP› መልሶ ማግኛ ዘዴ በሚያዘው ‹/dhcp› ላይ ያገለግላል። Server.arg () ዘዴን በመጠቀም የጽሑፍ መስኮች ዋጋን ያግኙ። ጠቅ ሲያደርጉ ነባሪ አመልካች ሳጥን ይምረጡ። 192.168.4.1 አይፒ ለመሣሪያው ይሰጣል።
• አሁን ፣ እነዚህ እሴቶች በ JSON ቅርጸት በተከታታይ ተደርገዋል።
• ከዚያ JSON ን ወደ SPIFFS እንጽፋለን።

JsonObject & root = jsonBuffer.createObject ();

ሥር ["dhcpManual"] = "dhcpManual";

ሥር ["dhcpIP"] = "192.168.4.1";

ፋይል ፋይል Toorite = SPIFFS.open ("/ip_set.txt" ፣ FILE_WRITE);

ከሆነ (root.printTo (fileToWrite)) {

Serial.println ("-ፋይል ተፃፈ"); }

• ይህ ውቅረት በ SPIFFS ውስጥ ይቀመጣል። በኋላ ፣ እነዚህ እሴቶች ከ SPIFFS ተነበዋል።
• የ dhcp IP እሴቶች ከዚያ ከ JSON ይተረጎማሉ።

የፋይል ፋይል = SPIFFS.open ("/ip_set.txt", "r") ፤ ሳለ (file.available ()) {debugLogData += char (file.read ()); } ከሆነ (debugLogData.length ()> 5) {JsonObject & readRoot = jsonBuffer.parseObject (debugLogData);

ከሆነ (readRoot.containsKey ("dhcpDefault")) {

ሕብረቁምፊ ipdhcpValue = readRoot ["dhcpIP"];

Serial.println (ipdhcpValue);

dhcpAPConfig ();}

ደረጃ 6 - የ WiFi ምስክርነቶችን በማስቀመጥ ላይ

ለአሁን ፣ የአይፒ ውቅሩን መርጠናል። አሁን የተጠቃሚውን የ wifi ምስክርነቶች ማስቀመጥ አለብን። ይህንን ሁኔታ ለመፍታት። ይህንን አሰራር ተከትለናል።

• ስለዚህ አሁን በመጨረሻ ደረጃዎች ውስጥ ከተጠቀሰው ምርኮኛ በር መርጠን በ DHCP ወይም በስታቲክ አይፒ ውቅር ውስጥ የእኛ መሣሪያ AP ማዋቀር አለን።
• የስታቲክ አይፒ ውቅረትን መርጠናል እንበል።
• በዚህ አይፒ ላይ softAP ን እናዋቅራለን።
• እሴቶቹን ከ SPIFFS ካነበቡ እና እነዚህን እሴቶች ከ JSON በመተንተን። በዚህ አይፒ ላይ softAP ን እናዋቅራለን።
• የአይፒ ሕብረቁምፊን ወደ ባይት ይለውጡ።

ባይት 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);

// *************** ባይት ከ ሕብረቁምፊ ይለዩ ****************** //

ባዶ ባዶነት ባይት (const char* str ፣ char sep ፣ byte* bytes ፣ int maxBytes ፣ int base) {

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

ባይቶች = strtoul (str ፣ NULL ፣ base);

str = strchr (str, sep);

ከሆነ (str == NULL || *str == '\ 0') {

ሰበር;

}

str ++;

}}

አሁን softAP ን በዚህ አይፒ ላይ እናዋቅራለን

Serial.println (WiFi.softAPConfig (ap_localWeb_IP ፣ ap_gate ፣ ap_net)? "SoftAP በማዋቀር ላይ": "አልተገናኘም"); Serial.println (WiFi.softAPIP ());

• አሁን የድር አገልጋዩን ይጀምሩ እና በዚህ አይፒ ላይ አንድ ድረ -ገጽ ያቅርቡ። የተጠቃሚውን የ WiFi ምስክርነቶች ለማስገባት።
• ድረ -ገጹ SSID እና የይለፍ ቃል ለማስገባት ሁለት የጽሑፍ መስኮች አሉት።
• handleStaticForm ድረ -ገጹን የሚያገለግል የመልሶ ማግኛ ዘዴ ነው።
• server.handleClient () ጥያቄውን እና ከድረ -ገጹ ወደ እና ከሱ ምላሽ ይሰጣል።

server.begin ();

server.on ("/", handleStaticForm);

server.onNotFound (handleNotFound);

Stimer = millis ();

ሳለ (ሚሊስ ()-STimer <= SInterval) {

server.handleClient (); }

የኤችቲኤምኤል ቅጽ በ SPIFFS ውስጥ ይቀመጣል። server.arg () ን በመጠቀም ተስማሚ ክርክሮችን እንፈትሻለን። የ SSID እና የይለፍ ቃል ዋጋን ለማግኘት።

የፋይል ፋይል = SPIFFS.open ("/WiFi.html", "r");

server.streamFile (ፋይል ፣ “ጽሑፍ/html”);

file.close ();

ደረጃ 7 ከ SPIFFS ያንብቡ እና ይፃፉ

SPIFFS

ተከታታይ የፔሪፈራል በይነገጽ ፍላሽ ፋይል ስርዓት ፣ ወይም SPIFFS በአጭሩ። ከ SPI ፍላሽ ቺፕ ጋር ለማይክሮ መቆጣጠሪያዎች ቀላል ክብደት ፋይል ስርዓት ነው። የ ESP32 የመርከብ ፍላሽ ቺፕ ለድር ገጾችዎ ብዙ ቦታ አለው። እንዲሁም የእኛን ድረ -ገጽ በፍላሽ ስርዓት ውስጥ አከማችተናል። መረጃን ወደ ስፒፍስ ለመስቀል መከተል ያለብን ጥቂት ደረጃዎች አሉ

የ ESP 32 SPIFFS የውሂብ ሰቀላ መሣሪያን ያውርዱ

• በእርስዎ Arduino sketchbook ማውጫ ውስጥ ፣ እስካሁን ከሌለ የመሣሪያዎች ማውጫ ይፍጠሩ
• መሣሪያውን በመሳሪያዎች ማውጫ ውስጥ ይንቀሉት (ዱካው/አርዱዲኖ/tools/ESP32FS/tool/esp32fs.jar ይመስላል)
• Arduino IDE ን እንደገና ያስጀምሩ
• ንድፍ ይሳሉ (ወይም አዲስ ይፍጠሩ እና ያስቀምጡት)
• ወደ ረቂቅ ማውጫ ይሂዱ (ንድፍን ይምረጡ> የስዕል አቃፊን አሳይ)
• እዚያ ውስጥ ባለው ፋይል ስርዓት ውስጥ የሚፈልጉትን ውሂብ እና የሚፈልጉትን ማንኛውንም ፋይል ይፍጠሩ። የኤችቲኤምኤል ገጻችንን በስም webform.html ሰቅለነዋል
• አንድ ሰሌዳ ፣ ወደብ እና የተዘጉ ተከታታይ ሞኒተርን መምረጥዎን ያረጋግጡ
• መሳሪያዎችን> ESP8266 ረቂቅ የውሂብ ስቀልን ይምረጡ። ይህ ፋይሎቹን ወደ ESP8266 ፍላሽ ፋይል ስርዓት መስቀል መጀመር አለበት። ሲጨርሱ የ IDE ሁኔታ አሞሌ የ SPIFFS ምስል የተሰቀለውን መልእክት ያሳያል።

ባዶ እጀታDHCP () {ፋይል ፋይል = SPIFFS.open ("/page_dhcp.html", "r"); server.streamFile (ፋይል ፣ “ጽሑፍ/html”); file.close ();}

ባዶነት handleStatic () {

ፋይል ፋይል = SPIFFS.open ("/page_static.html", "r"); server.streamFile (ፋይል ፣ “ጽሑፍ/html”); file.close ();}

ለ SPIFFS መጻፍ

ተጠቃሚዎች መሣሪያውን ዳግም በሚያስጀምርበት ጊዜ ሁሉ እነዚህን እርምጃዎች ማለፍ እንደሌለባቸው እዚህ የተቀመጠውን ቅንብር ወደ SPIFFS እንጽፋለን።

• ከድር ገጹ የተቀበሉትን ክርክሮች ወደ JSON ዕቃዎች ይለውጡ
• ይህንን JSON በ SPIFFS ውስጥ ወደተቀመጠው.txt ፋይል ይፃፉ።

ሕብረቁምፊ ipv4static = ሕብረቁምፊ (server.arg ("ipv4static"));

ሕብረቁምፊ መግቢያ በር = ሕብረቁምፊ (server.arg (“ጌትዌይ”)); ሕብረቁምፊ ንዑስ አውታረ መረብ = ሕብረቁምፊ (server.arg (“ንዑስ”)); ሥር ["statickey"] = "staticSet"; ሥር ["staticIP"] = ipv4static; ሥር ["ጌትዌይ"] = መተላለፊያ; ሥር ["ንዑስ መረብ"] = ንዑስ መረብ; ሕብረቁምፊ JSONStatic; ቻር JSON [120]; root.printTo (ተከታታይ); root.prettyPrintTo (JSONStatic); JSONStatic.toCharArray (JSON ፣ sizeof (JSONStatic) +2); ፋይል ፋይል Toorite = SPIFFS.open ("/ip_set.txt" ፣ FILE_WRITE); ከሆነ (! fileToWrite) {Serial.println ("SPIFFS ን መክፈት ላይ ስህተት"); } ከሆነ (fileToWrite.print (JSON)) {Serial.println ("-ፋይል የተፃፈ"); } ሌላ {Serial.println ("-ፋይል መጻፍ ስህተት"); } fileToWrite.close ();

ደረጃ 8 - አጠቃላይ ኮድ

ለኤችቲኤምኤል እና ለ ESP32 የ Over ኮድ በዚህ የ Github ማከማቻ ውስጥ ይገኛል