ESP8266 веб-серверин колдонуу менен 7-сегменттеги LED дисплейди көзөмөлдөө: 8 кадам (сүрөттөр менен)

2025 Автор: John Day | [email protected]. Акыркы өзгөртүү: 2025-01-23 14:51

Менин проектимде Nodemcu ESP8266 бар, ал html формасын колдонуп http сервери аркылуу 7 сегменттүү дисплейди көзөмөлдөйт.

1 -кадам: Бул проект жөнүндө

Бул ESP8266 (NodeMCU) wifi модулун колдонуу менен иштелип чыккан IOT долбоору. Долбоордун мотиви - бул модулда тармак боюнча бир нече кардарды кабыл ала турган веб -серверди түзүү. Бул жерде менин долбоорумду түшүнүү үчүн html жана javaScript боюнча негизги билим керек. Мен бул жерде ESP8266 жана javaScript боюнча талкуулай турган кээ бир алдын ала темалар:

1. Файлдарды ESP8266дагы SPIFFSке жүктөө, бул файлды биздин arduino кодубузда эффективдүү колдонуу үчүн.

2. javaScriptти колдонуу менен веб -сактоо

SPIFFS

Ушул убакка чейин, биз веб -баракчаларыбыздын HTML'ин эскизибизге саптын литералдары катары киргизип келгенбиз. Бул биздин кодду окууну абдан оорлотот жана сиз тез эле эсиңизден чыгып каласыз.

SPIFFS SPI флеш-чипи бар микроконтроллерлер үчүн жеңил салмактагы файл тутуму. ESP8266 борттогу флеш-чипи веб-баракчаларыңыз үчүн көп орунга ээ, өзгөчө сизде 1MB, 2MB же 4MB версиясы болсо. Файлдарды SPIFFSке жүктөө үчүн arduino программаңызга инструменттерди кантип кошууну түшүнө аласыз:

Бул долбоордо менде 2 html файлы жана JavaScript файлы бар. Бул файлдардын бардыгы эскизден бөлүнгөн SPIFFSке жүктөлөт, андыктан бул файлдардын өзгөрүшү негизги эскизге көз каранды эмес.

Төмөндө көрсөтүлгөндөй, эки html файлдары PreparFile () тарабынан алынат:

void PreparFile () {

bool ok = SPIFFS.begin (); эгер (макул) {Файл f = SPIFFS.open ("/index.html", "r"); Файл f1 = SPIFFS.open ("/index1.html", "r"); маалыматтар = f.readString (); data1 = f1.readString (); f.close (); f1.close (); } else Serial.println ("Мындай файл табылган жок."); }

javascript файлы loadScript () менен төмөндө көрсөтүлгөндөй окулат:

void loadScript (String path, String type) {

if (SPIFFS.exists (path)) {{File file = SPIFFS.open (path, "r"); server.streamFile (файл, түрү); }}

WEB ТИРКЕМЕЛЕРИ ҮЧҮН ЖЕРГИЛИКТҮҮ САКТОО

HTML5те жергиликтүү сактоонун ар кандай объектилерин жана ыкмаларын JavaScript аркылуу кантип колдонууну төмөнкү макаладан түшүнө аласыз: https://diveintohtml5.info/storage.html. Мен жумушчу бөлүгүндө долбоорумда жергиликтүү сактагычты колдонууну талкуулайм.

2 -кадам: Аппараттык камсыздоо талап кылынат

NodeMCU ESP8266 12E Wifi модулу

Лансыз нан

Jumper зымы

7 Segent Display (Жалпы катод)

1K ом каршылыгы

Микро-USB кабели (NodeMCUду компьютериңизге туташтыруу үчүн)

3 -кадам: Circuit & Connections

Байланыштар чындыгында оңой. Жогорудагы схемада nodemcu казыктары төмөнкүдөй түрдө туташкан:

A D1

B D2

C D3

D D4

E D6

F D7

G D8

бул жерде A, B, C, D, E & F 7Segment Display сегменттери

. 7 сегменттин Дисплейине көңүл бурбаңыз. Аны ESPтин D5 пини менен туташтырбаңыз

4 -кадам: ЭМГЕК

Жогоруда айтылгандай, бизде эки html файл бар. Алардын бири - бул ESP8266 сервери "/" алганда чакырылган тамыр HTML баракчасы, эгер URI '/' суралса, сервер 200 HTTP статус коду менен жооп бериши керек (Ok), андан кийин "индекси менен жооп жөнөтүшү керек. html "файлы.

Экинчи html файлы кардар формага киргизүү аркылуу түп барактан сураганда жөнөтүлөт. Көп өтпөй, сервер формадан POSTED киргизүүнү алат, аны белгиленген сап мааниси менен салыштырып, жооп катары экинчи html баракчасын жөнөтөт.

if (server.arg ("nam") == "0") {server.send (200, "text/html", data1); sevenSeg (0); }

Экинчи баракка html эскизде аныкталбагандыктан, биз бул жерде SPIFFS.readString () аркылуу html коддору окулган "data1" ге шилтеме берип жатабыз.

Файл f1 = SPIFFS.open ("/index1.html", "r"); data1 = f1.readString ();

Бул жерде sevenSeg () дагы "0" аргументи менен аталат, андыктан аны ар кандай сегменттерди КҮЙГӨЗҮП жана ӨЧҮРҮП "0" көрсөтүү үчүн колдонсо болот. Бул жерде мен фукциянын атын түшүндүрүп бердим, башкача айтканда onA () нан сегментинде 7 сегменттин A сегментин күйгүзөт, ошону менен өчүрүп коёмA.

Ошентип, бул учурда "0" көрсөтүү үчүн, биз Gден башка бардык сегментти алмаштырышыбыз керек (DP эске алынбайт, анткени ал ESP8266нын эч кандай пинине туташкан эмес). Ошентип, менин функциям мындай көрүнөт:

if (num == 0) {onA (); onB (); onC (); onD (); бир(); onF (); offG (); }

5 -кадам: HTML & JAVASCRIPT КОДУ

Index.htmlде 7 сегменттин дисплейи өчүрүлгөн режимде жана анын астындагы форма бар. Бул ачкандан кийин көрүп турганыңыз:

Эгерде биз веб -баракчабызды ESP8266 жок колдонууну кааласак, анда формаңыздын иш атрибутундагы шилтемени өзгөртүү аркылуу мүмкүн болот.

Бул жерде сиз шилтеме кандайдыр бир Wi -Fiга (же хотспотко) туташкандан кийин nodeMCUңузга бөлүнгөн ошол эле IP дареги экенин көрө аласыз. Тууралоодон кийин форма теги мындай көрүнөт:

Бул жерде мен колдонуучунун кирүү маанисин сактоо үчүн браузердин веб -стрингин колдонуп жатам. Бул маани index1.html тарабынан алынат жана сан html canvas боюнча 7 сегменттин дисплейинде көрсөтүлөт. Сиз бул процедураны төмөнкү видео аркылуу түшүнөсүз:

video_attach

6 -кадам: НЕГИЗГИ ЭСКЕРТҮҮЛӨР

Бул долбоор сиздин nodemcu менен иштейт, эгер сиз төмөнкү пункттарга кам көрсөңүз:

1. root html файлынын иш атрибутундагы шилтеме "https:// (Serial monitor же IP сиздин ESPке бөлүнгөн IP)/тапшыруу" болушу керек.

2. HTML5 жана жаңы тэгдерди жана функцияларды колдогон браузердин акыркы версиясын колдонуңуз.

3. SPIFFS сиздин index.html, index1.html жана main.js маалымат папкасына чогулганда гана иштейт. Сиз менин githubумдан код файлын клондой аласыз

7 -кадам: КОД

Бул менин долбоорумдун кодунун репозиторийи шилтемеси. Эгерде сиз ESP8266да SPIFFS менен иштеп жатсаңыз, анда мен эмне үчүн html жана javascript файлдарын маалымат папкасына койгонумду түшүнө аласыз.

GitHub репозиторийине шилтеме

8 -кадам: Видео үйрөткүч

Эгер жардам берсе, жазылыңыз