Portal ya kukamata ya ESP32 ili Kusanidi Mipangilio ya IP ya Static na DHCP: Hatua 8

2024 Mwandishi: John Day | [email protected]. Mwisho uliobadilishwa: 2024-01-30 12:52

ESP 32 ni kifaa kilicho na WiFi iliyojumuishwa na BLE. Ni aina ya neema kwa miradi ya IoT. Toa tu usanidi wako wa SSID, nywila na IP na ujumuishe vitu kwenye wingu. Lakini, kudhibiti mipangilio ya IP na sifa za Mtumiaji inaweza kuwa maumivu ya kichwa kwa mtumiaji.

Je! Ikiwa Mtumiaji anataka kubadilisha sifa za WiFi?

Je! Ikiwa mtumiaji anataka kubadili mipangilio ya IP ya DHCP / Static?

Kuangaza ESP32 kila wakati sio kuaminika na hata suluhisho la shida hizi. Hapa katika hii inayoweza kufundishwa tutakuwa tukionyesha.

• Jinsi ya kuunda bandari ya wafungwa.
• Kukaribisha fomu ya wavuti kutoka kwa ESP32.
• Kusoma na Kuandika kutoka kwa SPIFFS ESP32.
• Kuunda Kituo cha Upataji laini na kuunganisha kituo

Hatua ya 1: Uainishaji wa vifaa na programu

Ufafanuzi wa Vifaa

• ESP32 WiFi / BLE
• Joto lisilo na waya na Sura ya Unyevu

Uainishaji wa Programu

Arduino IDE

Hatua ya 2: Kuunda Portal ya Mateka

Lango la wafungwa ni ukurasa wa wavuti ambao huonyeshwa kwa watumiaji wapya waliounganishwa t kabla ya kupewa ufikiaji mpana wa rasilimali za mtandao. Hapa tunatumikia kurasa tatu za wavuti kuchagua kati ya DHCP na Mipangilio ya IP tuli. tunaweza kufafanua anwani ya IP kwa ESP kwa njia mbili.

• Anwani ya IP ya DHCP - ni njia ya kupeana anwani ya IP kwa kifaa. Anwani ya IP ya default ya ESP ni 192.168.4.1
• Anwani ya IP tuli-kupeana anwani ya IP ya kudumu kwa kifaa chetu cha mtandao. kutoa IP tuli kwa kifaa tunachohitaji kufafanua anwani ya IP, anwani ya lango, na kinyago cha subnet.

Katika ukurasa wa kwanza, Mtumiaji hutolewa na vifungo vya redio kuchagua kati ya mipangilio ya IP ya DHCP na Static. Katika ukurasa wa wavuti unaofuata, lazima tupe habari zinazohusiana na IP ili kuendelea zaidi.

Nambari ya HTML

Nambari ya HTML ya kurasa za wavuti inaweza kupatikana katika hazina hii ya Github.

Unaweza kutumia IDE yoyote au mhariri wa maandishi kama Sublime au notepad ++ kutengeneza kurasa za wavuti za HTML.

• Kwanza Unda ukurasa wa wavuti wa HTML ulio na vifungo viwili vya redio kuchagua kati ya DHCP na Mipangilio ya IP ya tuli.
• Sasa tengeneza kitufe cha kuwasilisha majibu yako
• Toa jina kwa vifungo vya redio. Darasa la seva ya Wavuti ya ESP itachukua majina haya kama hoja na kupata majibu ya vifungo vya redio kutumia hoja hizi
• Sasa ingiza kitufe cha 'SUBMIT' ili upeleke majibu kwenye kifaa.
• Katika kurasa zingine za wavuti, tuna masanduku ya maandishi. Toa thamani ya jina na aina ya Ingizo kwenye sanduku la maandishi na ongeza kitufe cha kuwasilisha kwa 'SUBMIT' wasilisha majibu.
• Unda kitufe cha 'Rudisha' ili kuweka upya yaliyomo kwenye uwanja wa maandishi.

// Kifungo cha Redio ya DHCP

Kuweka IP tuli

// Masanduku ya Nakala ya Kuingiza

// Tuma Kitufe

