ESP8266 NodeMCU OTA (Over-the-Air) Updates – AsyncElegantOTA using Arduino IDE

In this guide, you’ll learn how to do over-the-air (OTA) updates to your ESP8266 NodeMCU boards using the AsyncElegantOTA library. This library creates a web server that allows you to update new firmware (a new sketch) to your board without the need to make a serial connection between the ESP8266 and your computer.

This tutorial is DEPRECATED. Please follow this instead: ESP8266 NodeMCU OTA (Over-the-Air) Updates – ElegantOTA Library with Arduino IDE.

Additionally, you can also upload new files to the ESP8266 filesystem (LittleFS). The library is very easy to use, and it’s compatible with the ESPAsyncWebServer library that we often use to build web server projects.

ESP8266 NodeMCU OTA Over-the-Air Updates AsyncElegantOTA using Arduino IDE

By the end of this tutorial, you’ll be able to easily add OTA capabilities to your web server projects with the ESP8266 to upload new firmware and files to the filesystem wirelessly in the future.

We have a similar tutorial for the ESP32 board: ESP32 OTA (Over-the-Air) Updates – AsyncElegantOTA using Arduino IDE

Watch the Video Tutorial

This project is available in video format and in written format. You can watch the video below or you can scroll down for the written instructions.

Overview

This tutorial covers:

We recommend that you follow all the steps in this tutorial to understand how ElegantOTA works and how you can use it in your projects. To demonstrate how to do this, we’ll upload files to build different web server projects.

OTA (Over-the-Air) Programming

OTA (Over-the-Air) update is the process of loading new firmware to the ESP8266 NodeMCU board using a Wi-Fi connection rather than serial communication. This functionality is extremely useful in case of no physical access to the ESP8266 board.

There are different ways to perform OTA updates. In this tutorial, we’ll cover how to do that using the AsyncElegantOTA library. In our opinion, this is one of the best and easiest ways to perform OTA updates.

The AsyncElegantOTA library creates a web server that you can access on your local network to upload new firmware or files to the filesystem (LittleFS). The files you upload should be in .bin format. We’ll show you later in the tutorial how to convert your files to .bin format.

Async ElegantOTA Web Server How it Works ESP8266

The only disadvantage of OTA programming is that you need to add the code for OTA in every sketch you upload so that you’re able to use OTA in the future. In the case of the AsyncElegantOTA library, it consists of just three lines of code.

AsyncElegantOTA Library

As mentioned previously, there are a bunch of alternatives for OTA programming with the ESP8266 boards. For example, in the Arduino IDE, under the Examples folder, there is the BasicOTA example (that never worked well for us); and many other examples from different libraries.

Most of our web server projects with the ESP8266 use the ESPAsyncWebServer library. So, we wanted a solution that was compatible with that library. The AsyncElegantOTA library is just perfect for what we want:

AsyncElegantOTA Library
  • It is compatible with the ESPAsyncWebServer library;
  • You just need to add three lines of code to add OTA capabilities to your “regular” Async Web Server;
  • It allows you to update not only new firmware to the board but also files to the ESP8266 filesystem (LittleFS);
  • It provides a beautiful and modern web server interface;
  • It works extremely well.

If you like this library and you’ll use it in your projects, consider supporting the developer’s work.

OTA Updates with AsyncElegantOTA Library – Quick Summary

To add OTA capabilities to your projects using the AsyncElegantOTA library, follow these steps:

  1. Install AsyncElegantOTA, ESPAsyncTCP and ESPAsyncWebServer libraries;
  2. Include AsyncElegantOTA library at the top of the Arduino sketch: #include <AsyncElegantOTA.h>;
  3. Add this line AsyncElegantOTA.begin(&server); before server.begin();
  4. Open your browser and go to http://<IPAddress>/update, where <IPAddress> is your ESP8266 IP address.

Continue reading the tutorial for more detailed steps.

How does OTA Web Updater Work?

  • The first sketch should be uploaded via the serial port. This sketch should contain the code to create the OTA Web Updater so that you can upload code later using your browser.
  • The OTA Web Updater sketch creates a web server you can access to upload a new sketch via a web browser.
  • Then, you need to implement OTA routines in every sketch you upload so that you’re able to do the next updates/uploads over-the-air.
  • If you upload a code without an OTA routine, you’ll no longer be able to access the web server and upload a new sketch over-the-air.

Install AsyncElegantOTA Library

In this tutorial, the ESP8266 will be programmed using Arduino IDE. If you want to learn how to do the same using VS Code + PlatformIO, follow the next tutorial: ESP8266 NodeMCU OTA (Over-the-Air) Updates – AsyncElegantOTA (VS Code + PlatformIO).

You can install the AsyncElegantOTA library using the Arduino Library Manager. In your Arduino IDE, go to Sketch > Include Library > Manage Libraries… Search for “AsyncElegantOTA” and install it.

Install Async Elegant OTA Library Arduino IDE

Install ESPAsyncWebServer and ESPAsyncTCP Libraries

You also need to install the ESPAsyncTCP and the ESPAsyncWebServer libraries. Click the links below to download the libraries.

These libraries aren’t available to install through the Arduino Library Manager, so you need to copy the library files to the Arduino Installation Libraries folder. Alternatively, in your Arduino IDE, you can go to Sketch Include Library > Add .zip Library and select the libraries you’ve just downloaded.

AsyncElegantOTA ESP8266 Basic Example

Let’s start with the basic example provided by the library. This example creates a simple web server with the ESP8266. The root URL displays some text, and the /update URL displays the interface to update firmware and filesystem.

Copy the following code to your Arduino IDE.

/*
  Rui Santos
  Complete project details
   - Arduino IDE: https://RandomNerdTutorials.com/esp8266-nodemcu-ota-over-the-air-arduino/
   - VS Code: https://RandomNerdTutorials.com/esp8266-nodemcu-ota-over-the-air-vs-code/
     
  This sketch shows a Basic example from the AsyncElegantOTA library: ESP8266_Async_Demo
  https://github.com/ayushsharma82/AsyncElegantOTA
*/

#include <Arduino.h>
#include <ESP8266WiFi.h>
#include <ESPAsyncTCP.h>
#include <ESPAsyncWebServer.h>
#include <AsyncElegantOTA.h>

const char* ssid = "REPLACE_WITH_YOUR_SSID";
const char* password = "REPLACE_WITH_YOUR_PASSWORD";

AsyncWebServer server(80);

void setup(void) {
  Serial.begin(115200);
  WiFi.mode(WIFI_STA);
  WiFi.begin(ssid, password);
  Serial.println("");

  // Wait for connection
  while (WiFi.status() != WL_CONNECTED) {
    delay(500);
    Serial.print(".");
  }
  Serial.println("");
  Serial.print("Connected to ");
  Serial.println(ssid);
  Serial.print("IP address: ");
  Serial.println(WiFi.localIP());

  server.on("/", HTTP_GET, [](AsyncWebServerRequest *request) {
    request->send(200, "text/plain", "Hi! I am ESP8266.");
  });

  AsyncElegantOTA.begin(&server);    // Start ElegantOTA
  server.begin();
  Serial.println("HTTP server started");
}

void loop(void) {

}

View raw code

Insert your network credentials and the code should work straight away:

const char* ssid = "REPLACE_WITH_YOUR_SSID";
const char* password = "REPLACE_WITH_YOUR_PASSWORD";

How the Code Works

First, include the necessary libraries:

#include <ESP8266WiFi.h>
#include <ESPAsyncTCP.h>
#include <ESPAsyncWebServer.h>
#include <AsyncElegantOTA.h>

Insert your network credentials in the following variables so that the ESP8266 can connect to your local network.

const char* ssid = "REPLACE_WITH_YOUR_SSID";
const char* password = "REPLACE_WITH_YOUR_PASSWORD";

Create an AsyncWebServer object on port 80:

AsyncWebServer server(80);

In the setup(), initialize the Serial Monitor:

Serial.begin(115200);

Initialize Wi-Fi:

WiFi.mode(WIFI_STA);
WiFi.begin(ssid, password);
Serial.println("");

// Wait for connection
while (WiFi.status() != WL_CONNECTED) {
  delay(500);
  Serial.print(".");
}
Serial.println("");
Serial.print("Connected to ");
Serial.println(ssid);
Serial.print("IP address: ");
Serial.println(WiFi.localIP());

Then, handle the client requests. The following lines, send some text Hi! I am ESP8266. when you access the root (/) URL:

server.on("/", HTTP_GET, [](AsyncWebServerRequest *request) {
  request->send(200, "text/plain", "Hi! I am ESP8266.");
});

If your web server needs to handle more requests you can add them (we’ll show you in the next example).

Then, add the next line to start ElegantOTA:

AsyncElegantOTA.begin(&server);    // Start ElegantOTA

Finally, initialize the server:

server.begin();

Access the Web Server

After uploading code to the board, open the Serial Monitor at a baud rate of 115200. Press the ESP8266 on-board RST button. It should display the ESP IP address as follows (yours may be different):

Async ElegantOTA Get ESP IP Address Serial Monitor

In your local network, open your browser and type the ESP8266 IP address. You should get access the root (/) web page with some text displayed.

ESP8266 Async ElegantOTA Demo Example Web Server Root URL

Now, imagine that you want to modify your web server code. To do that via OTA, go to the ESP IP address followed by /update. The following web page should load.

ESP8266 Async ElegantOTA Update Page

Follow the next sections to learn how to upload new firmware using the AsyncElegantOTA.

Upload New Firmware OTA (Over-the-Air) Updates – ESP8266

Every file that you upload via OTA should be in .bin format. You can generate a .bin file from your sketch using the Arduino IDE.

With your sketch opened, you need to go to Sketch > Export Compiled Binary. A .bin file will be generated from your sketch. The generated file will be saved under your project folder.

That’s that .bin file you should upload using the AsyncElegantOTA web page if you want to upload new firmware.

Upload a New Web Server Sketch – Example

Let’s see a practical example. Imagine that after uploading the previous sketch, you want to upload a new one that allows you to control an LED via a web interface like this project. Here’s the steps you need to follow:

1. Copy the following code to your Arduino IDE. Don’t forget to insert your network credentials.

/*
  Rui Santos
  Complete project details
   - Arduino IDE: https://RandomNerdTutorials.com/esp8266-nodemcu-ota-over-the-air-arduino/
   - VS Code: https://RandomNerdTutorials.com/esp8266-nodemcu-ota-over-the-air-vs-code/
     
  Permission is hereby granted, free of charge, to any person obtaining a copy
  of this software and associated documentation files.
  
  The above copyright notice and this permission notice shall be included in all
  copies or substantial portions of the Software.
*/

// Import required libraries
#include <Arduino.h>
#include <ESP8266WiFi.h>
#include <ESPAsyncTCP.h>
#include <ESPAsyncWebServer.h>
#include <AsyncElegantOTA.h>

// Replace with your network credentials
const char* ssid = "REPLACE_WITH_YOUR_SSID";
const char* password = "REPLACE_WITH_YOUR_PASSWORD";

bool ledState = 0;
const int ledPin = 2;

// Create AsyncWebServer object on port 80
AsyncWebServer server(80);
AsyncWebSocket ws("/ws");

const char index_html[] PROGMEM = R"rawliteral(
<!DOCTYPE HTML><html>
<head>
  <title>ESP Web Server</title>
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="icon" href="data:,">
  <style>
  html {
    font-family: Arial, Helvetica, sans-serif;
    text-align: center;
  }
  h1 {
    font-size: 1.8rem;
    color: white;
  }
  h2{
    font-size: 1.5rem;
    font-weight: bold;
    color: #143642;
  }
  .topnav {
    overflow: hidden;
    background-color: #143642;
  }
  body {
    margin: 0;
  }
  .content {
    padding: 30px;
    max-width: 600px;
    margin: 0 auto;
  }
  .card {
    background-color: #F8F7F9;;
    box-shadow: 2px 2px 12px 1px rgba(140,140,140,.5);
    padding-top:10px;
    padding-bottom:20px;
  }
  .button {
    padding: 15px 50px;
    font-size: 24px;
    text-align: center;
    outline: none;
    color: #fff;
    background-color: #0f8b8d;
    border: none;
    border-radius: 5px;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    -webkit-tap-highlight-color: rgba(0,0,0,0);
   }
   /*.button:hover {background-color: #0f8b8d}*/
   .button:active {
     background-color: #0f8b8d;
     box-shadow: 2 2px #CDCDCD;
     transform: translateY(2px);
   }
   .state {
     font-size: 1.5rem;
     color:#8c8c8c;
     font-weight: bold;
   }
  </style>
<title>ESP Web Server</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="icon" href="data:,">
</head>
<body>
  <div class="topnav">
    <h1>ESP WebSocket Server</h1>
  </div>
  <div class="content">
    <div class="card">
      <h2>Output - GPIO 2</h2>
      <p class="state">state: <span id="state">%STATE%</span></p>
      <p><button id="button" class="button">Toggle</button></p>
    </div>
  </div>
<script>
  var gateway = `ws://${window.location.hostname}/ws`;
  var websocket;
  window.addEventListener('load', onLoad);
  function initWebSocket() {
    console.log('Trying to open a WebSocket connection...');
    websocket = new WebSocket(gateway);
    websocket.onopen    = onOpen;
    websocket.onclose   = onClose;
    websocket.onmessage = onMessage; // <-- add this line
  }
  function onOpen(event) {
    console.log('Connection opened');
  }
  function onClose(event) {
    console.log('Connection closed');
    setTimeout(initWebSocket, 2000);
  }
  function onMessage(event) {
    var state;
    if (event.data == "1"){
      state = "ON";
    }
    else{
      state = "OFF";
    }
    document.getElementById('state').innerHTML = state;
  }
  function onLoad(event) {
    initWebSocket();
    initButton();
  }
  function initButton() {
    document.getElementById('button').addEventListener('click', toggle);
  }
  function toggle(){
    websocket.send('toggle');
  }
</script>
</body>
</html>)rawliteral";

void notifyClients() {
  ws.textAll(String(ledState));
}

void handleWebSocketMessage(void *arg, uint8_t *data, size_t len) {
  AwsFrameInfo *info = (AwsFrameInfo*)arg;
  if (info->final && info->index == 0 && info->len == len && info->opcode == WS_TEXT) {
    data[len] = 0;
    if (strcmp((char*)data, "toggle") == 0) {
      ledState = !ledState;
      notifyClients();
    }
  }
}

void onEvent(AsyncWebSocket *server, AsyncWebSocketClient *client, AwsEventType type,
             void *arg, uint8_t *data, size_t len) {
  switch (type) {
    case WS_EVT_CONNECT:
      Serial.printf("WebSocket client #%u connected from %s\n", client->id(), client->remoteIP().toString().c_str());
      break;
    case WS_EVT_DISCONNECT:
      Serial.printf("WebSocket client #%u disconnected\n", client->id());
      break;
    case WS_EVT_DATA:
      handleWebSocketMessage(arg, data, len);
      break;
    case WS_EVT_PONG:
    case WS_EVT_ERROR:
      break;
  }
}

void initWebSocket() {
  ws.onEvent(onEvent);
  server.addHandler(&ws);
}

String processor(const String& var){
  Serial.println(var);
  if(var == "STATE"){
    if (ledState){
      return "ON";
    }
    else{
      return "OFF";
    }
  }
  return String();
}

void setup(){
  // Serial port for debugging purposes
  Serial.begin(115200);

  pinMode(ledPin, OUTPUT);
  digitalWrite(ledPin, LOW);
  
  // Connect to Wi-Fi
  WiFi.begin(ssid, password);
  while (WiFi.status() != WL_CONNECTED) {
    delay(1000);
    Serial.println("Connecting to WiFi..");
  }

  // Print ESP Local IP Address
  Serial.println(WiFi.localIP());

  initWebSocket();

  // Route for root / web page
  server.on("/", HTTP_GET, [](AsyncWebServerRequest *request){
    request->send_P(200, "text/html", index_html, processor);
  });

  // Start ElegantOTA
  AsyncElegantOTA.begin(&server);
  // Start server
  server.begin();
}

void loop() {
  ws.cleanupClients();
  digitalWrite(ledPin, ledState);
}

View raw code

This is the same code used in this project, but it contains the needed lines of code to handle ElegantOTA:

#include <AsyncElegantOTA.h>
AsyncElegantOTA.begin(&server);

2. Save your sketch: File > Save and give it a name. For example: Web_Server_LED_OTA_ESP8266.

3. Generate a .bin file from your sketch. Go to Sketch > Export Compiled Binary. A new .bin file should be created under the project folder.

ESP8266 Bin File generated for OTA Updates Arduino IDE

4. Now you just need to upload that file using the ElegantOTA page. Go to your ESP IP address followed by /update. Make sure you have the firmware option selected. Click on Choose File and select the .bin file you’ve just generated.

ESP8266 Update New Firmware Elegant OTA

5. When it’s finished, click on the Back button.

ESP8266 NodeMCU Upload New Firmware Elegant OTA success

6. Then, you can go to the root (/) URL to access the new web server. This is the page that you should see when you access the ESP IP address on the root (/) URL.

ESP8266 NodeMCU Websocket Server Control Outputs

You can click on the button to turn the ESP8266 on-board LED on and off.

ESP8266 NodeMCU board Built in LED turned on HIGH

Because we’ve also added OTA capabilities to this new web server, we can upload a new sketch in the future if needed. You just need to go to the ESP8266 IP address followed by /update.

Congratulations, you’ve uploaded new code to your ESP8266 via Wi-Fi using ElegantOTA.

Continue reading if you want to learn how to upload files to the ESP8266 filesystem (LittleFS) using AsyncElegantOTA.

Upload Files to Filesystem OTA (Over-the-Air) Updates – ESP8266

In this section, you’ll learn to upload files to the ESP8266 filesystem (LittleFS) using AsyncElegantOTA.

ESP8266 LittleFS Filesystem Upload Plugin

Before proceeding, you need to have the ESP8266 LittleFS Uploader Plugin installed in your Arduino IDE. Follow the next tutorial before proceeding:

Web Server with Files from LittleFS

Imagine the scenario that you need to upload files to the ESP8266 filesystem, for example, configuration files, HTML, CSS, and JavaScript files to update the web server page or any other file that you may want to save in LittleFS via OTA.

To show you how to do this, we’ll create a new web server that serves files from the filesystem (LittleFS): HTML, CSS, and JavaScript files to build a web page that controls the ESP8266 GPIOs remotely.

Before proceeding make sure you have the Arduino_JSON library by Arduino version 0.1.0 installed. You can install this library in the Arduino IDE Library Manager. Just go to Sketch Include Library > Manage Libraries and search for the library name as follows: Arduino_JSON.

Copy the following code to your Arduino IDE.

/*
  Rui Santos
  Complete project details
   - Arduino IDE: https://RandomNerdTutorials.com/esp8266-nodemcu-ota-over-the-air-arduino/
   - VS Code: https://RandomNerdTutorials.com/esp8266-nodemcu-ota-over-the-air-vs-code/
     
  Permission is hereby granted, free of charge, to any person obtaining a copy
  of this software and associated documentation files.
  
  The above copyright notice and this permission notice shall be included in all
  copies or substantial portions of the Software.
*/

// Import required libraries
#include <Arduino.h>
#include <ESP8266WiFi.h>
#include <ESPAsyncTCP.h>
#include <ESPAsyncWebServer.h>
#include "LittleFS.h"
#include <Arduino_JSON.h>
#include <AsyncElegantOTA.h>

// Replace with your network credentials
const char* ssid = "REPLACE_WITH_YOUR_SSID";
const char* password = "REPLACE_WITH_YOUR_PASSWORD";

// Create AsyncWebServer object on port 80
AsyncWebServer server(80);

// Create a WebSocket object
AsyncWebSocket ws("/ws");

// Set number of outputs
#define NUM_OUTPUTS  4

// Assign each GPIO to an output
int outputGPIOs[NUM_OUTPUTS] = {2, 4, 12, 14};

// Initialize LittleFS
void initLittleFS() {
  if (!LittleFS.begin()) {
    Serial.println("An error has occurred while mounting LittleFS");
  }
  Serial.println("LittleFS mounted successfully");
}

// Initialize WiFi
void initWiFi() {
  WiFi.mode(WIFI_STA);
  WiFi.begin(ssid, password);
  Serial.print("Connecting to WiFi ..");
  while (WiFi.status() != WL_CONNECTED) {
    Serial.print('.');
    delay(1000);
  }
  Serial.println(WiFi.localIP());
}

String getOutputStates(){
  JSONVar myArray;
  for (int i =0; i<NUM_OUTPUTS; i++){
    myArray["gpios"][i]["output"] = String(outputGPIOs[i]);
    myArray["gpios"][i]["state"] = String(digitalRead(outputGPIOs[i]));
  }
  String jsonString = JSON.stringify(myArray);
  return jsonString;
}

void notifyClients(String state) {
  ws.textAll(state);
}

void handleWebSocketMessage(void *arg, uint8_t *data, size_t len) {
    AwsFrameInfo *info = (AwsFrameInfo*)arg;
  if (info->final && info->index == 0 && info->len == len && info->opcode == WS_TEXT) {
    data[len] = 0;
    if (strcmp((char*)data, "states") == 0) {
      notifyClients(getOutputStates());
    }
    else{
      int gpio = atoi((char*)data);
      digitalWrite(gpio, !digitalRead(gpio));
      notifyClients(getOutputStates());
    }
  }
}

void onEvent(AsyncWebSocket *server, AsyncWebSocketClient *client,AwsEventType type,
             void *arg, uint8_t *data, size_t len) {
  switch (type) {
    case WS_EVT_CONNECT:
      Serial.printf("WebSocket client #%u connected from %s\n", client->id(), client->remoteIP().toString().c_str());
      break;
    case WS_EVT_DISCONNECT:
      Serial.printf("WebSocket client #%u disconnected\n", client->id());
      break;
    case WS_EVT_DATA:
      handleWebSocketMessage(arg, data, len);
      break;
    case WS_EVT_PONG:
    case WS_EVT_ERROR:
      break;
  }
}

void initWebSocket() {
  ws.onEvent(onEvent);
  server.addHandler(&ws);
}

void setup(){
  // Serial port for debugging purposes
  Serial.begin(115200);

  // Set GPIOs as outputs
  for (int i =0; i<NUM_OUTPUTS; i++){
    pinMode(outputGPIOs[i], OUTPUT);
  }
  initLittleFS();
  initWiFi();
  initWebSocket();

  // Route for root / web page
  server.on("/", HTTP_GET, [](AsyncWebServerRequest *request){
    request->send(LittleFS, "/index.html", "text/html",false);
  });

  server.serveStatic("/", LittleFS, "/");

  // Start ElegantOTA
  AsyncElegantOTA.begin(&server);
  
  // Start server
  server.begin();
}

void loop() {
  ws.cleanupClients();
}

View raw code

Insert your network credentials in the following variables and save the code.

const char* ssid = "REPLACE_WITH_YOUR_SSID";
const char* password = "REPLACE_WITH_YOUR_PASSWORD";

Update Firmware

Create a .bin file from this sketch as shown previously (this sketch includes the needed lines of code to provide OTA capabilities).

Go to the ESP8266 IP address followed by /update and upload the new firmware.

Next, we’ll see how to upload the files.

Update Filesystem

Under the project folder create a folder called data and paste the following HTML, CSS and JavaScript files (click on the links to download the files):

To find your project folder, you can go to Sketch > Show Sketch Folder.

This is where your data folder should be located and how it looks:

Data Folder Structure ESP8266 Async ElegantOTA Example

After this, with the ESP8266 disconnected from your computer (that’s the whole purpose of OTA), click on ESP8266 LittleFS Data Upload.

ESP8266 LittleFS Data Upload Arduino IDE

You’ll get an error because there isn’t any ESP8266 board connected to your computer – don’t worry.

