Arduino Sensor API Webserver

Question

When I load this code into my Arduino, he connects with the WiFi and shows up at my IP-Scanner. But when I open the IP of the device in FireFox nothing loads. (http://10.0.0.40/env) Is there an issue with my code, or doesnt it work like this. I have a sensor which reads the temperature and humidity. These two value should be available in my network to fetch(). With Javascript I want to display these on my local html-page. The network credentials are just censored.

#include <ArduinoJson.h>
#include <WiFi.h>
#include <WebServer.h>
#include <DHT.h>

#define DHTPIN 13
#define DHTTYPE DHT11

DHT dht(DHTPIN, DHTTYPE);

const char *ssid = "XXX";
const char *pwd = "XXX";

StaticJsonDocument<250> jsonDocument;
char buffer[250];

float temperature;
float humidity;

WebServer server(80);

void connectToWiFi() {
  Serial.print("Connect to: ");
  Serial.println(ssid);

  WiFi.begin(ssid, pwd);

  while (WiFi.status() !=WL_CONNECTED){
    Serial.print(".");
    delay(1000);
  }

  Serial.print("Connected. IP: ");
  Serial.println(WiFi.localIP());
}



void setup_routing(){
  server.on("/temperature", getTemperature);
  server.on("/humidity", getHumidity);
  server.on("/env", getEnv);
  
  server.begin();
}

void create_json(char *tag, float value, char *unit){
  jsonDocument.clear();
  jsonDocument["type"] = tag;
  jsonDocument["value"] = value;
  jsonDocument["unit"] = unit;
  serializeJson(jsonDocument, buffer);
}

void add_json_object(char *tag, float value, char *unit){
  JsonObject obj = jsonDocument.createNestedObject();
  obj["type"] = tag;
  obj["value"] = value;
  obj["unit"]  = unit;
}

void read_sensor_data(void * parameter) {
     for (;;) {
     temperature = dht.readTemperature();
     humidity = dht.readHumidity();
     }
     delay(2000);  
}

void getTemperature(){
  create_json("temperature", temperature,"°C");
  server.send(200, "application/json", buffer);
  Serial.println(temperature);
}
void getHumidity(){
  create_json("humidty", humidity, "%");
  server.send(200, "application/json", buffer);
  Serial.println(humidity);
}
void getEnv() {
  jsonDocument.clear();
  add_json_object("temperature", temperature, "°C");
  add_json_object("humidity", humidity, "%");
  serializeJson(jsonDocument, buffer);
  server.send(200, "application/json", buffer);
}

void setup() {
dht.begin();
Serial.begin(115200);
Serial.println(WiFi.localIP());  
connectToWiFi();
setup_routing();

}

void loop() {
  // put your main code here, to run repeatedly:
delay(2000);
float temperature = dht.readTemperature();
float humidty = dht.readHumidity();

}

Answer 1

The loop() code you posted looks like this:

void loop() {
  // put your main code here, to run repeatedly:
delay(2000);
float temperature = dht.readTemperature();
float humidty = dht.readHumidity();

}

You didn't include the necessary code to allow the web server to run. The web server needs to be given a chance to run during the loop() or else it can't service requests.

Your loop() needs to include server.handleClient().

You can see this in basic examples showing how to use the WebServer.

Once you add that code you'll need to rewrite loop() to not always delay for two seconds or else you'll be delaying the web server as well as the sensor reads.