pembejeo [type = "submit"] {background-color: # 3498DB; / * Kijani * / mpaka: hakuna; rangi: nyeupe; padding: 15px 48px; andika-maandishi: katikati; maandishi-mapambo: hakuna; onyesha: inline-block; saizi ya fonti: 16px; }

// Rudisha Kitufe

pembejeo [type = "submit"] {background-color: # 3498DB; / * Kijani * / mpaka: hakuna; rangi: nyeupe; padding: 15px 48px; andika-maandishi: katikati; maandishi-mapambo: hakuna; onyesha: inline-block; saizi ya fonti: 16px; }

Hatua ya 3: Kupata Jibu la Wavuti Kutoka Kurasa za Wavuti kwenda ESP32

Kutumikia kurasa za wavuti kutoka kwa kifaa cha ESP 32 ni furaha kubwa. Inaweza kuwa chochote kutoka kwa kuonyesha data ya joto kwenye ukurasa wa wavuti, kugeuza iliyoongozwa kutoka kwa ukurasa wa wavuti wa kawaida au kuhifadhi vitambulisho vya Mtumiaji wa Mtumiaji kupitia ukurasa wa wavuti. Kwa kusudi hili, ESP 32 hutumia Darasa la WebServer kwa kurasa za wavuti.

• Kwanza, Unda mfano wa darasa la WebServer kwenye bandari 80 (bandari ya
• Sasa weka kifaa cha ESP kama lainiAP. Toa SSID na kitufe cha kupitisha na upe IP tuli kwa kifaa.
• Anza seva.

// ********* SSID na Pass kwa AP ************** /

const char * ssidAP = "toa SSID"; const char * passAP = "ufunguo wa kupitisha";

// ********* Usanidi wa IP tuli ************** / IPAdressress ap_local_IP (192, 168, 1, 77); Anwani ya IP ap_gateway (192, 168, 1, 254); Anwani ya IP apububnet (255, 255, 255, 0);

// ********* Sanidi ya SoftAP ************** /

Njia ya WiFi (WIFI_AP);

Serial.println (WiFi.softAP (ssidAP, passAP)? "Laini-AP kuanzisha": "Imeshindwa kuunganisha");

kuchelewesha (100); Serial.println (WiFi.softAPConfig (ap_local_IP, ap_gateway, ap_subnet)? "Kusanidi AP laini": "Kosa katika Usanidi"); Serial.println (WiFi.softAPIP ());

// kuanza seva

anza ();

• Unda na utumie URL kwa kutumia vipingamizi tofauti.
• na ushughulikie mteja kwa usawa ukitumia handleClient.

seva.on ("/", handleRoot);

seva.on ("/ dhcp", handleDHCP); server.on ("/ tuli", handleStatic); // shughulikia seva ya majibu.handleClient ();

• Ili kufikia kurasa za wavuti. Unganisha na AP ambayo umetengeneza tu, iliyoorodheshwa ndani ya mitandao yako ya WiFi. Sasa, nenda kwa kivinjari, Ingiza IP iliyosanidiwa na wewe katika hatua ya mwisho na ufikie ukurasa wa wavuti.
• Darasa la seva ya Wavuti huchukua jina lililopewa pembejeo ('maandishi', 'kitufe', 'radiobutton'etc.) Kama hoja. Inaokoa majibu ya pembejeo hizi kama hoja na tunaweza kupata maadili au kuziangalia kwa kutumia njia za args, arg, hasArg.

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

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

}

ikiwa (server.hasArg ("ipv4static") && server.hasArg ("lango") && server.hasArg ("subnet")) {staticSet (); } vingine ikiwa (server.arg ("ipv4")! = "") {dhcpSetManual (); } mwingine {dhcpSetDefault (); }

Hatua ya 4: Usanidi wa IP tuli

Hadi sasa tumeelewa jinsi ya kuungana na AP na jinsi ya kupata maadili kutoka kwa sehemu za uingizaji za ukurasa wa wavuti

Katika hatua hii, tutasanidi IP tuli

• Chagua Mpangilio wa IP tuli na bonyeza kitufe cha Wasilisha. Utaelekezwa kwenye ukurasa unaofuata.
• Katika ukurasa unaofuata ingiza anwani ya IP tuli, anwani ya lango na subnet Mask ukurasa huu utatumiwa kwa "/ tuli" ambayo hushughulikiwa na njia ya kushughulikia tuli ya tuli.
• Pata thamani ya sehemu za maandishi ukitumia njia ya server.arg ().

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

Lango la kamba = Kamba (server.arg ("lango")); Kamba subnet = Kamba (server.arg ("subnet"));

• Sasa, maadili haya yameorodheshwa kwenye Muundo wa JSON.
• Kisha tutaandika JSON kwa SPIFFS.

mzizi ["statickey"] = "staticSet";

mzizi ["staticIP"] = ipv4static;

mzizi ["lango"] = lango;

mzizi ["subnet"] = subnet;

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

ikiwa (root.printTo (fileToWrite)) {

Serial.println ("- Faili Imeandikwa"); }

• Usanidi huu umehifadhiwa katika SPIFFS. Baadaye, maadili haya yanasomwa kutoka kwa SPIFFS.
• Thamani za IP tuli hubadilishwa kutoka JSON.

Faili ya faili = SPIFFS.open ("/ ip_set.txt", "r");

wakati (faili haipatikani ()) {

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

ikiwa (debugLogData.length ()> 5) {

JsonObject & readRoot = jsonBuffer.parseObject (debugLogData);

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

Kamba ipStaticValue = readRoot ["staticIP"];

Thamani ya langoValue = soma Mizizi ["lango"];

Kamba subnetValue = readRoot ["subnet"];

Hatua ya 5: Mipangilio ya DHCP

Katika hatua hii, tutasanidi Mipangilio ya DHCP

Chagua Mipangilio ya DHCP kutoka kwa ukurasa wa faharisi na bonyeza "Wasilisha"

• Utaelekezwa kwenye ukurasa unaofuata. Katika ukurasa unaofuata ingiza anwani ya IP au chagua chagua chaguomsingi na bonyeza kitufe cha "Tuma" kuwasilisha majibu. Ukurasa huu utatumiwa kwa "/ dhcp" ambayo inasimamiwa na njia ya kushughulikia ya kushughulikiaDHCP. Pata thamani ya sehemu za maandishi ukitumia njia ya server.arg (). Unapobofya katika chagua kisanduku chaguomsingi chaguomsingi. IP 192.168.4.1 itapewa kifaa.
• Sasa, maadili haya yameorodheshwa kwenye Muundo wa JSON.
• Kisha tutaandika JSON kwa SPIFFS.

JsonObject & mzizi = jsonBuffer.createObject ();

mzizi ["dhcpManual"] = "dhcpManual";

mzizi ["dhcpIP"] = "192.168.4.1";

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

ikiwa (root.printTo (fileToWrite)) {

Serial.println ("- Faili Imeandikwa"); }

• Usanidi huu umehifadhiwa katika SPIFFS. Baadaye, maadili haya yanasomwa kutoka kwa SPIFFS.
• Thamani za IP za dhcp zinachanganuliwa kutoka JSON.

File file = SPIFFS.open ("/ ip_set.txt", "r"); wakati (file.available ()) {debugLogData + = char (file.read ()); } ikiwa (debugLogData.length ()> 5) {JsonObject & readRoot = jsonBuffer.parseObject (debugLogData);

ikiwa (readRoot.containsKey ("dhcpDefault")) {

Kamba ipdhcpValue = readRoot ["dhcpIP"];

Serial.println (ipdhcpValue);

dhcpAPConfig ();}

Hatua ya 6: Kuhifadhi Kitambulisho cha WiFi

Kwa sasa, tumechagua usanidi wa IP. Sasa tunahitaji kuokoa vitambulisho vya wifi vya Mtumiaji. Ili kutatua hali hii. Tumefuata utaratibu huu.

• Kwa hivyo sasa tunayo usanidi wetu wa AP wa kifaa katika DHCP au usanidi wa IP tuli ambayo tulikuwa tumechagua kutoka kwa lango la mateka lililotajwa katika hatua za mwisho.
• Wacha tuseme tumechagua usanidi wa IP tuli.
• Tutasanidi lainiAP kwenye IP hii.
• Baada ya kusoma maadili kutoka kwa SPIFFS na kuchambua maadili haya kutoka kwa JSON. Tutasanidi lainiAP kwenye IP hii.
• Badilisha Kamba ya IP iwe Baiti.

byte 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);

// *************** Chambua baiti kutoka kwa kamba ****************** //

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

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

ka = strtoul (str, NULL, msingi);

str = strchr (str, sep);

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

kuvunja;

}

str ++;

}}

Sasa tutasanidi lainiAP kwenye IP hii

Serial.println (WiFi.softAPConfig (ap_localWeb_IP, ap_gate, ap_net)? "Kusanidi lainiAP": "haijaunganishwa"); Serial.println (WiFi.softAPIP ());

• Sasa anza seva ya wavuti na utumie ukurasa wa wavuti kwenye IP hii. Kuingia Kitambulisho cha WiFi cha Mtumiaji.
• Ukurasa wa wavuti una sehemu mbili za maandishi kuingia SSID na Nenosiri.
• handleStaticForm ni njia ya kupiga simu ambayo hutumikia ukurasa wa wavuti.
• server.handleClient () hutunza ombi na majibu kwenda na kutoka kwa wavuti.

anza ();

seva.on ("/", handleStaticForm);

server.onNotFound (handleNotFound);

Kuchochea = millis ();

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

seva.handleClient (); }

