How to upload a float to a ESP32 website

Using Arduino Programming Questions
1

Hi, I am trying to upload a float to my website hostet by my ESP32.

So I got this method:

Arduino Code:

int outputValue = 0;
int InterruptCounter;
int windSpeed = A0;
float WindSpeed;

void printWindSpeed() {
  meassure();
  Serial.println("------------------------");
  Serial.print("Wind Speed: ");
  Serial.print(WindSpeed);       //Speed in km/h
  Serial.print(" km/h - ");
  Serial.print(WindSpeed / 3.6); //Speed in m/s
  Serial.println(" m/s");
  Serial.print("Interrupts: ");
  Serial.println(InterruptCounter);
}

void meassure() {
  InterruptCounter = 0;
  //attachInterrupt(digitalPinToInterrupt(SensorPin), countup, RISING);
  
  //detachInterrupt(digitalPinToInterrupt(SensorPin));
  //WindSpeed = (float)InterruptCounter / (float)RecordTime * 2.4;

  outputValue = analogRead(windSpeed); 
  Serial.println(outputValue);
  if(outputValue > 0) {
      countup();
      delay(30);
  }
  delay(1000 * RecordTime);
  WindSpeed = (float)InterruptCounter / (float)RecordTime * 2.4;
}

void countup() {
  InterruptCounter++;
}

and I want to upload the float WindSpeed; to this website:

HTML:

String HTML_Code() 
  {
      String page = "<html>\n";      
      
  page += "<!DOCTYPE html>"
            "<html>"
                "<meta charset='utf-8'/>"
                "<head>"
                    "<link rel='stylesheet' href='CSS.css'>"
                    "<title>Wetterstation</title>"
            
                    "<link href='https://fonts.googleapis.com/css2?family=Roboto:wght@700&display=swap' rel='stylesheet'>"
                    "<link href='https://fonts.googleapis.com/css2?family=Dancing+Script:wght@700&display=swap' rel='stylesheet'>"
                    "<link href='https://fonts.googleapis.com/css2?family=Secular+One&display=swap' rel='stylesheet'>"
                    "<link href='https://fonts.googleapis.com/css2?family=Roboto+Mono&display=swap' rel='stylesheet'>"
                "</head>\n";
page += CSS_Code();
page += "<body>"
                    "<header>"
                        "<div id='title'>"
                            "Wetterstation"
                        "</div>"
                    "</header>"

                    "<section>"
                        "<nav id='WS_Anzeige'>"
                            "<div>"
                                "Windgeschwindigkeit: /* Here should be float WindSpeed */";  
                            "</div>"
                            "<div>"
                                "dasdadsadad asdsada"
                                
                            "</div>"
                        "</nav>"
                    "</section>\n";
   page += JS_Code();       
   page +="</body></html>\n";
return page;
}

CSS:

String CSS_Code(void) 
{
  String css = "<style>\n";          
  css +=  "body {"
              "background-color: red;"
          "}"

          "section {"
              "background-color: #ffffff;"
              "padding-bottom: 40%;"
              "margin: 1% 2% 0% 2%;"
              "border-radius: 40px;"
          "}"
          
          "header {"
              "margin-left: 5%;"
              "margin-top: 1%;"
          "}"
          
          "#title {"
              "font-family: 'Secular One';"
              "font-size: 500%;"
              "color: #ffffff;"
          "}"
          
          "nav div {"
              "font-family: 'Roboto Mono';"
              "font-size: 32px;"
              "display: inline-block;"
              "margin: 5%;"
          "}\n";

  
    css +="</style>\n";
    return css;
}

but to be honest I have no Idea what code I have to write. I´ve tried a few things but none of them worked.

2

random nerd tutorials has articles about this kind of projects.
I haven't read all details but from the pictures showing floating-point values on a website I assume there is a good chance that it will be helpful.

best regards Stefan

3

use HTTP POST ?

4

This topic was automatically closed 180 days after the last reply. New replies are no longer allowed.