ESP32- ի վրա հիմնված վեբ սերվերի միջոցով ինտերնետով վերահսկվող լուսադիոդ. 10 քայլ

2024 Հեղինակ: John Day | [email protected]. Վերջին փոփոխված: 2024-01-30 09:47

Նախագծի ակնարկ

Այս օրինակում մենք պարզելու ենք, թե ինչպես կարելի է ESP32- ի վրա հիմնված վեբ սերվեր պատրաստել LED վիճակը կառավարելու համար, որը հասանելի է աշխարհի ցանկացած կետից: Այս ծրագրի համար ձեզ հարկավոր կլինի Mac համակարգիչ, բայց կարող եք գործարկել այս ծրագրաշարը նույնիսկ Raspberry Pi- ի նման էժան և ցածր էներգիայի համակարգչի վրա:

ESP32- ի պատրաստում Arduino IDE- ով

ESP32- ի ծրագրավորումը սկսելու համար `օգտագործելով Arduino IDE- ն և Arduino ծրագրավորման լեզուն, ձեզ հարկավոր կլինի հատուկ հավելում: Կարդացեք այն մասին, թե ինչպես պատրաստել Arduino IDE- ն ESP32- ի համար Mac OS- ում ՝ հետևյալ հղումով:

Պարագաներ

Այս ձեռնարկի համար ձեզ հարկավոր են հետևյալ տարրերը.

• ESP32 զարգացման տախտակ 5 մմ
• LED դիմադրություն 220 օմ
• 16x2 LCD էկրան I2C մոդուլով
• Breadboard
• Jumper լարերը
• Միկրո USB մալուխ

Քայլ 1: Շղթայի կառուցում

Կատարեք կապեր, ինչպես ցույց է տրված ստորև ներկայացված հետևյալ սխեմատիկ դիագրամում:

Սկսեք `միացնելով 3V3 մատակարարման լարման ելքը ESP32 և GND տախտակի վրա: LED- ն դիմադրության միջոցով միացրեք ESP32- ին ՝ օգտագործելով GPIO կապ 23 -ը որպես թվային ելքային պին: Դրանից հետո, 16x2 LCD էկրանով SDA կապը միացրեք GPIO կապին 21 -ին և SCL- ն GPIO կապին 22 -ին:

Քայլ 2: SPIFFS ֆայլային համակարգի արագ ակնարկ

SPIFFS- ը նշանակում է «Serial Peripheral Interface Flash File System», այսինքն ՝ ֆայլային համակարգ ֆլեշ հիշողության համար, որը տվյալները փոխանցում է SPI- ով: Ըստ այդմ, SPIFFS- ը պարզեցված ֆայլային համակարգ է, որը նախատեսված է ֆլեշ չիպերով միկրոկոնտրոլերների համար, որոնք տվյալներ են փոխանցում SPI ավտոբուսի միջոցով (օրինակ ՝ ESP32 ֆլեշ հիշողություն):

SPIFFS- ն առավել օգտակար է ESP32- ի հետ օգտագործելու համար հետևյալ իրավիճակներում.

• Պարամետրեր պահելու համար ֆայլերի ստեղծում
• Մշտական տվյալների պահպանում:
• Փոքր քանակությամբ տվյալների պահպանման համար ֆայլերի ստեղծում (դրա համար microSD քարտ չօգտագործելու փոխարեն):
• HTML և CSS ֆայլերի պահպանում ՝ վեբ սերվեր ստեղծելու համար:

Քայլ 3: SPIFFS Bootloader- ի տեղադրում Mac OS- ում

