ESP32 Webserver DHT22 und Servo

TimoH

Grünschnabel
Hallo,

Ich mache derzeit ein Schulprojekt und baue eine Funkenstrecke.
ich würde gerne einen laufenden Webserver auf dem ich eine Elektrode mit einem Servo ansteuere über einen Balken gerne erweitern. Ich möchte nun zusätzlich einen Temperaturanzeige und Luftfeuchtigkeitsanzeige zu sehen haben im Webserver. Ich habe beide codes jedoch schaffe ich es nicht beide zu integriere und daraus einen Code zu machen kann mir da jemand helfen?


derzeitiger code ohne anzeige der Temp&Humid:
Code:
//Bibliotheken einfügen
#include <WiFi.h>
#include "DHT.h"
#include <Adafruit_Sensor.h>
#include <DHT_U.h>
#include <LiquidCrystal.h>
#define DHTPIN 4 //Der Sensor wird an PIN 4 angeschlossen   
#define DHTTYPE DHT22    // Es handelt sich um den DHT22 Sensor

LiquidCrystal lcd(22,23,5,18,19,21);
DHT dht(DHTPIN, DHTTYPE); //Der Sensor wird ab jetzt mit „dht“ angesprochen
const int servoPin = 0;  // pin auf dem der Servo liegt GPIO00
const char* ssid = "FRITZ!Box 6660 Cable GB"; // Router SSID eingeben
const char* password = "28337132026017053146"; //Passwort setzen des Routers
int dutyCycle = 0; //ist der Tastagrad, Verhältnis Periodendauer und Impulsdauer


const int PWMFreq = 50;  //PWm Frequenz einstellen
const int PWMChannel = 0; //Ausgabe Pin auf den Servo (Datenleitung zum Servo Pin00)
const int PWMResolution = 16; //inkrementierung (auflösung) einstellen
const int MAX_DUTY_CYCLE = (int)(pow(2, PWMResolution) - 1); //Maximale Sendezeit
WiFiServer espServer(80); //Webserver auf Port 80 einrichten
String request; 
 
void setup()
{ 
  Serial.begin(115200);  //Baudrate einstellen
  ledcSetup(PWMChannel, PWMFreq, PWMResolution); // LED PWM Kanal an GPIO PIN
 
  ledcAttachPin(servoPin, PWMChannel);
  ledcWrite(PWMChannel, dutyCycle);
  Serial.print("\n");
  Serial.print("Connecting to: "); //schreibt seriell aus:connecting to
  Serial.println(ssid);
  WiFi.mode(WIFI_STA); //ESP im STA konfigurieren
  WiFi.begin(ssid, password); // auf das oben angegebene Netzwerk verbinden
  while(WiFi.status() != WL_CONNECTED) //aktueller status der verbindung, Connected oder not Connected
  {
    Serial.print("*");
    delay(100);
  }
  Serial.print("\n");
  Serial.print("Connected to Wi-Fi: ");  //bei erfolg ausschreiben Connected to Wi-Fi seriell
  Serial.println(WiFi.SSID());
  delay(100);
 
  delay(2000);
  Serial.print("\n");
  Serial.println("Starting ESP32 Web Server for Servo Control...");
  espServer.begin(); // HTTP Server starten
  Serial.println("ESP32 Servo Web Server Started");
  Serial.print("\n");
  Serial.print("The URL of ESP32 Servo Web Server is: ");
  Serial.print("http://");
  Serial.println(WiFi.localIP());
  Serial.print("\n");
  Serial.println("Use the above URL in your Browser to access ESP32 Servo Web Server\n");
 
  //DHT22 Sensor starten
  dht.begin();
  //setup LCD
  lcd.begin(16, 2);
  lcd.clear();
  lcd.print(WiFi.localIP());
}
void loop()
{
  WiFiClient client = espServer.available(); // herausfinden ob der client connected ist
  if(!client)
  {
    return;
  }
  Serial.println("New Client!!!"); // wenn sich ein Gerät in den Webserver verbindet
  boolean currentLineIsBlank = true;
  while (client.connected())
  {
    if (client.available())
    {
     
      char c = client.read();
      request += c;
      Serial.write(c);
       
      if (c == '\n' && currentLineIsBlank)
      {
        client.println("HTTP/1.1 200 OK");  //Webserver anweisungen starten
        client.println("Content-type:text/html");
        client.println("Connection: close");
        client.println();
        client.println("<!DOCTYPE html>"); //Webserver mit HTML programmiert
        client.println("<html>");
       
        client.println("<head><meta name=\"viewport\" content=\"width=device-width, initial-scale=1\">");
        client.println("<link rel=\"icon\" href=\"data:,\">");
       
       
        client.println("<style>body { font-family: \"Courier New\"; margin-left:auto; margin-right:auto; text-align:center;}");
       
        client.println(".slidecontainer { width: 100%;}");
        client.println(".slider { -webkit-appearance: none;");
        client.println("width: 30%; height: 20px; background: #d3d3d3;");
        client.println("outline: none; opacity: 0.7; -webkit-transition: .2s; transition: opacity .2s;}");
        client.println(".slider:hover { opacity: 1; }");
        client.println(".slider::-webkit-slider-thumb { -webkit-appearance: none;");
        client.println("appearance: none; width: 15px; height: 28px;");
        client.println("border-radius: 30%; background: #4CAF50; cursor: pointer;}");
        client.println(".slider::-moz-range-thumb { width: 25px; height: 25px; background: #4CAF50; cursor: pointer;}</style>");
       
        client.println("<script src=\"https://code.jquery.com/jquery-3.6.0.min.js\"></script>");
       
        client.println("</head><body><h2>ESP32 Webserver Funkenstrecke</h2>"); //Überschrift des Webservers
        client.println("<p>Den Balken Ziehen</p>");  //Text unter dem Balken
       
        client.println("<input type=\"range\" min=\"0\" max=\"65535\" class=\"slider\" id=\"servoRange\" onchange=\"servo(this.value)\"/>");
        client.println("<p>Angle: <span id=\"servoPos\"></span></p>");
        client.println("<script>");
        client.println("var slider = document.getElementById(\"servoRange\");");
        client.println("var output = document.getElementById(\"servoPos\");");
        client.println("output.innerHTML = slider.value;");
        client.println("slider.oninput = function(){output.innerHTML = this.value;}");
        client.println("$.ajaxSetup({timeout:1000}); function servo(angle) { ");
        client.println("$.get(\"/servovalue=\" + angle); {Connection: close};}</script>");
               
        client.println("</body></html>");  
       
      
        if(request.indexOf("GET /servovalue=") != -1)
        {
          int position1 = request.indexOf('=');
          String angleStr = request.substring(position1+1);
          int angleValue = angleStr.toInt();
          dutyCycle = map(angleValue, 240, 330, 5, 32);
          ledcWrite(PWMChannel, dutyCycle);
        }
        client.println();
        break;
      }
        if(c == '\n')
        {
          currentLineIsBlank = true;
        }
        else if(c != '\r')
        {
          currentLineIsBlank = false;
        }
      
    }
  }
 
  delay(1);
  request = "";
 
  client.stop();
  Serial.println("Client disconnected"); //Verbundenes Gerät schließt den Webserver
  Serial.print("\n");
 
}


Code für Temp und Luftfeuchtigkeit aus dem Internet:

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

// Uncomment one of the lines below for whatever DHT sensor type you're using!
//#define DHTTYPE DHT11   // DHT 11
//#define DHTTYPE DHT21   // DHT 21 (AM2301)
#define DHTTYPE DHT22   // DHT 22  (AM2302), AM2321

/*Put your SSID & Password*/
const char* ssid = "YourNetworkName";  // Enter SSID here
const char* password = "YourPassword";  //Enter Password here

WebServer server(80);

// DHT Sensor
uint8_t DHTPin = 4;
              
// Initialize DHT sensor.
DHT dht(DHTPin, DHTTYPE);               

float Temperature;
float Humidity;
 
void setup() {
  Serial.begin(115200);
  delay(100);
 
  pinMode(DHTPin, INPUT);

  dht.begin();             

  Serial.println("Connecting to ");
  Serial.println(ssid);

  //connect to your local wi-fi network
  WiFi.begin(ssid, password);

  //check wi-fi is connected to wi-fi network
  while (WiFi.status() != WL_CONNECTED) {
  delay(1000);
  Serial.print(".");
  }
  Serial.println("");
  Serial.println("WiFi connected..!");
  Serial.print("Got IP: ");  Serial.println(WiFi.localIP());

  server.on("/", handle_OnConnect);
  server.onNotFound(handle_NotFound);

  server.begin();
  Serial.println("HTTP server started");

}
void loop() {
 
  server.handleClient();
 
}

void handle_OnConnect() {

 Temperature = dht.readTemperature(); // Gets the values of the temperature
  Humidity = dht.readHumidity(); // Gets the values of the humidity
  server.send(200, "text/html", SendHTML(Temperature,Humidity));
}

void handle_NotFound(){
  server.send(404, "text/plain", "Not found");
}

String SendHTML(float Temperaturestat,float Humiditystat){
  String ptr = "<!DOCTYPE html> <html>\n";
  ptr +="<head><meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0, user-scalable=no\">\n";
  ptr +="<title>ESP32 Weather Report</title>\n";
  ptr +="<style>html { font-family: Helvetica; display: inline-block; margin: 0px auto; text-align: center;}\n";
  ptr +="body{margin-top: 50px;} h1 {color: #444444;margin: 50px auto 30px;}\n";
  ptr +="p {font-size: 24px;color: #444444;margin-bottom: 10px;}\n";
  ptr +="</style>\n";
  ptr +="</head>\n";
  ptr +="<body>\n";
  ptr +="<div id=\"webpage\">\n";
  ptr +="<h1>ESP32 Weather Report</h1>\n";
 
  ptr +="<p>Temperature: ";
  ptr +=(int)Temperaturestat;
  ptr +="°C</p>";
  ptr +="<p>Humidity: ";
  ptr +=(int)Humiditystat;
  ptr +="%</p>";
 
  ptr +="</div>\n";
  ptr +="</body>\n";
  ptr +="</html>\n";
  return ptr;
}


LG
 
Zuletzt bearbeitet von einem Moderator:
Zurück