Hi,
I am new in this type of projects and I need some advice about asynchronous web servers using the ESP32 because I have a problem connecting to the wifi.
I tried to do an asynchronous web server with an Sparkfun ESP32 Thing Plus and the Arduino IDE and I used this projet as reference: [u]https://techtutorialsx.com/2017/12/01/esp32-arduino-asynchronous-http-webserver/[/u] .
This is my code:
//Reference : https://techtutorialsx.com/2017/12/01/esp32-arduino-asynchronous-http-webserver/ #include "WiFi.h" #include "ESPAsyncWebServer.h" const char* ssid = "ssid"; const char* password = "password"; AsyncWebServer server(80); void setup(){ Serial.begin(115200); WiFi.begin(ssid, password); Serial.println("Start"); while (WiFi.status() != WL_CONNECTED) { delay(1000); Serial.println("Connecting to WiFi..."); } Serial.println("Success connecting"); Serial.println("IP Adress: "); Serial.print(WiFi.localIP()); server.on("/hello", HTTP_GET, [](AsyncWebServerRequest *request){ request->send(200, "text/plain", "Hello World"); }); server.begin(); } Everytime I compile the code there is no errors but when I open the serial monitor I am stuck in "Connecting to Wifi..." I think my WiFi.status is never connected.
I made sure I had installed all the libraries I needed and all the settings in the Tools are good.
Thank you in advance for your help !
"when I open the serial monitor I am stuck in "Connecting to Wifi..."
did you add the appropriate ssid and password to connect to your network/router?
Thanks for your reply zoomkat,
I put the same ssid and password that I used in a code for a Soft Access Point with the ESP32 and the WiFi.h library, but is it the right thing to do ? Or should I change it because I am using the ESPAsyncWebServer.h ?
I read that it might be a problem with the http port so I also tried the code with a different port, instead of using "server (80)" I tried with "server(8080)" but it didn't work.
I still have this in the serial monitor :
mariafalher:
Is that Access Point running in the same physical location? Maybe they are conflicting.
aarg:
Thanks for the reply,
I used the Access Point code for a different project before doing this one so they are not running at the same time but I tried the two codes with the same ESP32.
Could it be that the SAP doesn't allow the connection even if the code is not running ?
The project I made with the SAP is this one :
//Reference: https://microcontrollerslab.com/esp32-soft-access-point-web-server-in-arduino-ide/ /* #include "WiFi.h" //Variables #define LED1 13 //First light #define LED2 33 //Second light #define potPin 34 //Signal from the potentiometer const char* ssid = "ESP32-SAP"; const char* password = "12345678"; //Server port WiFiServer server(80); String html = "<!DOCTYPE html> \ <html> \ <body> \ <center><h1>ESP32 Soft access point</h1></center> \ <center><h2>Web Server</h2></center> \ <form> \ <button name=\"LED1\" button style=\"color:green\" value=\"ON\" type=\"submit\">LED1 ON</button> \ <button name=\"LED1\" button style=\"color:red\" value=\"OFF\" type=\"submit\">LED1 OFF</button> \ <button name=\"LED2\" button style=\"color:green\" value=\"ON\" type=\"submit\">LED2 ON</button> \ <button name=\"LED2\" button style=\"color:red\" value=\"OFF\" type=\"submit\">LED2 OFF</button> \ </form> \ </body> \ </html>"; int potValue = 0; //Initializa potentiometer value void Connect_WiFi() { WiFi.begin(ssid, password); while (WiFi.status() != WL_CONNECTED) { delay(100); } } void setup() { Serial.begin(115200); pinMode(LED1, OUTPUT); pinMode(LED2, OUTPUT); digitalWrite(LED1, LOW); digitalWrite(LED2, LOW); Serial.print("Setting soft access point mode"); WiFi.softAP(ssid, password); IPAddress IP = WiFi.softAPIP(); Serial.print("AP IP address: "); Serial.println(IP); server.begin(); } void loop() { potValue = analogRead(potPin); //Serial.println(potValue); WiFiClient client = server.available(); if (client) { String request = client.readStringUntil('\r'); if (request.indexOf("LED1=ON") != -1)digitalWrite(LED1, HIGH); if (request.indexOf("LED1=OFF") != -1)digitalWrite(LED1, LOW); if (request.indexOf("LED2=ON") != -1)digitalWrite(LED2, HIGH); if (request.indexOf("LED2=OFF") != -1)digitalWrite(LED2, LOW); client.print(html); if(potValue <= 4095){ client.print("Analog Data: "); client.print(potValue); client.print(" "); client.print(" "); } request = ""; } } */
"I used the Access Point code for a different project before doing this one so they are not running at the same time but I tried the two codes with the same ESP32."
Have you been able to log into any network/router with various example codes?
I have been able to connect to the same network with different codes using the WiFi.h library only.
I think that when I use the AsyncWebServer instead of the WiFiServer I am not able to reach the server, but I am not sure why...
"I think that when I use the AsyncWebServer instead of the WiFiServer I am not able to reach the server, but I am not sure why... "
Is the AsyncWebServer made to be used with the ESP32? It seems in some instances the esp32 and esp8266 require different libraries.
Here is a working Access Point asynchronous webpage (AJAX) example for the ESP32:
#include <WiFi.h> #include <WiFiClient.h> #include <WiFiAP.h> const char MAIN_page[] PROGMEM = "<!DOCTYPE html>\n<html>\n<style>\nbody, html {\n height: 100%;\n margin: 0;\n font-family: Arial;\n}\n\n/* Style tab links */\n.tablink {\n background-color: #555;\n color: white;\n float: left;\n border: none;\n outline: none;\n cursor: pointer;\n padding: 14px 16px;\n font-size: 17px;\n width: 33.33%;\n}\n\n.tablink:hover {\n background-color: #777;\n}\n\n.tabcontent {\n color: white;\n display: none;\n padding: 100px 20px;\n height: 100%;\n}\n\n#Home {background-color: white;}\n#PIDs {background-color: white;}\n#Console {background-color: white;}\n#About {background-color: white;}\n\n.card\n{\n max-width: 400px;\n min-height: 250px;\n background: #02b875;\n padding: 30px;\n box-sizing: border-box;\n color: #FFF;\n margin:20px;\n box-shadow: 0px 2px 18px -4px rgba(0,0,0,0.75);\n}\n\n#myProgress\n{\n width: 100%;\n background-color: #ddd;\n}\n\n#myBar\n{\n width: 1%;\n height: 30px;\n background-color: #4CAF50;\n}\n\n/* Style the form - display items horizontally */\n.form-inline {\n display: flex;\n flex-flow: row wrap;\n align-items: center;\n}\n\n/* Add some margins for each label */\n.form-inline label {\n margin: 5px 10px 5px 0;\n}\n\n/* Style the input fields */\n.form-inline input {\n vertical-align: middle;\n margin: 5px 10px 5px 0;\n padding: 10px;\n background-color: #fff;\n border: 1px solid #ddd;\n}\n\n/* Style the submit button */\n.form-inline button {\n padding: 10px 20px;\n background-color: dodgerblue;\n border: 1px solid #ddd;\n color: white;\n}\n\n.form-inline button:hover {\n background-color: royalblue;\n}\n\n/* Add responsiveness - display the form controls vertically instead of horizontally on screens that are less than 800px wide */\n@media (max-width: 800px) {\n .form-inline input {\n margin: 10px 0;\n }\n\n .form-inline {\n flex-direction: column;\n align-items: stretch;\n }\n}\n</style>\n\n<body>\n<button class=\"tablink\" onclick=\"openPage('Home', this, 'red')\" id=\"defaultOpen\">Home</button>\n<button class=\"tablink\" onclick=\"openPage('PIDs', this, 'green')\">PIDs</button>\n<button class=\"tablink\" onclick=\"openPage('Console', this, 'blue')\">Console</button>\n\n<div id=\"Home\" class=\"tabcontent\">\n <h3>Home</h3>\n <div class=\"card\">\n <h4>ArduHUD</h4> \n <h1>Speed: <span id=\"speed\">0</span></h1>\n <div id=\"myProgress\">\n <div id=\"myBar\"></div>\n </div> \n </div>\n</div>\n\n<div id=\"PIDs\" class=\"tabcontent\">\n <h3>PIDs</h3>\n <p>Some PIDs this fine day!</p>\n</div>\n\n<div id=\"Console\" class=\"tabcontent\">\n <h3>Console</h3>\n <form class=\"form-inline\" action=\"/action_page.php\">\n <label for=\"email\">Email:</label>\n <input type=\"email\" id=\"email\" placeholder=\"Enter email\" name=\"email\">\n <button type=\"submit\">Submit</button>\n</form>\n</div>\n</body>\n\n<script>\nfunction openPage(pageName, elmnt, color)\n{\n // Hide all elements with class=\"tabcontent\" by default */\n var i, tabcontent, tablinks;\n tabcontent = document.getElementsByClassName(\"tabcontent\");\n for (i = 0; i < tabcontent.length; i++)\n {\n tabcontent[i].style.display = \"none\";\n }\n\n // Remove the background color of all tablinks/buttons\n tablinks = document.getElementsByClassName(\"tablink\");\n for (i = 0; i < tablinks.length; i++)\n {\n tablinks[i].style.backgroundColor = \"\";\n }\n\n // Show the specific tab content\n document.getElementById(pageName).style.display = \"block\";\n\n // Add the specific color to the button used to open the tab content\n elmnt.style.backgroundColor = color;\n}\n\ndocument.getElementById(\"defaultOpen\").click();\n\nsetInterval(function()\n{\n getSpeedData();\n getRpmData();\n}, 1000);\n\n\nfunction getSpeedData()\n{\n var xhttp = new XMLHttpRequest();\n \n xhttp.onreadystatechange = function()\n {\n if (this.readyState == 4 && this.status == 200)\n {\n document.getElementById(\"speed\").innerHTML = this.responseText;\n }\n };\n \n xhttp.open(\"GET\", \"speed\", true);\n xhttp.send();\n}\n\n\nfunction move(width)\n{\n var elem = document.getElementById(\"myBar\");\n var id = setInterval(frame, 10);\n \n function frame()\n {\n if (width > 100)\n {\n width = 100;\n }\n else if (width < 0)\n {\n width = 0;\n }\n \n console.log(width);\n elem.style.width = width + \"%\";\n }\n}\n\nfunction getRpmData()\n{\n var xhttp = new XMLHttpRequest();\n \n xhttp.onreadystatechange = function()\n {\n if (this.readyState == 4 && this.status == 200)\n {\n move(parseInt(this.responseText), 10);\n }\n };\n \n xhttp.open(\"GET\", \"rpm\", true);\n xhttp.send();\n}\n</script>\n</html>"; WiFiServer server(80); const char *ssid = "HUDuino"; void setup() { pinMode(LED_BUILTIN, OUTPUT); digitalWrite(LED_BUILTIN, HIGH); Serial.begin(115200); WiFi.softAP(ssid); IPAddress myIP = WiFi.softAPIP(); Serial.println(myIP); server.begin(); } void loop() { serverProcessing(); } void serverProcessing() { bool main = false; bool speed_request = false; bool rpm_request = false; WiFiClient client = server.available(); if (client) { String currentLine = ""; while (client.connected()) { if (client.available()) { char c = client.read(); //Serial.write(c); if (currentLine.endsWith("GET / HTTP")) main = true; else if (currentLine.endsWith("GET /speed HTTP")) speed_request = true; else if (currentLine.endsWith("GET /rpm HTTP")) rpm_request = true; if (c == '\n') { if (!currentLine.length()) { if (main) { client.println("HTTP/1.1 200 OK"); client.println("Content-type:text/html"); client.println(); client.print(MAIN_page); client.println(); main = false; break; } else if (speed_request) { client.println("HTTP/1.1 200 OK"); client.println("Content-type:text/html"); client.println(); client.println(random(0, 100)); client.println(); speed_request = false; break; } else if (rpm_request) { client.println("HTTP/1.1 200 OK"); client.println("Content-type:text/html"); client.println(); client.println(random(0, 100)); client.println(); rpm_request = false; break; } else { client.println("HTTP/1.1 200 OK"); client.println("Content-type:text/html"); client.println(); client.print(MAIN_page); client.println(); break; } } else currentLine = ""; } else if (c != '\r') currentLine += c; } } client.stop(); } } 1 Like
zoomkat:
I think the library is compatible with both of the ESP because the tutorial I used as reference and other websites I consulted used the ESP32-WROOM-32, the same ESP32 I am using.
Here are some of those websites:
While the standard ESPAsyncWebServer does work on the ESP32, the author does not support the Arduino IDE for it's use, preferring PlatformIO. I want to stay with the ugly beast because it makes the code accessible to a wider range of people (Ok,...
Power_Broker:
Thank you very much Power_Broker,
I am able to connect to the server and have a web page.
Do you know if it is possible to send text files (.txt) with AJAX ?
My ultimate goal for this project is to be able to send a file to a web page via WiFi, that's why I choose to use the ESPAsyncWebServer.h but it seems to be more complicated than expected.
After a couple of tests I found a solution for the AsyncWebServer. In the code of the ESP32 AP, I replace the WiFi.begin for a WiFi.softAP and I put a WiFi.mode(WIFI_AP), until now it seems to work well
Thank you all for your help.
The final code of the test is this:
#include <WiFi.h> #include <ESPAsyncWebServer.h> const char* ssid = "ESP32wifi"; const char* password = "12345679"; AsyncWebServer server(80); void setup() { Serial.begin(115200); delay(1000); Serial.println("Start"); Serial.print("Connecting to : "); Serial.println(ssid); WiFi.mode(WIFI_AP); WiFi.softAP(ssid, password); //WiFi.begin(ssid, password); //Erase this part Serial.println("Success"); server.on("/hello", HTTP_GET, [](AsyncWebServerRequest * request) { request->send(200, "text/html", "<p>Hello world!</p>"); }); server.begin(); } void loop() { } 1 Like
