We will now set up a weatherweb project. Here, we will receive information about temperature and humidity via a browser. If you want to get the latest information from the ESP32 board, you will have to open a new request to the ESP32 board manually. Let's now automate this activity, as follows:
- To perform an auto-refresh on HTML, use http-equiv="refresh" on the <meta> tag. We can modify our weatherweb project by declaring the WEATHER_TXT_REF variable:
static const char *WEATHER_TXT_REF =
"<html>"
"<head><title>%s</title>"
"<meta http-equiv="refresh" content="5" >"
"</head>"
"<body>"
"<p>Temperature: %d </p>"
"<p>Humidity: %d %%</p>"
"</body>"
"</html>";
- On the weather_get_handler() function, change WEATHER_TXT to WEATHER_TXT_REF on the sprintf() function:
esp_err_t weather_get_handler(httpd_req_t *req)
{
ESP_LOGI(TAG, "Request headers lost");
int16_t temperature = 0;
int16_t humidity = 0;
char tmp_buff[256];
if (dht_read_data(sensor_type, dht_gpio, &humidity, &temperature) == ESP_OK)
{
sprintf(tmp_buff, WEATHER_TXT_REF, (const char*) req->user_ctx, temperature/10, humidity/10);
}else{
tmp_buff[0]=' ';
}
Then, we send data to the client by calling the http_resp_send() function:
httpd_resp_send(req, tmp_buff, strlen(tmp_buff));
if (httpd_req_get_hdr_value_len(req, "Host") == 0) {
ESP_LOGI(TAG, "Request headers lost");
}
return ESP_OK;
}
- Save this code, and then try to compile and upload this program into the ESP32 board.
- Now we can test our program; open a browser and navigate to http://<ip address of ESP32 board>/weather. You should get a web form, as shown in the preceding section. This browser output will auto-refresh every five seconds.
Now that we've set up the weather station and configured it to give an auto-refreshed output every five seconds, let's move on to dealing with scalability.