Դուք կարող եք ստեղծել, պահպանել և գրել տվյալներ ESP32 ֆայլային համակարգում պահվող ֆայլերին `անմիջապես Arduino IDE- ի plugin- ի միջոցով:

Առաջին հերթին, համոզվեք, որ տեղադրված եք Arduino IDE- ի վերջին տարբերակը, այնուհետև կատարեք հետևյալը.

• Բացեք հետևյալ հղումը և ներբեռնեք «ESP32FS-1.0.zip» արխիվը
• Գնացեք Arduino IDE գրացուցակին, որը գտնվում է Փաստաթղթեր թղթապանակում:
• Ստեղծեք գործիքների թղթապանակ, եթե այն գոյություն չունի: Գործիքների գրացուցակի ներսում ստեղծեք մեկ այլ թղթապանակ ESP32FS: ESP32FS- ի ներսում ստեղծեք ևս մեկը, որը կոչվում է գործիք:
• Բացեք 1 -ին քայլում ներբեռնված ZIP արխիվը գործիքի թղթապանակում:
• Վերագործարկեք ձեր Arduino IDE- ն:
• Ստուգելու համար, թե արդյոք plug-in- ը հաջողությամբ տեղադրվել է, բացեք Arduino IDE- ն և կտտացրեք «Գործիքներ» և ստուգեք, արդյոք այս ընտրացանկում կա «ESP32 էսքիզ տվյալների վերբեռնում» տարր:

Քայլ 4: Գրադարանների տեղադրում

ESPAsyncWebServer և AsyncTCP գրադարանները թույլ են տալիս ստեղծել վեբ սերվեր ՝ օգտագործելով ֆայլեր ESP32 ֆայլային համակարգից: Այս գրադարանների մասին լրացուցիչ տեղեկությունների համար ստուգեք հետևյալ հղումը:

Տեղադրեք ESPAsyncWebServer գրադարանը

• Կտտացրեք այստեղ ՝ գրադարանի ZIP արխիվը ներբեռնելու համար:
• Անջատեք այս արխիվը: Դուք պետք է ձեռք բերեք ESPAsyncWebServer-master թղթապանակը:
• Վերանվանեք այն «ESPAsyncWebServer»:

Տեղադրեք AsyncTCP գրադարանը

• Կտտացրեք այստեղ ՝ գրադարանի ZIP արխիվը ներբեռնելու համար:
• Անջատեք այս արխիվը: Դուք պետք է ստանաք AsyncTCP-master թղթապանակը:
• Վերանվանել այն «AsyncTCP»:

Տեղափոխեք ESPAsyncWebServer և AsyncTCP պանակները գրադարանների պանակ, որը գտնվում է Փաստաթղթեր գրացուցակի ներսում:

Վերջապես, վերագործարկեք Arduino IDE- ն:

Քայլ 5. Ստեղծեք Index.html և Style.css ֆայլ հետևյալ բովանդակությամբ

HTML/CSS կոճակը միացնելու կոճակը վերցված է հետևյալ աղբյուրից:

Քայլ 6: Arduino կոդ

Հիմնականում ծածկագիրը հիմնված էր Arduino ծածկագրի վրա, որը վերցված էր ESP32 վեբ սերվերից SPIFFS- ի միջոցով և ինչպես օգտագործել I2C LCD- ը ESP32- ով Arduino IDE- ով:

Քայլ 7: Վերբեռնեք Arduino ծածկագիրը և ֆայլերը ՝ օգտագործելով SPIFFS բեռնիչը

• Բացեք Arduino կոդի ուրվագծային թղթապանակը:
• Այս թղթապանակի ներսում ստեղծեք նոր թղթապանակ, որը կոչվում է «տվյալներ»:
• Տվյալների թղթապանակի ներսում պետք է տեղադրել index.html և style.css:
• Վերբեռնեք Arduino ծածկագիրը
• Այնուհետև, ֆայլերը վերբեռնելու համար կտտացրեք Arduino IDE- ին Գործիքներ> ESP32 Sketch Data Upload

Քայլ 8. Որոշեք ESP32 վեբ սերվերի IP հասցեն

Այն կարելի է գտնել երկու եղանակով.

• Սերիական մոնիտոր Arduino IDE- ում (Գործիքներ> Սերիական մոնիտոր)
• LCD էկրանին

Քայլ 9. Տեղական վեբ սերվերի փորձարկում

Հաջորդը, բացեք ձեր ընտրած վեբ դիտարկիչը և տեղադրեք հետևյալ IP հասցեն հասցեների բարում: Դուք պետք է ելք ստանաք, որը նման է ստորև ներկայացված սքրինշոթին:

Քայլ 10. Մուտք դեպի տեղական վեբ սերվեր աշխարհի ցանկացած կետից ՝ օգտագործելով Ngrok

Ngrok- ը հարթակ է, որը թույլ է տալիս արտաքին ինտերնետից կազմակերպել վեբ սերվերի կամ ձեր համակարգչի վրա աշխատող այլ ծառայությունների հեռակա մուտք: Մուտքը կազմակերպվում է տաքուկի սկզբում ստեղծված անվտանգ թունելի միջոցով:

• Հետևեք այս հղմանը և գրանցվեք:
• Հաշիվ ստեղծելուց հետո մուտք գործեք և անցեք «Հեղինակություն» ներդիրին: Պատճենեք տողը «Ձեր թունելն ինքնաբերաբար» դաշտից:
• Կտտացրեք «Ներբեռնում» ներդիրին նավարկության բարում: Ընտրեք ngrok- ի տարբերակը, որը համապատասխանում է ձեր ՕՀ -ին և ներբեռնեք այն:
• Բացեք ներբեռնված թղթապանակը և գործարկեք հրամանի տողը:
• Միացրեք ձեր հաշիվը `մուտքագրելով հետևյալ հրամանը

./ անգիր ինքնաբերաբար

Գործարկեք HTTP թունելը 80 նավահանգստում

./ngrok http Your_IP_Address: 80

Եթե ամեն ինչ ճիշտ է արվել, ապա թունելի կարգավիճակը պետք է փոխվի «առցանց», իսկ «Փոխանցում» սյունակում պետք է հայտնվի վերահղման հղում: Այս հղումը ձեր դիտարկիչ մուտքագրելով ՝ կարող եք մուտք գործել վեբ սերվեր աշխարհի ցանկացած կետից: