Web Server Üzerinden Sıcaklık-Nem Takibi
Web Server Üzerinden Sıcaklık-Nem Takibi
Bu proje https://randomnerdtutorials.com/esp32-web-server-gauges/ adresindeki proje üzerinde bazı değişiklikler yapılarak oluşturulmuştur.
Orjinal Projede BME280 sensör modulü bizim projemizde AHT10 modülü kulllanılmıştır.
Projemizin amacı ESP32 modül kullanılarak nem sensöründen alınan verilerin ESP32 üzerindeki webservera bağlanılarak izlenmesidir.
Bu projede kazanımlar şunlar olacaktır;
Sensörden veri okuma,
ESP32 wifi özelliğini kullanma,
ESP32 üzerindeki SPIFF dosya sistemine veri atma.
Projeye Başlayalım.
- Gerekli dosyaların sağlanması
ESP32 üzerine atacağımız dosya yapısı alttaki gibi olacaktır. Bu dosyaları alttaki adresten edinebilirsiniz.
2. Kodu Düzenleyelim
Dosyaları edindikten sonra "ESP32_Gauges.ino" dosyasını açıp bazı düzenlemeler yapmamız gerekecek. Benim yaptığım değişiklikleri altta mavi ile belirttim.
/*********
Rui Santos
Complete instructions at https://RandomNerdTutorials.com/esp32-web-server-gauges/
Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files.
The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
*********/
#include <Arduino.h>
#include <WiFi.h>
#include <AsyncTCP.h>
#include <ESPAsyncWebServer.h>
#include "SPIFFS.h"
#include <Arduino_JSON.h>
#include <Adafruit_Sensor.h>
#include <AHT10.h>
// Replace with your network credentials
const char* ssid = "wifi ağınızın adı buraya";
const char* password = "wifi şifreniz buraya";
// Create AsyncWebServer object on port 80
AsyncWebServer server(80);
// Create an Event Source on /events
AsyncEventSource events("/events");
// Json Variable to Hold Sensor Readings
JSONVar readings;
// Timer variables
unsigned long lastTime = 0;
unsigned long timerDelay = 10000;
// Create a sensor object
AHT10 myAHT10(AHT10_ADDRESS_0X38);
// Init AHT10
void initmyAHT10(){
if (!myAHT10.begin()) {
Serial.println("Could not find a valid BME280 sensor, check wiring!");
while (1);
}
}
// Get Sensor Readings and return JSON object
String getSensorReadings(){
readings["temperature"] = String(myAHT10.readTemperature());
readings["humidity"] = String(myAHT10.readHumidity());
String jsonString = JSON.stringify(readings);
return jsonString;
}
// Initialize SPIFFS
void initSPIFFS() {
if (!SPIFFS.begin()) {
Serial.println("An error has occurred while mounting SPIFFS");
}
Serial.println("SPIFFS mounted successfully");
}
// Initialize WiFi
void initWiFi() {
WiFi.mode(WIFI_STA);
WiFi.begin(ssid, password);
Serial.print("Connecting to WiFi ..");
while (WiFi.status() != WL_CONNECTED) {
Serial.print('.');
delay(1000);
}
Serial.println(WiFi.localIP());
}
void setup() {
// Serial port for debugging purposes
Serial.begin(115200);
initmyAHT10();
initWiFi();
initSPIFFS();
// Web Server Root URL
server.on("/", HTTP_GET, [](AsyncWebServerRequest *request){
request->send(SPIFFS, "/index.html", "text/html");
});
server.serveStatic("/", SPIFFS, "/");
// Request for the latest sensor readings
server.on("/readings", HTTP_GET, [](AsyncWebServerRequest *request){
String json = getSensorReadings();
request->send(200, "application/json", json);
json = String();
});
events.onConnect([](AsyncEventSourceClient *client){
if(client->lastId()){
Serial.printf("Client reconnected! Last message ID that it got is: %u\n", client->lastId());
}
// send event with message "hello!", id current millis
// and set reconnect delay to 1 second
client->send("hello!", NULL, millis(), 10000);
});
server.addHandler(&events);
// Start server
server.begin();
}
void loop() {
if ((millis() - lastTime) > timerDelay) {
// Send Events to the client with the Sensor Readings Every 10 seconds
events.send("ping",NULL,millis());
events.send(getSensorReadings().c_str(),"new_readings" ,millis());
lastTime = millis();
}
}
3. Dosyalarımızı Gönderiyoruz
Yukarıda anlattığımız proje dosyalarımızı yanda görülen resimdeki upload komutu ile karta gönderiyoruz.
Bu komut neyi atacağını nerden biliyor ?
".ino" uzantılı dosyamızın bulunduğu konumdaki "data" klasörünü karta gönderiyoruz. Bizde dosyalarımızı buna göre düzenlemiştik.
Peki sizde bu tools menüsünde bu komut yok ise ?
Bu güzel projeyi yapan arkadaşımız bu adreste bunu da güzel bir şekilde anlatmış.
4. Kodumuzu derliyoruz
Yapılması gerekenler bunlardı artık kodumuzu derleyip ESP32 cihazımıza atabiliriz. Bu esnada karşımıza bazı sorunlar çıkabilir;
Yüklü olmayan kütüphaneler olmayabilir eksik kütüphanelerin indirilmesi gerekiyor.
\Documents\Arduino\libraries klasörüne bu eksik kütüphane klasörlerini github üzerinden bulup atabilirsiniz.
ESP32 üzerine kod atarken bazı modellerde boot butonuna basmanız gerekir yoksa işlem başlamayabiliyor.
Tamam her şeyi attık nereden ulaşacağız yaptığımız ekrana ?
her hangi bir web tarayıcısı üzerinden ESP32 cihazının IP adresini yazıp gitmeniz yeterli. Cihazın adresini bilmiyor veya bildiğiniz hale ulaşmıyorsanız Arduino ide üzerinden consol ekranı açmanız gerekecek.
Web sayfasının son hali bende alttaki gibi. Sizde data klasörü içerisindeki "index.html" üzerinden değişiklikler yaparak yazıları değiştirebilirsiniz.