ESP8266 Simple Web Server

Create a Simple Web Server

We are creating a simple web server that just prints out to a web page Hello World on the root page and Other URL on the /other page.

First we need to load the libraries

#include <ESP8266WiFi.h>
#include <ESP8266WebServer.h>

Next we need to create a webserver on port 80.

ESP8266WebServer server(80);

Add your WiFi network name and password.

// setup the wifi
char ssid[] = "xxxxx"; // your network SSID (name)
char pass[] = "xxxxx"; // your network password

The root page handler and it’s call. The function handleRoot gets called when the web page url is set to the root like 192.168.0.103/. The function simply prints in plain text Hello world to the web page. The server.on("/", handleRoot); calls the function. The text/plain is used because we are just sending text and not html.

void handleRoot() {
  server.send(200, "text/plain", "Hello World");
}
...
  server.on("/", handleRoot); //Associate the handler function to the path

The Setup()

First we start a serial connection for debugging

  Serial.begin(115200);

Next we start the WiFi and wait for the connection.

  WiFi.begin(ssid, pass); //Connect to the WiFi network
  Serial.println(""); // print a new line
  Serial.print("Connecting .");
  while (WiFi.status() != WL_CONNECTED) {  //Wait for connection
    delay(500);
    Serial.print(".");
  }
  Serial.println(""); // print a new line

Next we "connect" the server functions.

  server.on("/", handleRoot); //Associate the handler function to the path

  // this is just a different way to connect a page to the server
  // this will handle the page 192.168.x.x/other
  server.on("/other", []() { //Define the handling function for the path
    server.send(200, "text/plain", "Other URL");
  });

Next we start the server and print the url of the web page.

  server.begin(); //Start the server
  Serial.print("Server listening, Open ");
  Serial.print(WiFi.localIP());
  Serial.println(" in your browser.");

The Loop()

In the loop we handle incoming requests to the server.

  server.handleClient(); //Handling of incoming requests

The full code

#include <ESP8266WiFi.h>
#include <ESP8266WebServer.h>

ESP8266WebServer server(80); // create the webserver on port 80

// setup the wifi
char ssid[] = "xxxxx"; // your network SSID (name)
char pass[] = "xxxxx"; // your network password

void handleRoot() {
  server.send(200, "text / plain", "Hello world");
}

void setup() {
  Serial.begin(115200); // output to the serial terminal for debugging
  WiFi.begin(ssid, pass); //Connect to the WiFi network
  Serial.println(""); // print a new line
  Serial.print("Connecting .");
  while (WiFi.status() != WL_CONNECTED) {  //Wait for connection
    delay(500);
    Serial.print(".");
  }
  Serial.println(""); // print a new line

  server.on("/", handleRoot); //Associate the handler function to the path
  // this will handle the page 192.168.x.x/other
  server.on("/other", []() { //Define the handling function for the path
    server.send(200, "text/plain", "Other URL");
  });

  server.begin(); //Start the server
  Serial.print("Server listening, Open ");
  Serial.print(WiFi.localIP());
  Serial.println(" in your browser.");
}

void loop() {
  server.handleClient(); //Handling of incoming requests
}

Upload and Test

Upload the code to the NodeMCU and open the url in a browser, typically it’s 192.168.0.103 but your url may be different. You should see the following:

Now add /other to the url and you should see the following: