ESP8266 и Visuino: DHT11 Температурен и влажен уеб сървър: 12 стъпки

2024 Автор: John Day | [email protected]. Последно модифициран: 2024-01-30 07:50

Модулите ESP8266 са страхотни евтини самостоятелни контролери с вграден Wi-Fi и вече направих редица инструкции за тях.

DTH11/DTH21/DTH22 и AM2301 са много популярни комбинирани сензори за температура и влажност Arduino и аз също направих няколко инструктажа с тях, включително инструкция за дистанционен термометър и сензор за влажност с 2 ESP8266, свързани заедно в собствената си частна Wi-Fi мрежа.

В тази инструкция ще ви покажа как можете да направите уеб сървър за температура и влажност с ESP8266 и DHT11 и да се свържете към него в съществуващата ви Wi-Fi мрежа от множество устройства с уеб браузър.

Стъпка 1: Компоненти

1. OneNodeMCU ESP8266 платка (използвах версия NodeMCU 0.9, но всяка друга или дори самостоятелна ESP-12 или ESP-01 ще работи)
2. Един сензорен модул DHT11, който получих от този евтин комплект от 37 сензора
3. 3 женско-женски джъмпера

Стъпка 2: Свържете DHT11 към модула NodeMCU ESP8266

1. Свържете захранването (червен проводник), земята (черен проводник) и данни (сив проводник) към модула DHT11 (Снимка 1 показва 2 различни типа сензорни модули DHT11. Както можете да видите, щифтовете могат да се различават, така че свържете внимателно!)
2. Свържете другия край на заземяващия проводник (черен проводник) към заземяващия щифт на модула ESP8266 (Снимка 2)
3. Свържете другия край на захранващия проводник (червен проводник) към 3.3V захранващия щифт на модула ESP8266 (Снимка 2)
4. Свържете другия край на проводника за данни (сив проводник) към цифровия щифт 2 на модула ESP8266 (снимка 3)
5. Снимка 4 показва къде са заземяването, 3.3V захранването и цифровите 2 пина на NodeMCU 0.9

Стъпка 3: Стартирайте Visuino и изберете Тип платка ESP8266

За да започнете да програмирате Arduino, ще трябва да имате инсталирана Arduino IDE от тук:

Моля, имайте предвид, че има някои критични грешки в Arduino IDE 1.6.6

Уверете се, че сте инсталирали 1.6.7 или по -нова версия, в противен случай тази инструкция няма да работи!

Ако не сте направили, следвайте стъпките в тази инструкция, за да настроите Arduino IDE да програмира ESP 8266

Visuino: https://www.visuino.com също трябва да бъде инсталиран.

1. Стартирайте Visuinoas, показан на първата снимка
2. Кликнете върху бутона „Инструменти“на компонента Arduino (Снимка 1) във Visuino
3. Когато се появи диалоговият прозорец, изберете „NodeMCU ESP-12“, както е показано на снимка 2

Стъпка 4: Във Visuino: Задайте име на хост и точка за достъп

Първо трябва да конфигурираме модула за свързване към съществуваща точка за достъп и да му присвоим HostName, за да можем да го открием в мрежата.

1. В Инспектора на обекти разгънете свойството „Модули“, след това подсвойството „WiFi“
2. В Object Inspector задайте стойността на свойството "HostName" на "dht11server" (Снимка 1)
3. В Object Inspector разгънете подсвойството „AccessPoints“на „WiFi“и кликнете върху бутона „…“до стойността му (Снимка 2)
4. В редактора „AccessPoins“изберете „WiFi Access Point“в десния изглед и след това щракнете върху бутона „+“вляво, за да добавите точката за достъп (Снимка 2)
5. В Object Inspector задайте стойността на свойството "SSID" на SSID на вашата Wi-Fi Hotspot (точка за достъп) (Снимка 4)
6. Ако вашата Wi-Fi Hotspot (точка за достъп) изисква парола, в Object Inspector задайте паролата в стойността на свойството "Password" (Снимка 4)
7. Затворете диалоговия прозорец „Точки за достъп“

Стъпка 5: Във Visuino: Добавете TCP/IP сървърно гнездо за комуникацията

След това трябва да добавим гнездо на TCP/IP сървър за комуникацията.

1. В Инспектора на обекти щракнете върху бутона „…“до стойността на под свойството „Сокети“на WiFi (Снимка 1)
2. В редактора на гнезда изберете „TCP/IP сървър“и след това щракнете върху бутона „+“(Снимка 2), за да добавите такъв (Снимка 3)
3. Затворете диалоговия прозорец "Сокети"

Стъпка 6: Във Visuino: Добавете DTH11 и форматиран текстов компонент с 2 аналогови канала

За да контролираме и четем температурата и влажността от DHT11, трябва да добавим компонент за него във Visuino.

Ние също трябва да генерираме уеб страницата от данните. Страницата е само HTML текстов документ, така че можем да използваме компонент Форматиран текст, за да я генерираме.

1. Въведете „dht“в полето Филтър на инструментариума за компоненти, след което изберете компонента „Влажност и термометър DHT11/21/22/AM2301“(Снимка 1) и го пуснете в областта за проектиране
2. Въведете „формуляр“в полето Филтър на инструментариума за компоненти, след това изберете компонента „Форматиран текст“(Снимка 2) и го пуснете в областта за проектиране
3. Кликнете върху бутона „Инструменти“на компонента FormattedText1 (Снимка 3)
4. В редактора на елементите изберете аналоговия елемент отдясно и щракнете два пъти върху бутона „+“вляво (снимка 4), за да добавите 2 от тях (снимка 5)
5. Затворете редактора „Елементи“

