На сайте lastminuteengineers.com/bme280-esp8266-weather-station/ автор описал и прокомментировал несколько вариантов метеостанции. Первый - просто выводит текст, второй - текст дополнен SVG картинками, а третий вариант использует метод AJAX для обновления информации на веб-странице.
Вы можете перевести исходный сайт по абзацам с помощью Яндекс.Переводчика или Google Переводчика.
В статье описываются только изменения, которые я внёс в последний, третий вариант скетча автора.
Вначале на макетной плате соберите схему с BME280 и SSD1306.
Подразумевается, что среда Arduino IDE установлена и в список плат добавлена NodeMCU 1.0 (ESP-12E Module).
Для работы скетча необходимы библиотеки Adafruit_BME280.h, Adafruit_Sensor.h, SSD1306.h. Как установить их, описано на dmitrysnotes.ru/domashnyaya-meteostanciya-na-esp8266-i-datchike-bme280.
О том, как установить библиотеки Adafruit_BME280.h, Adafruit_Sensor.h также написано на исходном сайте [1].
Скетч WS_last и библиотеки к нему можно скачать в Каталоге файлов.
Запустите Arduino IDE и выберите Файл -> Новый. В окне удалите текст предлагаемой заготовки скетча и вставьте текст скетча WS_last.ino.
Ниже приведены фрагменты скетча WS_last с внесенными изменениями. Добавленные или измененные строки подчеркнуты.
Если вы не хотите добавлять в проект дисплей SSD1306, то тогда исключите в этом фрагменте подчеркнутые строки.
#include <Adafruit_BME280.h>
#include "SSD1306.h" // Подключаем OLED SSD1306
SSD1306 display (0x3C, 4, 5);
#define SEALEVELPRESSURE_HPA (1013.25)
Если вы не хотите добавлять в проект дисплей SSD1306, то тогда исключите в следующем фрагменте подчеркнутые строки.
void setup() {
display.init();
display.flipScreenVertically();
display.clear();
display.display();
Serial.begin(115200);
delay(100);
Если вы не хотите добавлять в проект дисплей SSD1306, то тогда исключите в следующем фрагменте подчеркнутые строки.
Однако строку pressure = bme.readPressure() * 0.007501F; оставьте.
void loop() {
server.handleClient();
float tempC = bme.readTemperature();
float humidityH = bme.readHumidity();
float pressuremmHg = bme.readPressure() * 0.007501; // перевод атм. давления в mmHg
display.clear();
display.setFont(ArialMT_Plain_16);
display.drawString(35, 1, "BME280");
display.setFont(ArialMT_Plain_10);
display.drawString(5, 22, "Temperature = " + String(tempC) + " *C");
display.drawString(5, 35, "Humidity = " + String(humidityH) + " %");
display.drawString(5, 48, "Pressure = " + String(pressuremmHg) + " mmHg");
display.display();
delay (1000);
}
void handle_OnConnect() {
temperature = bme.readTemperature();
humidity = bme.readHumidity();
pressure = bme.readPressure() * 0.007501F;
altitude = bme.readAltitude(SEALEVELPRESSURE_HPA);
server.send(200, "text/html", SendHTML(temperature,humidity,pressure,altitude));
}
В следующем фрагменте прописана кодировка UTF-8 для вывода русского текста.
ptr +="<meta name='viewport' content='width=device-width, initial-scale=1.0'>";
ptr +="<meta charset='UTF-8'>";
ptr +="<link href='https://fonts.googleapis.com/css?family=Open+Sans:300,400,600' rel='stylesheet'>";
ptr +="<body>";
ptr +="<h1>ESP8266 Метеостанция</h1>";
ptr +="<div class='side-by-side text'>Температура</div>";
ptr +="<div class='side-by-side reading'>";
ptr +=(int)temperature;
ptr +="<div class='side-by-side text'>Влажность</div>";
ptr +="<div class='side-by-side reading'>";
ptr +=(int)humidity;
ptr +="<div class='side-by-side text'>Давление</div>";
ptr +="<div class='side-by-side reading'>";
ptr +=(int)pressure;
ptr +="<span class='superscript'>mmHg</span></div>";
ptr +="</div>";
ptr +="<div class='side-by-side text'>Высота</div>";
ptr +="<div class='side-by-side reading'>";
ptr +=(int)altitude;
В скетче вместо звездочек пропишите название и пароль вашей Wi-Fi сети.
Если всё было сделано правильно, то при запуске скетча на монитор порта будет выведен IP адрес веб-страницы с данными о погоде.
Введите его в адресной строке браузера и вы должны увидеть подобную картинку:
На дисплей SSD1306 также выводятся данные о погоде:
На OLED дисплее показания обновляются каждую секунду.
Если скетч не работает, то попробуйте подобрать адреса устройств на шине I2C (0x3D для SSD1306 или 0x77 для BME280). В случае, когда ручной подбор не помогает, загрузите скетч для сканирования адресов устройств на шине I2C. Как просканировать адреса, описано в статье Arduino метеостанция на BMP180, DHT11 и LCD1602.
Чтобы получить доступ к веб-странице через интернет, вам надо сделать дополнительные настройки. В роутере домашней сети вам нужно закрепить за ESP8266 постоянный (статический) IP адрес, также надо настроить для ESP8266 проброс порта 80 (port forwarding). На каком-нибудь динамическом DNS сервисе зарегистрировать домен для вашей веб-страницы. Как это настроить, подробно описано в статье Как получить доступ по интернету к датчикам в квартире.
Но тут есть одна закавыка. DNS сервис предлагает установить утилиту, которая периодически посылает на сервис текущий IP адрес. Когда провайдер выдаст вашему роутеру другой IP адрес, утилита сообщит новый IP адрес на DNS сервис. Сервис заменит устаревший IP адрес на текущий на DNS серверах. Вашему домену (имени сайта) будет соответствовать уже новый IP адрес и ваше устройство снова будет доступно в интернете. На ESP8266 нет возможности установить такую утилиту, но если у вас в сети есть компьютер Windows или Linux (Raspberry Pi), то вы можете установить эту утилиту на один из этих компьютеров. Он должен быть в сети и постоянно включен. Проще всего использовать Raspberry Pi или подобный компьютер. Как настроить доступ из интернета на Raspberry Pi, также написано в статье Как получить доступ по интернету к датчикам в квартире.
Скачать скетч и библиотеки
Последнее редактирование 1.10.2021
Использованные ресурсы
1. https://lastminuteengineers.com/bme280-esp8266-weather-station/
2. ttps://robotchip.ru/meteostantsiya-na-bme280-i-esp8266/
3. https://dmitrysnotes.ru/domashnyaya-meteostanciya-na-esp8266-i-datchike-bme280
4. http://zgo.narod.ru/publ/nodemcu_weather_station_on_bme280_and_ssd1306_with_time_display/1-1-0-119
Источник: https://lastminuteengineers.com/bme280-esp8266-weather-station/ | 
