ESP8266 Web Server | ESP8266 Web Server AP (Access Point)

In this tutorial we are making ESP8266 Web Server and ESP as acces point. A web server is server software, or hardware dedicated to running said software, that can satisfy World Wide Web client requests. A web server can, in general, contain one or more websites. A web server processes incoming network requests over HTTP and several other related protocols.

If you are not friendly with NodeMCU using Arduino IDE, Visit this: Arduino Support for ESP8266 with simple test code

Recommended: GPIO pins of ESP8266 and How to use efficiently

To implement web server on ESP, there are two ways to make your first web server first connect to your WiFi router or make ESP as access point. You can use ESP8266 as access point and it can connect to access point or both.

Recommended: NodeMCU ESP8266 OTA (Over-the-Air) using Arduino IDE

ESP8266 Web Server Arduino IDE Sketch

We need these libraries to make web server.

ESP8266WiFi.h is required for doing all WiFi related functionalities such as connection, AP, etc.

WiFiClient.h this file is required to send request to web browser

ESP8266WebServer.h it handles all HTTP protocols
#include <ESP8266WiFi.h>;
#include <WiFiClient.h>;
#include <ESP8266WebServer.h>;

Now Define your SSID and Password of your WiFi router, where the ESP connects

//SSID and Password of your WiFi router
const char* ssid = "your_ssid";
const char* password = "password";

Web server is on port 80, you can use other ports also, default HTTP port is 80

ESP8266WebServer server(80); //Server on port 80

We have two ways to make web server one is to connect to WiFi hot spot or make ESP as hot spot (Access Point).

This command is used to connect to your WiFi Access point. The term Access Point (AP) is same as WiFi Hot Spot. If the network is open you can remove password field from command.

 WiFi.begin(ssid, password); //Connect to your WiFi router

After connection request we wait for WiFi to get connect. ESP8266 once connected and disconnected afterwards due to signal loss or any reason, there is no need to give this command again, it will try to connect again automatically.

 // Wait for connection
while (WiFi.status() != WL_CONNECTED) {
delay(500);
Serial.print(".");
}

To get IP address i.e. assigned to ESP8266 by your WiFi router use this command

WiFi.localIP();

When client request a web page by entering ESP IP address which data to be sent is handled by subroutine and that subroutine name is defined in server.on(path,subroutine_name).

 server.on("/", handleRoot); //Which routine to handle at root location

To start the server use this command

server.begin(); //Start server

handle client request

server.handleClient(); //Handle client requests

This subroutine is called when you enter IP address in web browser and hit enter. This routine sends the test “hello from esp8266” to web browser.

void handleRoot() {
server.send(200, "text/plain", "hello from esp8266!");
}

Complete Code

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

//SSID and Password of your WiFi router
const char* ssid = "Circuits4you.com";
const char* password = "9422212729";

ESP8266WebServer server(80); //Server on port 80

//===============================================================
// This rutine is exicuted when you open its IP in browser
//===============================================================void handleRoot() {
server.send(200, "text/plain", "hello from esp8266!");
}

//==============================================================
// SETUP
//==============================================================
void setup(void){
Serial.begin(9600);

WiFi.begin(ssid, password); //Connect to your WiFi router
Serial.println("");

// Wait for connection
while (WiFi.status() != WL_CONNECTED) {
delay(500);
Serial.print(".");
}

//If connection successful show IP address in serial monitor
Serial.println("");
Serial.print("Connected to ");
Serial.println(ssid);
Serial.print("IP address: ");
Serial.println(WiFi.localIP()); //IP address assigned to your ESP

server.on("/", handleRoot); //Which routine to handle at root location

server.begin(); //Start server
Serial.println("HTTP server started");
}
//==============================================================
// LOOP
//==============================================================
void loop(void){
server.handleClient(); //Handle client requests
}

To see the result first get the IP address from serial monitor, Open serial monitor and press reset. Open web browser and enter this IP (192.168.x.x), Make sure that your laptop or phone must be connected to the same network.

ESP as Access Point

First hide its AP (Access point) using this command at the beginning of setup.

WiFi.mode(WIFI_STA); //This line hides the viewing of ESP as wifi network

In some application you may find that both AP and connection to WiFi router are useful for making configuration you use ESP8266 AP and for data sending to cloud use WiFi connectivity in that case use this command and both connections. This way you can access ESP web page with two different IP address.

WiFi.mode(WIFI_AP_STA); //Both hotspot and client are enabled

Third way is only access point, default is all AP and STA are enabled, to get only AP use this command.

 WiFi.mode(WIFI_AP); //Only Access point

To start ESP as Access point you have to use this simple command

WiFi.softAP(ssid, password); //Start HOTspot removing password will disable security

To get IP address i.e. assigned to ESP8266 by your WiFi router use this command

IPAddress myIP = WiFi.softAPIP(); //Get IP address

Complete Program for as Access Point

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

//SSID and Password to your ESP Access Point
const char* ssid = "iotbyhvm";
const char* password = "iotbyhvm";

ESP8266WebServer server(80); //Server on port 80

//==============================================================
// This rutine is exicuted when you open its IP in browser
//==============================================================
void handleRoot() {
server.send(200, "text/plain", "hello from esp8266!");
}

//===============================================================
// SETUP
//===============================================================
void setup(void){
Serial.begin(9600);
Serial.println("");
WiFi.mode(WIFI_AP); //Only Access point
WiFi.softAP(ssid, password); //Start HOTspot removing password will disable security

IPAddress myIP = WiFi.softAPIP(); //Get IP address
Serial.print("HotSpt IP:");
Serial.println(myIP);

server.on("/", handleRoot); //Which routine to handle at root location

server.begin(); //Start server
Serial.println("HTTP server started");
}
//===============================================================
// LOOP
//===============================================================
void loop(void){
server.handleClient(); //Handle client requests
}

Output

After uploading program take your mobile turn on WiFi and in WiFi setting Scan for hot spot you will find “iotbyhvm” hot spot connect to it with password “iotbyhvm” as we have given in program. After connecting to ESP hot spot, Open web browser in mobile phone and enter IP 192.168.x.x you will see “hello from esp8266!” message. IP address can be found in serial monitor.

I hope you like this post “ESP8266 Web Server | ESP8266 Web Server AP (Access Point)”. Do you have any questions? Leave a comment down below!

Thanks for reading. If you like this post probably you might like my next ones, so please support me by subscribing my blog.

We have other tutorials with ESP32 that you may find useful:

• Dynamic WLAN configuration for ESP32 Board | AutoConnect
• ArduinoOTA ESP32: Wi-Fi (OTA) Wireless Update from the Arduino IDE
• ESP32 with LoRa using Arduino IDE
• How To Use Grove-LCD RGB Backlight with NodeMCU
• NodeMcu to DHT Interface in Blynk app
• How To ON/OFF a bulb by Google voice assistant
• Arduino IDE | Arduino | Open Source Hardware/Softawre | Arduino Vs RPi
• WiFi LoRA 32 (V2) ESP32 | Overview | Introduction
• DHT11 sensor with ESP8266/NodeMCU using Arduino IDE
• Arduino Support for ESP8266 with simple test code

You may like also:

• Raspberry Pi – Introduction | Overview | Setup and Management | Tutorials
• MQTT | What is MQTT | MQTT in Depth | QoS | FAQs | MQTT Introduction
• How to set up Windows 10 IoT Core on the Raspberry Pi
• Best IoT Visual Programming Tools

Upvote on Reddit