Стъпка 7: Във Visuino: Задайте форматиран текст за отговора на сървъра

Трябва да посочим HTML текста, който ще се генерира, когато уеб клиент се свърже със сървъра.

Ще посочим връзката да се затвори след изпратените от мен данни, а също така ще инструктираме браузъра да се свърже отново (Обновяване) след 5 секунди, като добавим „Опресняване: 5“към документа. По този начин уеб страницата ще се опреснява на всеки 5 секунди.

1. В областта за проектиране изберете компонента FormattedText1 (Снимка 1)
2. В Инспектора на обекти изберете свойството "Текст" и кликнете върху бутона "…" до стойността му (Снимка 1)
3. В редактора "Текст" въведете: "HTTP/1.1 200 OK" "Тип съдържание: text/html" "Връзка: затворете" "Опресняване: 5" "" """"""" Температура: %0 "" Влажност: %1 "" "" "(Снимка 2) %0 ще бъде заменен със стойността от AnalogElement1, а %1 ще бъде заменен със стойността от AnalogElement2
4. Щракнете върху бутона OK, за да затворите диалоговия прозорец

Стъпка 8: Във Visuino: Свържете DHT11 компонента

1. Свържете изходния щифт "Температура" на компонента HumidityThermometer1 към "In" щифта на AnalogElement1 на компонента FormattedText1 (Снимка 1)
2. Свържете изходния щифт "Влажност" на компонента HumidityThermometer1 към "In" щифта на AnalogElement2 на компонента FormattedText1 (Снимка 2)
3. Свържете щифта "Sensor" на компонента HumidityThermometer1 към входния "Pin" цифров канал на "Digital [2]" канала на Arduino компонента (Снимка 3)

Стъпка 9: Във Visuino: Добавяне и свързване на Edge Detect Component

Трябва да изпращаме HTML текста всеки път, когато има нова връзка. Преди да изпратим, трябва да изчакаме малко, тъй като уеб браузърите трябва да изпратят заявка, преди да очакват да видят резултат. За да направим това, ще използваме компонент Delay, свързан към "Connected" щифта на TCP/IP сървърния сокет.

1. Въведете „забавяне“в полето Филтър на инструментариума за компоненти, след това изберете компонента „Забавяне“(Снимка 1) и го пуснете в областта за проектиране
2. В свойствата задайте стойността на свойството "Интервал (uS)" на 200000 (Снимка 2)
3. Свържете щифта „Connected“на „Modules. WiFi. Sockets. TCPServer1“на компонента „NodeMCU ESP-12“към щифта „In“на компонента Delay1 (Снимка 3)
4. Свържете щифта "Out" на компонента Delay1 към входния щифт "Clock" на компонента FormattedText1 (Снимка 4)

Стъпка 10: Във Visuino: Свържете форматирания текстов компонент и добавете и свържете компонента на забавяне

1. Свържете изхода „Out“на компонента FormattedText1 към щифта „In“на „Modules. WiFi. Sockets. TCPServer1“на компонента „NodeMCU ESP-12“(Снимка 1)
2. Въведете „забавяне“в полето Филтър на инструментариума за компоненти, след това изберете компонента „Забавяне“(Снимка 2) и го пуснете в областта за проектиране
3. Свържете щифта „Out“на компонента FormattedText1 към щифта „In“на компонента Delay2 (Снимка 3)
4. Свържете изхода „Out“на компонента Delay2 към входния щифт „Disconnect“на „Modules. WiFi. Sockets. TCPServer1“на компонента „NodeMCU ESP-12“(Снимка 4)

Компонентът за забавяне ще изключи сокета малко след изпращането на текста.

Стъпка 11: Генерирайте, компилирайте и качете кода на Arduino

1. Във Visuino натиснете F9 или щракнете върху бутона, показан на снимка 1, за да генерирате кода на Arduino, и отворете Arduino IDE
2. Свържете модула NodeMCU с USB кабел към компютъра
3. Изберете типа платка и серийния порт, както ви показах в тази инструкция
4. В IDE на Arduino кликнете върху бутона Качване, за да компилирате и качите кода (Снимка 2)

Стъпка 12: И играйте …

Честито! Направили сте уеб сървър за температура и влажност на Wi-Fi.

На снимка 1 и във видеото можете да видите свързания и захранван проект. Използвах малка USB захранваща банка за захранване на модула.

Уверете се, че в проекта на Стъпка 4 сте въвели правилния SSID и парола за вашата Wi-Fi гореща точка

Ако отворите уеб браузър на вашия компютър или мобилно устройство и въведете:

dht11server./

И натиснете Enter, ще видите температурата и влажността, измерени от модула. Четенето ще се опреснява на всеки 5 секунди, както е посочено в Стъпка 7.

Не забравяйте да добавите точката в края на името, в противен случай Windows няма да може да разреши името на домейна

На снимка 2 можете да видите пълната диаграма на Visuino.

Приложен е и проектът Visuino, който създадох за този Instructable. Можете да го изтеглите и отворите във Visuino: