Open Kigtdert opened 1 month ago
script pro aktualizaci dat: Chcete-li aktualizovat hodnoty ukazatelů (gauges) každých 5 sekund pomocí dat ze senzoru DHT11 na pinu 12, je třeba upravit jak část HTML/JavaScript, tak i serverovou část na ESP32, aby poskytovala aktuální data ze senzoru DHT11. Zde je postup, jak toho dosáhnout:
Nejprve přidejte knihovnu DHT11 a inicializujte senzor:
#include "DHT.h"
#define DHTPIN 12 // Pin, kde je připojen DHT11
#define DHTTYPE DHT11 // Typ senzoru
DHT dht(DHTPIN, DHTTYPE);
float temperature = 0.0;
float humidity = 0.0;
void setup() {
Serial.begin(115200);
dht.begin();
// Další inicializační kód...
}
Přidejte funkci pro čtení dat ze senzoru a aktualizaci globálních proměnných temperature
a humidity
:
void readDHT11() {
humidity = dht.readHumidity();
temperature = dht.readTemperature();
// Check if any reads failed and exit early (to try again).
if (isnan(humidity) || isnan(temperature)) {
Serial.println("Failed to read from DHT sensor!");
return;
}
}
Přidejte HTTP handler, který bude poskytovat aktuální hodnoty ze senzoru ve formátu JSON:
static esp_err_t dht_handler(httpd_req_t *req) {
char json_response[64];
snprintf(json_response, sizeof(json_response), "{\"temperature\":%.2f,\"humidity\":%.2f}", temperature, humidity);
httpd_resp_set_type(req, "application/json");
httpd_resp_set_hdr(req, "Access-Control-Allow-Origin", "*");
return httpd_resp_send(req, json_response, strlen(json_response));
}
Poté registrujte tento nový URI handler ve funkci startCameraServer
:
void startCameraServer() {
// ... existující kód ...
httpd_uri_t dht_uri = {
.uri = "/dht",
.method = HTTP_GET,
.handler = dht_handler,
.user_ctx = NULL
};
if (httpd_start(&camera_httpd, &config) == ESP_OK) {
httpd_register_uri_handler(camera_httpd, &index_uri);
httpd_register_uri_handler(camera_httpd, &cmd_uri);
httpd_register_uri_handler(camera_httpd, &status_uri);
httpd_register_uri_handler(camera_httpd, &dht_uri); // Nový URI handler
}
// ... existující kód ...
}
Přidejte JavaScript kód pro periodické načítání dat z /dht
endpointu a aktualizaci ukazatelů (gauges):
<script>
window.onload = function() {
document.getElementById("camstream").src = window.location.origin + ":81/stream";
updateGauges();
};
function updateGauges() {
fetch('/dht')
.then(response => response.json())
.then(data => {
drawGauge(data.humidity);
drawGauge1(data.temperature);
// Zde můžete přidat i další ukazatele, např. drawGauge2 pro napětí baterie
})
.catch(error => console.error('Error fetching DHT data:', error));
setTimeout(updateGauges, 5000); // Aktualizovat každých 5 sekund
}
</script>
loop
Ujistěte se, že data ze senzoru DHT11 jsou pravidelně aktualizována:
void loop() {
readDHT11();
delay(5000); // Číst data každých 5 sekund
}
Tímto způsobem bude váš ESP32 kamerový webserver pravidelně aktualizovat hodnoty ukazatelů pomocí dat ze senzoru DHT11.