Fomu ya HTML imehifadhiwa katika SPIFFS. tunaangalia hoja zinazofaa kutumia server.arg (). kupata thamani ya SSID na Nenosiri

Faili ya faili = SPIFFS. Fungua ("/ WiFi.html", "r");

server.streamFile (faili, "maandishi / html");

faili. karibu ();

Hatua ya 7: Soma na Andika kutoka kwa SPIFFS

MABIBU

Mfumo wa Faili ya Kiunga cha Pembeni ya Siri, au SPIFFS kwa kifupi. Ni mfumo wa faili ya uzani mwepesi kwa watawala wadogo na chipu ya SPI. Chip ya ndani ya ESP32 ina nafasi nyingi kwa kurasa zako za wavuti. Tumehifadhi pia ukurasa wetu wa wavuti katika Mfumo wa Flash. Kuna hatua chache tunazohitaji kufuata kupakia data kwa spiffs

Pakua zana ya kupakia data ya ESP 32 SPIFFS:

• Katika saraka yako ya sketchbook ya Arduino, tengeneza saraka ya zana ikiwa haipo bado
• Ondoa zana kwenye saraka ya zana (njia itaonekana kama /Arduino/tools/ESP32FS/tool/esp32fs.jar)
• Anzisha tena Arduino IDE
• Fungua mchoro (au unda mpya na uihifadhi)
• Nenda kwenye saraka ya mchoro (chagua Mchoro> Onyesha Folda ya Mchoro)
• Unda saraka iliyoitwa data na faili zozote unazotaka kwenye mfumo wa faili hapo. Tumepakia ukurasa wetu wa HTML na jina la webform.html
• Hakikisha umechagua bodi, bandari, na kufungwa Serial Monitor
• Chagua Zana> ESP8266 Sketch Data Pakia. Hii inapaswa kuanza kupakia faili kwenye mfumo wa faili ya ESP8266. Ukimaliza, upau wa hali ya IDE utaonyesha ujumbe wa Picha za SPIFFS.