Scroll up on the debugging window until you find the .mklittlefs.bin file location. That’s that file that you should upload (in our case the file is called Web_Server_OTA_ESP8266_Example_2.mklittlefs.bin.

Get LittleFS Bin File Path ESP8266

And this is the path where our file is located:

C:\Users\sarin\AppData\Local\Temp\arduino_build_375940\Web_server_OTA_ESP8266_Example_2.mklittlefs.bin

To access that file on my computer, I need to make hidden files visible (the AppData folder was not visible). Check if that’s also your case.

Arduino IDE ESP32 ESP8266 NodeMCU Board Add-on fix install

Once you reach the folder path, you want to get the file with .mklittlefs.bin extension.

LittleFS Bin File ESP8266

To make things easier you can copy that file to your project folder.

Now that we have a .bin file from the data folder, we can upload that file. Go to your ESP8266 IP address followed by /update. Make sure you have the Filesystem option selected.

Upload Files Filesystem ElegantOTA ESP8266

Then, select the file with the .mklittlefs.bin extension.

After successfully uploading, click the Back button. And go to the root (/) URL again. You should get access to the following web page that controls the ESP8266 outputs using Web Socket protocol.

Control Multiple ESP32 ESP8266 Outputs Websocket Web Server

To see the web server working, you can connect 4 LEDs to your ESP8266 on GPIOS: 2, 4, 12 and 14. You should be able to control those outputs from the web server.

If you need to update something on your project, you just need to go to your ESP8266 IP address followed by /update.

Congratulations! You’ve successfully uploaded files to the ESP8266 filesystem using ElegantOTA.

Wrapping Up

In this tutorial, you’ve learned how to add OTA capabilities to your Async Web Servers using the AsyncElegantOTA library. This library is simple to use and allows you to upload new firmware or files to the filesystem effortlessly using a web page. In our opinion, the AsyncElegantOTA library is one of the best options to handle OTA web updates.

We hope you’ve found this tutorial useful.

Learn more about the ESP8266 with our resources:

Thanks for reading.



Learn how to build a home automation system and we’ll cover the following main subjects: Node-RED, Node-RED Dashboard, Raspberry Pi, ESP32, ESP8266, MQTT, and InfluxDB database DOWNLOAD »
Learn how to build a home automation system and we’ll cover the following main subjects: Node-RED, Node-RED Dashboard, Raspberry Pi, ESP32, ESP8266, MQTT, and InfluxDB database DOWNLOAD »

Recommended Resources

Build a Home Automation System from Scratch » With Raspberry Pi, ESP8266, Arduino, and Node-RED.

Home Automation using ESP8266 eBook and video course » Build IoT and home automation projects.

Arduino Step-by-Step Projects » Build 25 Arduino projects with our course, even with no prior experience!

What to Read Next…


Enjoyed this project? Stay updated by subscribing our newsletter!

84 thoughts on “ESP8266 NodeMCU OTA (Over-the-Air) Updates – AsyncElegantOTA using Arduino IDE”

  1. Hi Sara and Rui,
    well done this tutorial.
    The democode runs with a direct copy & paste
    But somehow I seem to be the one to discover adapting-problems:

    I avoid the command delay() even in the smallest democodes and use a non-blocking-delay based on millis().
    So I adapted your demo-code to this and got a continious reset each time the ESP8266 just connected to my router.

    The while-loop looks like this:
    while (WiFi.status() != WL_CONNECTED) {
    BlinkHeartBeatLED(OnBoard_LED,100);

    if ( TimePeriodIsOver(MyTestTimer,1000) ) {
    Serial.print(".");
    if (myCount++ > 15) {
    Serial.println();
    myCount = 0;
    }
    }

    }

    This while-loop runs through at maximum speed because the functions
    BlinkHeartBeatLED(OnBoard_LED,100); and if ( TimePeriodIsOver(MyTestTimer,1000) )

    are non-blocking
    My first suspicion was right:
    The hile-loop runs too fast for the system
    So I inserted a
    yield();
    inside the while-loop
    to enable processor-time for all the backround-things and now it works

    best regards Stefan

    Reply
  2. And I think I found another small rather cosmetic thing:

    On an nodeMCU-ESP8266-module the onboard-LED is connected to +Vcc.
    Which means the LED has inverted logic. The LED lights up if the IO-port is LOW
    This means inside the script-code
    function onMessage(event) {
    var state;
    if (event.data == “1”){
    state = “ON”;
    }
    else{
    state = “OFF”;
    }

    must be inverted to
    if (event.data == “0”){

    best regards Stefan

    Reply
  3. Hi Sara and Rui,
    I like this tutorial very much because it’s a nice feature to ad to IoT devices/nodes. With two small sketches on a ESP-01 it works perfect, but if I first do a normal flash of a user interface (including FS data) WITH ElegantOTA included and then try an OTA with one of the first small sketches I got during that OTA the error: [HTTP ERROR] Bad Request. Any idea what the problem could be? I can send you al resources if you want.
    Thanks and regards…

    Reply
    • Hi.

      Thanks for following our work.
      Did you have any problems with our examples? Or only with your examples?

      Some people also face the same issue, as you can see here: https://github.com/ayushsharma82/AsyncElegantOTA/issues.
      But, nobody gave a solution to that problem yet.
      All examples that I tried worked just fine, but I haven’t tried them with the ESP-01.

      Do you think it could be related to the library or to your code?

      Regards,
      Sara

      Reply
  4. Hello Sara,
    The two small sketches (ESP8266-esp01_STA_OTA1.ino end ESP8266-esp01_STA_OTA2.ino) for my first tests are the same as your small basic example test file. I only changes the response text in the HTML part to show its the old or new new update. That combination works perfect. In my new sketch I use not only firmware but also data (index.html and style.css). That sketch (with ElegantOTA) worked (standalone) perfect after programming via USB. Also the 192.178.168.34/update works fine, zo ElegantOTA is coming up. After I select a firmware update, select the .bin file the update stocks with the error. I readed the issue. ESP-01 can’t be the problem I think. Maybe it’s the old FS.h I use? I will try… Can I drop a .zip file with the resources somewhere? Send me an address by email.
    Thanks and regards…

    Reply
    • Hello Sara,
      Your example without LittleFS.h works perfect. I have not installed LittleFS.h because I don’t know what it does with my other applications. Because the update comes with a HTTP ERROR I think it has to do with the index.html in the data. I had also problems with the % sign in HTML and the processor function. Can you give me some direction?
      Thanks and regards…

      Reply
      • #include <FS.h>
        #include <ESP8266WiFi.h>
        #include <ESPAsyncTCP.h>
        #include <ESPAsyncWebServer.h>
        #include <AsyncElegantOTA.h>

        // Set number of sliders
        #define NMB_SLIDERS 5

        const char* ssid = “ALF4all”;
        const char* password = “02851346004201626459”;

        // Create AsyncWebServer object on port 80
        AsyncWebServer server(80);

        const char* INPUT_NAME = “slider”; // GET name
        const char* INPUT_VALUE = “value”; // GET value

        String sliderValue[NMB_SLIDERS] = {“-50″,”-25″,”0″,”+25″,”+50″};

        String processor(const String& var){
        if (var == “SLIDERVALUE_0”){
        return sliderValue[0];
        }
        else if (var == “SLIDERVALUE_1”){
        return sliderValue[1];
        }
        else if (var == “SLIDERVALUE_2”){
        return sliderValue[2];
        }
        else if (var == “SLIDERVALUE_3”){
        return sliderValue[3];
        }
        else if (var == “SLIDERVALUE_4”){
        return sliderValue[4];
        }

        return String();
        }

        void setup(){
        Serial.begin(115200);

        // Connect to Wi-Fi
        //——————
        WiFi.begin(ssid, password);
        while (WiFi.status() != WL_CONNECTED) {
        delay(1000);
        Serial.println(“Connecting to WiFi..”);
        };
        Serial.println(WiFi.localIP());

        // Init file system
        //——————
        if (!SPIFFS.begin()) {
        Serial.println(“An Error has occurred while mounting SPIFFS”);
        return;
        }

        // Route for root / web page
        //—————————
        server.on(“/”, HTTP_GET, [](AsyncWebServerRequest *request){
        request->send(SPIFFS, “/index.html”, String(), false, processor);
        });

        // Route to load style.css file
        //—————————
        server.on(“/style.css”, HTTP_GET, [](AsyncWebServerRequest *request){
        request->send(SPIFFS, “/style.css”, “text/css”);
        });

        // Send a GET request to /slider?value=
        //————————————————————
        server.on(“/control”, HTTP_GET, [] (AsyncWebServerRequest *request) {
        String inputName;
        String inputValue;

        // GET input slider and value on /control?slider= value=
        if (request->hasParam(INPUT_NAME) & request->hasParam(INPUT_VALUE)) {
        inputName = request->getParam(INPUT_NAME)->value();
        inputValue = request->getParam(INPUT_VALUE)->value();
        // update sliderValue
        sliderValue[inputName.toInt()] = inputValue;
        Serial.println(inputName + “,” + inputValue);
        } else {
        inputName = “none”;
        inputValue = “none”;
        }

        request->send(200, “text/plain”, “OK”);
        });

        // Start servers
        //—————
        AsyncElegantOTA.begin(&server); // Start ElegantOTA
        server.begin();
        };

        void loop() {
        AsyncElegantOTA.loop();
        };

        Reply
  5. I have found that OTA does not work when my ESP8266 is connect through a wireless extender and not directly to the wireless router.
    Has anyone else experienced this and if so, were you able to make it work through a wireless extender?

    Reply
    • If your ESP8266 can connect to the WiFi at all it should work.
      except for very weak signal which result in a low bandwith.

      Maybe: If the OTA-process uses a special portnumber and this portnumber is blocked it would not work. But I don’t know if this is the case at all
      Do you get a “WiFi connected” message at all?

      What I have tested is a ESP32 inside a WiFi-network with an AVM-Fritz!Box-router 7490 and a AVM-Fritz!-Repeater 310 which build a MESH.

      A mesh is a specialty developed by AVM on top of the usual WiFi-network which enables to seamless connect to that repeater/router with the strongest signal and using the same SSID.

      Anyway I had problems at the start too. So I added a serial.print-message to print the RSSI in the serial monitor. with RSSI below -70 db I could connect to the ESP32 but the OTA failed. For OTA the signal-strength had to be above -60 dB to make it work.

      After re-positioning the repeater to get a signal around – 55 dB the OTA works.

      best regards Stefan

      Reply
  6. After an update, the update page it does not work anymore, 192.168.1.x/update show just a small ”OK” in top left corner.

    Reply
  7. First, thanks for this and all of your other great tutorials. I subscribed to your book on home automation, but find these standalone tutorials are sometimes easier to follow.

    I have a follow up to one of the comments above, and the appropriate (javascript) update workflow.

    As Stefan mentioned, the onboard led uses ‘inverted’ logic, so I added code to the javascript to invert the update of the UI to match:

    // invert logic for gpio2 (onboard led, according to comments to article)
    if (output == "2") {
    state = (state === "1") ? "0" : "1";
    }

    I had an error on the first try, and then discovered that I need to execute the LittleFS Data Upload Tool (from the dropdown), and that generates a new sketch_mar19a.mklittlefs.bin which I then need to copy over to my sketch directory and upload it (knowing it is in my /var/folders/m1/…/arduino_build_649793 directory).

    Is this the right workflow to update the web javascript (or any of the other web files)?

    Is there a simpler, more direct way to do this?

    Thanks in advance,
    John

    Reply
    • Hi John.
      That’s the right workflow.
      However, you don’t need to copy the file to the sketch directory, but it is easier to find it when you want to select it to upload.
      If you want, you can simply navigate to the right directory at the time of selecting the file in the OTA upload page.
      Regards,
      Sara

      Reply
    • Hi Dragos,

      do all the users here have glas-spheres to look into in what you have done in DETAIL? No.

      How should others users know if you are a very smart and careful programmer or a “hurry-up-guy?”
      From your short post the estimation goes more into direction of you seem to be a “hurry-up-guy”

      Did you do these steps?
      To add OTA capabilities to your projects using the AsyncElegantOTA library, follow these steps:

      Install AsyncElegantOTA, ESPAsyncTCP and ESPAsyncWebServer libraries;
      Include AsyncElegantOTA library at the top of the Arduino sketch: #include <AsyncElegantOTA.h>;
      Add this line AsyncElegantOTA.begin(&server); before server.begin();
      Open your browser and go to http:///update, where is your ESP8266 IP address.

      You did not tell us

      Did you successfully run the demo-code?
      You did not tell us

      I’m no expert about html-coding. It might be that the scripts of the relay-code interfere with the example-3-scripts

      Did you try the opposite: Taking the working OTA-example after having tested it on YOUR hardware and added the relay-code to the OTA-example?

      all in all: @Rui & Sara: The tutorials you are creating are very good.
      This comment-function is really BAD for helping each other with code-problems
      because code can’t be posted as code-sections. I’m near to recommend to any user if you have a code-problem just leave a link to the main Arduino-forum here to discuss the code-problem at the arduinoforum.
      How about ADDING a code-discussion-forum to your website?
      This should’ nt be too hard.

      best regards Stefan

      Reply
  8. Hi Stefan, thank you for replay.
    I install the library, that is not a problem. I tested OTA example and it works fine. I added OTA lines to one of my existing project and works fine. I try to add OTA lines in another of my project, which is a sum of two project (relay control and 18b20 sensor web server) and after first update further update was no longer possible. I do not know what is wrong. I try then to test separated18b20 monitor project and relay control project. I discover that modified with OTA lines 18b20 code works fine but modified with OTA line relay control does not.

    Reply
  9. that ”OK” I get instead of update page, is from relay code from line:
    request->send(200, “text/plain”, “OK”);
    But I dont know why.

    Reply
  10. it seems that the problem is from the function that starts with:
    server.on (“/update”, HTTP_GET, [] (AsyncWebServerRequest * request {…..
    and ends with:
    request-> send (200, “text / plain”, “OK I am still here”);});
    somehow that “/update” coincides with the path to the update page

    I tried to replace “/ update” with “/relay” but although the update page works, the relays don’t work anymore

    Reply
  11. I change ”update” from relay code with ”relay”:
    I had to make 3 changes in lines:
    1.server.on(“/relay”, HTTP_GET, [] (AsyncWebServerRequest *request) {……..
    2.if(element.checked){ xhr.open(“GET”, “/relay?relay=”+element.id+”&state=1”, true); }
    3.else { xhr.open(“GET”, “/relay?relay=”+element.id+”&state=0”, true); }
    Now it works.

    Reply
  12. Compilation crashes at this point:
    #include <Arduino_JSON.h>
    Where can I get it? (Yes, I have tried to google it, but it finds just “arduinojson”.

    Reply
    • Hi Pavel.
      In the Arduino library manager search for “Arduino_Json” and install the Arduino_JSON library by Arduino version 0.1.0.
      Regards,
      Sara

      Reply
  13. Has anybody tried to use WiFiMulti and/or static IP? I was quite unsuccesfull. Without it, it’s unusable. Maybe for some tries.

    Reply
  14. Thank you for this tutorial. I have a mega2560+esp8266 and it really saves my time. I just have to put the server on the esp side, then I work on the mega and if I need to change some code on the esp, I update it via this server.

    Reply
    • Hello, i noticed a warning about that when compiling for ESP8266 with Visual Micro in Visual Studio. I then looked at the github page and saw the same as you did.

      However I did not get the warning when using a ESP32 with Visual Micro in Visual Studio. neither when compiling in the Arduino IDE for both ESP models.

      Thanks,
      Eric

      Reply
  15. Thanks for this tutorial. How do I combine AsyncElegantOTA & Wifimanager for ESP8266?
    I tried to include both libraries in my code and got compile error.
    It seemed both libraries included the same ESP8266WIFI libraries.

    Anyway to let these two work together?

    Thanks!

    Reply
  16. Followed this well and I am able to upload the firmware but cannot upload the filesystems…I am getting an error on this
    LittleFS Upload failed!
    [LittleFS] data : C:\Users\Mutwiri\OneDrive\Arduino\Using Node MCU Wifi module\Temp_in_googlesheet_and_send_email ds18b20 chip OTA\Temp_in_googlesheet_and_send_email\data
    [LittleFS] size : 1000
    [LittleFS] page : 256
    [LittleFS] block : 8192
    /Base64.cpp
    /Base64.h
    /Gsender.cpp
    /NodeMcu_ESP8266_Gmail_Sender_by_FMT.h
    unable to open ‘/NodeMcu_ESP8266_Gmail_Sender_by_FMT.h.
    error adding file!

    Reply
  17. I’ve tried adding the OTA ability to an existing project, using these instructions.

    After doing an update

    Firmware, Choose File

    I get a 100% box (pretty much instantly) but never get an “OTA Success” message or a “Back” button. The screen stays there showing 100%.

    The ESP8266 DOES reset though. I know this because I have the ESP8266 email me “I’ve just reset” upon startup, and I get the messages. But the code has not updated; the old code is still running.

    Not sure where to go looking, as the OTA update library is pretty much a magic black box to me.

    Reply
    • Check it, have You got active iwIP Variant in Arduino: v2 High Bandwidth? Elegant OTA has a problem with that setting. Change to “v2 Lower Memory”

      Reply
  18. Following up on a previous post of mine, I decided to test all the various ESP8266 boards I had at home here, uploading the “toggle LED” code shown above. To test that there was a difference, I added a version number to the web page heading “ESP WebSocket Server V1, V2, V3 etc.” I made sure I had the newest version of the IDE and newest version of the various libraries.

    I picked, from the board manager, the correct ESP8266 board type.

    I did the initial load serially (of course) and left the serial line connected, to monitor the goings-on.

    I also found that my AV caused issues, so I uninstalled it completely.

    Here’s the results:

    Every board ran the stock code successfully after a serial upload, connecting to my home WiFi, displaying a web page and toggling the LED on command (with adjustments for the LED connected high or low on the the target boards, as noted by John Lynch above).

    All the NodeMCU (clones and originals) and Lolin D1 Mini Pro v3 (originals only) updated successfully, and rebooted. However, none of the uploads to any board ever showed a “Success” message, nor a “Back” button.

    The Lolin D1 Mini Pros (v2) did not update; they rebooted, but continued to run the original serial upload code. Similar to the above, there was never a “Success” message.

    The Lolin D1 Minis and clones of the same could not be updated. An attempt to access the “/update” page resulted in an HTTP 500 error, as if the code to service the page never actually got to the chip.

    So, it would appear as if there is something board dependent in the library, although I am nowhere near enough a coder to figure out what. But at least I know which boards I can use in future projects where a remote update might be required, and which ones I can’t.

    Reply
  19. Superb tutorial and code samples that can easily be modified.
    I built a radiation detector using an ESP8266-12F module and wanted a web server that I could manage from a distance. You delivered my solution.
    Thank you so much for saving me hours/days and a lot of hair.

    Reply
  20. Good morning Sara and Rui, as always, very good your tutorial. Everything worked Ok, but I have a need to manage 6 relays. I added a few lines in skecth and also in html. In Javascript I didn’t change anything. On the page appeared the new buttons but do not trigger the relays. Is there any further change missing?

    Sketch
    // Set number of outputs
    #define NUM_OUTPUTS 6

    // Assign each GPIO to an output
    int outputGPIOs[NUM_OUTPUTS] = {0, 5, 2, 4, 12, 14};

    html

    GPIO 0

    State:

    <div class="card">
    <p class="card-title"><i class="fas fa-lightbulb"></i> GPIO 5</p>
    <label class="switch">
    <input type="checkbox" onchange="toggleCheckbox(this)" id="5">
    <span class="slider"></span>
    </label>
    <p class ="state">State: <span id="5s"></span></p>
    </div>

    Reply
  21. Hi Sarah and Rui. I used the 100$ home project course. Very nice. Surprising what you can still learn at the age of 68. I made a front doorbell that sends an email and whatsapp. I also have a ceiling IR heating with a separate thermometer. Both with an ESP01. But uploading enhanced code to the IR panel is a chore. That’s why I’d really like to use OTA. Is it possible to combine this OTA with my MQTT Smarthome (Node-red and Mosquitto) ? Is there an example? Thank you for your time.

    Reply
  22. Hi there,

    i like to try the OTA-Function for our project. This workshop seems to be realy easy and i hopr the OTA does ist too. Before we start diving in we installed the OTA Lib. At this point we found that including the AsycElegantOTA will adapt the following:

    #include <AsyncElegantOTA.h>
    #include <elegantWebpage.h>
    #include <Hash.h>

    In this workshop you talked about only including the AsyncElegantOTA.h. Ehats about the other both lib’s??? Did we realy need this too? We ask to save RAM in ESP-Chip and upload only libs are really needed.

    Thanks and stay healthy,
    Manfred

    Reply
  23. Congratulations again for the excellent tutorial. In my internal network everything works OK but when trying to access from outside my network the status and the leds do not change. Can anyone help with this.
    I created a dmz on my router and I’m using no-ip.

    Reply
  24. testing both, ESP8266 and ESP32 it works well however the ESP8266 does not do a reboot after the upload and manual restart is required. The ESP32 does reliably. What might be the difference or the reason?

    Reply
      • I have the same problem with no restart on Wemos D1 Mini esp8266. It restarts on the wemos esp32 D1 mini with no problem. Is there a fix?

        Reply
  25. Hi there,

    toady i worked for the first time with the OTA-Function. All seems to work fine and i can choose binary to update. If i select the bin-file the update starts and the progress-bar fills up. The problem ist that the percentage-label shows 0% while the progress-bar fills up to end.

    When the progress bar ist filled it seems the update is OK but there is no feedback or message. Is this a known problem from the UI of the update-page or something else?

    Hopr to get a feednback to this problem.

    Best regards and greetings,
    Manfred

    Reply
  26. is it possible to have the firmware update work through a soft access point. I have situations where the device cannot be connected to the local network. I would also like to be able to access the the mcu via a webpage to change settings on it through a web interface. this would require a soft access point with the ability to upload the bin file to the esp8266 as well throught the update page.

    Reply
  27. Hi Rui & Sarah –

    I have finally got round to looking at implementing this on one of my projects! The problem is, the project already runs a web server using:
    #include <ESP8266WiFi.h>
    #include <ESP8266WebServer.h>
    If I now need to use:
    #include <ESPAsyncTCP.h>
    #include <ESPAsyncWebServer.h>
    #include <AsyncElegantOTA.h>
    what (if anything) do I need to remove of my earlier includes? As they both seem to use
    server.on(…
    I am assuming that something is going to clash here!

    Reply
  28. HELLO RUI & SARA
    I have gone throu given examlpe for flashing OTA esp 8266 .
    I get the ElegantOTA page on my brawser when i try to load the esp8266 OTA with the .bin file ,the process starts and load 100% but the back sighn does not appear.
    what could be the problem(s)?
    i have added all the libraries as per your instruction.
    thanks in advance

    Reply
  29. Hi Sara,
    I have the same problem, 100% of the sketch is uploaded, i check but no back button appears.
    My board is Wemos D1 D2 & mini.
    Waiting suggestions, bye
    Renzo Giurini

    Reply
  30. Hi Sara & Rui,
    Thank you for your great content. However, I run into some issue:
    LittleFS Menu does not show in Arduino IDE 2.0.3 / Win 10 Pro 22H2
    Have installed the plugin according to the installation info:
    C:\Users\HR\Documents\Arduino\tools\ESP8266LittleFS\tool\esp8266littlefs.jar
    But the menu ESP8266 LittleFS Data Upload does not show up as indicated in the instruction screenshot.
    Used the latest version in this repository.
    Any help or solutions? Thank you.

    Reply
      • Hello Sara, thank you very much for your quick response. Unfortunately, not the answer I expected. I’ve hoped for a solution with the IDE 2xx.
        In any case I still learned a lot from you guys and I appreciate your extensive work very much!
        Greetings
        Heinz

        Reply
      • Hi Sara,

        I found a workaround for plugin problem with the Arduino IDE 2.0.3.
        I was able to create a bin file of the data directory and upload the created bin file to the ESP8266 with ElegantOTA and use the Arduino IDE 2.0.3.

        As a test I use your project https://randomnerdtutorials.com/esp8266-nodemcu-ota-over-the-air-arduino.

        I found the mklittlefs.exe on my system in the Arduino directory at
        C:\Users\HR\AppData\Local\Arduino15\packages\esp8266\tools\mklittlefs\3.1.0-gcc10.3-e5f9fec
        and used the following parameters in a terminal window:

        mklittlefs -c C:\Users\HR\Documents\Arduino\Projects\ESP8266-OTA-Web_Server_LED_V2\data C:\Users\HR\Documents\Arduino\Projects\ESP8266-OTA-Web_Server_LED_V2\fs_data.bin
        which worked great.

        To improve the method I copied mklittlefs.exe into a reachable path and
        tried this again in the project directory which included the data directory,
        which I wanted to upload to the ESP8266 server with littlefs:
        mklittlefs -c data fs_data_01.bin

        After that I used the IP-Adresse of ESP8266/update:
        http://192.168.189.107/update to upload the bin file by selecting Filesystem of the ElegantOTA page.

        Maybe you or Rui may have a better way or recommendation…?

        Reply
        • Thanks I found your code, for everyone else a little addition: to make the .bin file work with ESP8266 and ElegantOTA LittleFS update, you need to provide a few more parameters in the command prompt. It should look like this:

          mklittlefs -c data config.bin -p 256 -b 8192 -s 2072576

          where data is the name of the folder with your files, and config.bin is the output name. -p -b -s are needed with those exact values, otherwise the partition is not readable at least on my ESP8266. I have extracted the values from the Arduino 2.x IDE command (for further info on how to use LittleFS upload in Arduino 2.x, read this: https://github.com/earlephilhower/arduino-littlefs-upload)

          Reply
  31. “Wrapping Up
    In this tutorial, you’ve learned how to add OTA capabilities to your Async Web Servers using the AsyncElegantOTA library.”
    It is a pleasure to reach this paragraph successfully.
    The OTA is truly a powerful tool that is becoming indispensable. And when it is explained in this way by Sara and Rui, learning becomes a game. Thanks to both of you!

    Reply
  32. he realizado este tutorial con éxito, muchas gracias por estas explicaciones tan clara, el problema me ha salido al intentar incluir la librería WiFiManager en mi proyecto, la cual al parecer es incompatible con esta, ¿sabemos si hay alguna solución para poder utilizar estas 2 librerías conjuntamente?

    Reply
  33. being new with ESP8266, im using ESP-01s with Alexa (fauxmoESP) and working
    fauxmo uses port 80 – has to be port 80
    can OTA server use any port number, as long as allowed through router?

    Reply
  34. I am using your tutorial https://randomnerdtutorials.com/esp32-esp8266-sensor-bme280-influxdb/ to run several sensors. One of them is in place with difficult access to wire in case a config change is needed.
    I understand this #include <AsyncElegantOTA.h>;
    However I am struggling to understand where to place this line AsyncElegantOTA.begin(&server); before server.begin();
    in the code mentioned in the link above. If you could help me please would much appreciate

    Reply
  35. Just revisiting this excellent tutorial, with a few general remarks (but maybe someone already made those.
    I still work with an old version of the library (2.2.7), simply becoz it works for me. Tghere is now 2.2.8 that I think needs an extra line of code in the loop().
    Till now I have not been able to upload images to the FSLittle filesystem with AsyncElegantOTA, which is a pity. Not sure if the new library offers more possibilitues.
    The library uses the extension /update. This might interfere with some of your webservers with buttons presented in various of your tutiorials, as these also use the /update, so users need to watch out for that, but it is easily adaptable.
    Ofcourse it is not that hard to modify the library to use an /OTA extension rather than an /update extension, but changing the sketch is easier

    Reply
  36. GOOD day to all :
    I am using AsyncElegant OTA to remotely load one of my sketch yhat simply control some relays also with alexa. The wifi load works vey well and I get my new sketch working. The problem is that when I include the required line of code relevant to AsyncElegant OTA the IDE gives me an errore on the following line ” AsyncElegantOTA.begin(&server); ”

    ‘server’ was not declared in this scope; did you mean ‘Server’?

    How to overcome this problem please ?
    Thanks in advance
    Regards

    Reply
  37. Hello Sara and Rui
    Thanks you for your great work and super good tutorials. I implemented this webserver with OTA – it works right away and flawlessly at first . Then i upgraded a program on an esp8266 with 1mS timer interrupt ISR.This ruined the OTA ( it failed) I then implemented the Callback functions https://docs.elegantota.pro/callbacks/ where I disabled the interrupts during OTA process, and enabled the Timer interrupt again after OTA completion. Then OTA works reliably.
    Hope this can be help full to someone else.
    Thanks
    Erling Hviid

    Reply
  38. Hi, I’m sorry if I miss anything in the explanation but I want to know, can we use OTA in different network between the esp and the PC to upload through OTA?

    Reply
  39. Hello Sara & Rui, i want to test the OTA functionality on my ESP8266 and was looking for the AsyncElegantOTA library. This is now changed in name : ElegantOTA 3.1.6 (from the same autor).

    I think that some changes are required in the sketch like:
    line 15 #include <AsyncElegantOTA.h>
    line 43 AsyncElegantOTA.begin(&server);

    Is this correct ?
    And are the other Async library’s like ESPAsyncTCP.h and ESPAsyncWebServer.h and :
    line 20 AsyncWebServer server(80);
    line 39 server.on(“/”, HTTP_GET, [](AsyncWebServerRequest *request) {

    still needed ? Or are there other library’s needed ? I have an error : Compilation error: cannot convert ‘AsyncWebServer‘ to ‘ESP8266WebServer

    I understand that some things changes over time and it’s difficult to keep the code up-to date.

    Reply
  40. Ok Sara, i took a deeper look at https://docs.elegantota.pro/getting-started/async-mode
    I changed in my sketch all the names from AsyncElegantOTA to ElegantOTA .
    Than i had to Enable the Async Mode in the “ElegantOTA.h” file and setting it to 1 :
    #define ELEGANTOTA_USE_ASYNC_WEBSERVER 1

    Then all was working and because i use Arduino IDE 2.3.2 i did not use the fileupload.
    Now i have a toggle button while connected on an static wifi in reconnect mode on an esp8266 NodeMcu.
    Thanks for this nice sketch, that was my base code.

    Reply

Leave a Comment

Download Our Free eBooks and Resources

Get instant access to our FREE eBooks, Resources, and Exclusive Electronics Projects by entering your email address below.