solution for issues #114 // display dynamic data (sensor data in webpage) without manuel refresh

app_httpd.cpp

@@ -91,6 +91,14 @@ uint8_t temprature_sens_read();
 }
 #endif
 
+
+// external function to get the values from sensor
+extern float getBME280_hum();
+extern float getBME280_temp();
+extern float getBME280_pres();
+
+
+
 void serialDump() {
     Serial.println();
     // Module
@@ -743,6 +751,22 @@ static esp_err_t index_handler(httpd_req_t *req){
     }
 }
 
+
+static esp_err_t readSensor_handler(httpd_req_t *req){
+    flashLED(75);
+    httpd_resp_set_type(req, "text/plane");
+    float hum_result = getBME280_hum();
+    float temp_result = getBME280_temp();
+    float pres_result = getBME280_pres();
+
+    String valuesStrg =  String(hum_result) + '#'+ String(temp_result) + '#' + String(pres_result) + '#';
+    int strgLength = valuesStrg.length();
+    char values_as_char[strgLength];
+    valuesStrg.toCharArray(values_as_char, strgLength);
+
+    return httpd_resp_send(req,  (const char *)values_as_char, HTTPD_RESP_USE_STRLEN);
+}
+
 void startCameraServer(int hPort, int sPort){
     httpd_config_t config = HTTPD_DEFAULT_CONFIG();
     config.max_uri_handlers = 16; // we use more than the default 8 (on port 80)
@@ -843,6 +867,13 @@ void startCameraServer(int hPort, int sPort){
         .handler   = error_handler,
         .user_ctx  = NULL
     };
+    httpd_uri_t readSensor_uri = {
+        .uri       = "/readSensor",
+        .method    = HTTP_GET,
+        .handler   = readSensor_handler,
+        .user_ctx  = NULL
+    };
+
 
     // Request Handlers; config.max_uri_handlers (above) must be >= the number of handlers
     config.server_port = hPort;
@@ -864,6 +895,7 @@ void startCameraServer(int hPort, int sPort){
         httpd_register_uri_handler(camera_httpd, &logo_svg_uri);
         httpd_register_uri_handler(camera_httpd, &dump_uri);
         httpd_register_uri_handler(camera_httpd, &stop_uri);
+        httpd_register_uri_handler(camera_httpd, &readSensor_uri);
     }
 
     config.server_port = sPort;

esp32-cam-webserver.ino

@@ -36,6 +36,8 @@
  *
  */
 
+
+
 // Primary config, or defaults.
 #if __has_include("myconfig.h")
     struct station { const char ssid[65]; const char password[65]; const bool dhcp;};  // do no edit
@@ -228,6 +230,41 @@ const int pwmMax = pow(2,pwmresolution)-1;
 // will be returned for all http requests
 String critERR = "";
 
+
+// (set these in myconfig.h)
+
+// https://github.com/finitespace/BME280
+
+/*
+ *     ESP32    ---   BME280 
+ *     GPIO 14 ->  SDA
+ *     GPIO 15 ->  SCL
+ *     GND     ->  GND
+ *     5V      ->  VIN     (3.3V was not working ???
+ * */
+
+#include <BME280I2C.h>
+#include <Wire.h>        
+
+#define I2C_SDA 14
+#define I2C_SCL 15
+#define I2C_Freq 400000
+
+BME280I2C::Settings settings(
+   BME280::OSR_X1,
+   BME280::OSR_X1,
+   BME280::OSR_X1,
+   BME280::Mode_Forced,
+   BME280::StandbyTime_1000ms,
+   BME280::Filter_Off,
+   BME280::SpiEnable_False,
+   BME280I2C::I2CAddr_0x76 // I2C address. I2C specific.
+);
+
+BME280I2C bme(settings);
+
+
+
 // Debug flag for stream and capture data
 bool debugData;
 
@@ -241,6 +278,7 @@ void debugOff() {
     Serial.println("Camera debug data is disabled (send 'd' for status dump, or any other char to enable debug)");
 }
 
+
 // Serial input (debugging controls)
 void handleSerial() {
     if (Serial.available()) {
@@ -335,7 +373,7 @@ void StartCamera() {
     config.pin_reset = RESET_GPIO_NUM;
     config.xclk_freq_hz = xclk * 1000000;
     config.pixel_format = PIXFORMAT_JPEG;
-    config.grab_mode = CAMERA_GRAB_LATEST;
+//    config.grab_mode = CAMERA_GRAB_LATEST;    // not sure, I got an error, maby I have an old driver hansju
     // Pre-allocate large buffers
     if(psramFound()){
         config.frame_size = FRAMESIZE_UXGA;
@@ -635,6 +673,23 @@ void WifiSetup() {
     }
 }
 
+
+
+float getBME280_hum() { 
+      return bme.hum();
+      }
+
+float getBME280_temp() {
+      BME280::TempUnit tempUnit(BME280::TempUnit_Celsius);
+      return bme.temp(tempUnit);
+      }
+
+
+float getBME280_pres(){ 
+      BME280::PresUnit presUnit(BME280::PresUnit_hPa);
+      return bme.pres(presUnit);
+} 
+
 void setup() {
     Serial.begin(115200);
     Serial.setDebugOutput(true);
@@ -648,6 +703,31 @@ void setup() {
     Serial.println(baseVersion);
     Serial.println();
 
+
+// setup sensor on i2c
+  Wire.begin(I2C_SDA , I2C_SCL);
+    while(!bme.begin())
+    {
+        Serial.println("Could not find BME280I2C sensor!");
+        delay(1000);
+    }
+
+    switch(bme.chipModel())
+     {
+     case BME280::ChipModel_BME280:
+       Serial.println("Found BME280 sensor! Success.");
+       break;
+     case BME280::ChipModel_BMP280:
+       Serial.println("Found BMP280 sensor! No Humidity available.");
+       break;
+     default:
+       Serial.println("Found UNKNOWN sensor! Error!");
+      }
+   // Change some settings before using.
+   settings.tempOSR = BME280::OSR_X4;
+   bme.setSettings(settings);
+
+
     // Warn if no PSRAM is detected (typically user error with board selection in the IDE)
     if(!psramFound()){
         Serial.println("\r\nFatal Error; Halting");

index_other.h

@@ -32,6 +32,9 @@ const uint8_t index_simple_html[] = R"=====(<!doctype html>
         <button id="toggle-stream" style="float:left;" class="hidden">Start Stream</button>
         <div id="wait-settings" style="float:left;" class="loader" title="Waiting for camera settings to load"></div>
       </div>
+      <div class="card">
+        Sensor Hum: <span id="HUMValue">0</span>, Temp: <span id="TempValue">0</span>, Pres: <span id="PresValue">0</span>
+      </div>
       <div id="content">
         <div class="hidden" id="sidebar">
           <input type="checkbox" id="nav-toggle-cb">
@@ -303,6 +306,31 @@ const uint8_t index_simple_html[] = R"=====(<!doctype html>
     }
 
   })
+
+
+
+setInterval(function() {
+  getData();
+}, 2000); 
+
+function getData() {
+  var xhttp = new XMLHttpRequest();
+  xhttp.onreadystatechange = function() {
+    if (this.readyState == 4 && this.status == 200) {
+
+      const sensorValues = this.responseText.split('#',3);
+      document.getElementById("HUMValue").innerHTML =
+      sensorValues[0];
+       document.getElementById("TempValue").innerHTML =
+       sensorValues[1];
+       document.getElementById("PresValue").innerHTML =
+       sensorValues[2];
+    }
+  };
+  xhttp.open("GET", "readSensor", true);
+  xhttp.send();
+}
+
   </script>
 </html>)=====";