ESP32 Arduino: HTTP server over soft AP

In this ESP32 tutorial, we will check how to setup an asynchronous HTTP web server with the device operating as soft Access Point. The tests of this ESP32 tutorial were performed using a DFRobot’s ESP-WROOM-32 device integrated in a ESP32 development board.

Introduction

In this ESP32 tutorial, we will check how to setup an asynchronous HTTP web server with the device operating as soft Access Point.

Thus, in order for a client to be able to reach the HTTP server, we don’t need to connect it to a router but rather to the WiFi network hosted by the ESP32.

The possibility of setting a HTTP server on the ESP32 working as soft AP is very useful since in real application scenarios, an IoT device may be deployed in a WiFi network to which the credentials are not known in code compile time.

Thus, we need to have a way of setting those credentials for the ESP32 to be able to connect to the WiFi network.

Although this could be done using, for example, serial communication, this would be impractical for some commercial applications where it will be the end user making the initial configuration for the device to start operating.

Thus, a possible way of solving this problem is making the ESP32 operate as soft AP when connected for the first time, starting a HTTP server that serves a configuration HTML webpage for the user to input the name and password of the WiFi network to which the device should connect to to be able to reach the Internet and operate.

One good example is a possible commercial IoT thermostat, which makes measurements of the environment temperature and sends it to the Internet. In this case, each unit would need to be configured for operating in each users’ house and thus this type of method for an initial configuration would be a good solution.

Naturally, designing this type of interface is a more complex scenario and in this introductory example we will set the server to simply return a “hello world” message.

Nonetheless, the HTTP web server examples from previous posts can also be tested with the ESP32 operating as soft AP, and they already include a tutorial on how to serve HTML and JavaScript. You can check more on the “Related Posts” section.

If you haven’t yet configured the ESP32 Arduino libraries needed for setting an asynchronous HTTP web server, please check here how to do it.

The tests of this ESP32 tutorial were performed using a DFRobot’s ESP-WROOM-32 device integrated in a ESP32 FireBeetle board.

The code

In terms of coding, this example will be based on two previous tutorials we have been covering for the Arduino environment. The first one is how to set a soft AP (which can be consulted here) and the second one is how to configure a HTTP web server on the ESP32 (you can check it here).

One important thing to mention is that the HTTP server will be configured the exact same way it would be if we were connecting the ESP32 to a WiFi network hosted by a router, like we have been doing in the previous tutorials.

So, in terms of implementation, the interface we use to configure the server doesn’t need the awareness of which type of WiFi network is being used.

In terms of coding, we start by the includes needed. To set the soft AP, we need to include the WiFi.h library. The remaining includes are needed for setting up the HTTP server.

#include <WiFi.h>
#include <FS.h>
#include <AsyncTCP.h>
#include <ESPAsyncWebServer.h>

In order for other devices to be able to connect to the soft AP, we need to specify its SSID (network name) and the password protecting it. We will declare these credentials as global variables.

const char *ssid = "MyESP32AP";
const char *password = "testpassword";

To finish the global declarations, we will need an instance of the AsyncWebServer class, which exposes a high level API that will allow us to configure the web server.

Remember from the previous tutorials that the constructor for this class receives as argument the port where the server will be listening for incoming HTTP requests. As usual, we will use the default HTTP port, which is 80.

AsyncWebServer server(80);

Moving on to the setup function, we will start it by opening a serial connection, since we will need to print the IP of the ESP32 for the client to be able to reach it.

Serial.begin(115200);

To start the soft AP, we simply need to call the softAP method of the WiFi external variable (this is the same variable we use to connect the ESP32 to a WiFi network).

This method receives as first input the name of the WiFi network we want to set and as second input its password. Just as a note, setting a password is not mandatory and we could have not specify it if we wanted our Access Point to be open.

WiFi.softAP(ssid, password);

As mentioned, we will need to know the ESP32 IP, in order for the client connected to its network to be able to send requests to it. We can obtain the IP by calling the softAPIP method on the same WiFi variable.

Serial.print("IP address: ");
Serial.println(WiFi.softAPIP());

Now that we have handled the WiFi network part, we need to set the server. To do it, we simply need to bind a route to a handling function, which will be executed when HTTP requests are performed to that route.

We will use the “/hello” route and set the server to listen to incoming HTTP GET requests.

The route handling function will simply return an HTTP OK code (200) and a “Hello World” message.

The code for this configuration can be seen below. If you need a detailed explanation on all the parameters and functions used in this configuration, please consult this post.

server.on("/hello", HTTP_GET, [](AsyncWebServerRequest *request){
    request->send(200, "text/plain", "Hello World");
});

To start the server, we need to call the begin method on our server object, so it starts listening and handling the incoming requests.

With this call, we finish the setup function and since the server works asynchronously, the Arduino loop may be left empty. The final source code can be seen below.

#include <WiFi.h>
#include <FS.h>
#include <AsyncTCP.h>
#include <ESPAsyncWebServer.h>
 
const char *ssid = "MyESP32AP";
const char *password = "testpassword";
 
AsyncWebServer server(80);
 
void setup(){
  Serial.begin(115200);
 
  WiFi.softAP(ssid, password);
 
  Serial.println();
  Serial.print("IP address: ");
  Serial.println(WiFi.softAPIP());
 
  server.on("/hello", HTTP_GET, [](AsyncWebServerRequest *request){
    request->send(200, "text/plain", "Hello World");
  });
 
  server.begin();
}
 
void loop(){}

Testing the code

To test the code, compile it and upload it to your ESP device and then open the Arduino IDE serial monitor. Once the soft AP is set, the IP of the ESP32 should get printed to the monitor, as shown in figure 1. Copy that IP.

Figure 1 – IP of the ESP32.

At that moment, the WiFi network should already be detectable by your computer. Look for it in the available WiFi networks and connect to it using the password we have defined on the code. Figure 2 shows the network being detected on a machine running windows 8.

Figure 2 – WiFi network hosted by the ESP32 being detected on Windows 8.

To finalize, after connected to that network, open a web browser of your choice and type the following in the address bar, changing {yourEspIp} by the value you have copied from the serial monitor.

http://{yourEspIp}/hello

You should get an output similar to figure 3, which shows the “Hello world” message being returned.

Figure 3 – ESP32 server returning the message to the client.

DFRobot supply lots of esp32 arduino tutorials and esp32 projects for makers to learn.