kitupu cha kushughulikiaDHCP () {File file = SPIFFS.open ("/ page_dhcp.html", "r"); server.streamFile (faili, "maandishi / html"); faili. karibu ();}

utupu handleStatic () {

Faili ya faili = SPIFFS. Fungua ("/ page_static.html", "r"); server.streamFile (faili, "maandishi / html"); faili. karibu ();}

Kuandikia SPIFFS

Hapa tunaandika mipangilio iliyohifadhiwa kwa SPIFFS ili watumiaji hawapaswi kupitia hatua hizi wakati kifaa kinapobadilisha.

• Badilisha hoja zilizopokelewa kutoka kwa ukurasa wa wavuti kuwa vitu vya JSON
• Andika JSON hii kwa faili ya.txt iliyohifadhiwa kwenye SPIFFS.

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

Lango la kamba = Kamba (server.arg ("lango")); Kamba subnet = Kamba (server.arg ("subnet")); mzizi ["statickey"] = "staticSet"; mzizi ["staticIP"] = ipv4static; mzizi ["lango"] = lango; mzizi ["subnet"] = subnet; Kamba JSONStatic; char JSON [120]; mzizi.printTo (Serial); mzizi.prettyPrintTo (JSONStatic); JSONStatic.toCharArray (JSON, sizeof (JSONStatic) +2); File fileToWrite = SPIFFS.open ("/ ip_set.txt", FILE_WRITE); ikiwa (! fileToWrite) {Serial.println ("Kosa la kufungua SPIFFS"); } ikiwa (fileToWrite.print (JSON)) {Serial.println ("- Faili Imeandikwa"); } mwingine {Serial.println ("- Faida ya Kuandika Faili"); } failiToWrite. karibu ();

Hatua ya 8: Kanuni ya Jumla

Nambari ya Zaidi ya HTML na ESP32 inaweza kupatikana katika Hifadhi hii ya Github