Arduino & IoT Academy · Lección

Alojar una página web de actualización

Cargue firmware desde un formulario del navegador.

Alojar una página web de actualización es una lección gratuita de Arduino & IoT Academy en CoddyKit. Esta es la lección 3 de 4. Puedes leer la lección completa abajo gratuitamente — luego la practicas en el navegador con un editor de código integrado y un tutor de IA 24/7. Forma parte de la ruta de aprendizaje de Arduino & IoT Academy, y tu progreso se sincroniza en la web y la app de CoddyKit. El curso de Arduino & IoT Academy incluye 4 lecciones en total.

Partes de esta lección aún no han sido traducidas y se muestran en inglés.

Update From a Browser

Sometimes you want to flash a device without the Arduino IDE at all. A web update page lets anyone upload firmware from a browser.

The Board Becomes a Server

Your ESP32 runs a tiny web server that serves an upload form, so a phone or laptop can send it a new binary.

Bring In the Libraries

You combine a web server with the Update library, which knows how to write incoming bytes into flash memory.

#include <WebServer.h>
#include <Update.h>
WebServer server(80);

Serve an Upload Form

The root page returns a simple HTML form with a file picker and a submit button for the firmware file.

server.on("/", []() {
  server.send(200, "text/html",
    "<form method='POST' action='/update' enctype='multipart/form-data'><input type='file' name='fw'><input type='submit'></form>");
});

Where Did .bin Come From?

In the IDE, Sketch then Export Compiled Binary creates the .bin file you will pick in that upload form.

Open the Update Stream

When the upload starts, you tell the chip how big the image is so Update.begin() can reserve flash space for it.

Update.begin(UPDATE_SIZE_UNKNOWN);

Write the Incoming Chunks

Firmware arrives in pieces. You feed each chunk to Update.write() as it lands, building the new image in flash.

Update.write(upload.buf, upload.currentSize);

Finish and Verify

When the last byte arrives, Update.end(true) checks the image is complete and valid before marking it ready to boot.

if (Update.end(true)) Serial.println("Update OK");

Reboot Into New Code

A successful update needs a fresh start. Call ESP.restart() so the board boots into the firmware you just uploaded. 🔄

ESP.restart();

Guard the Page

Anyone who reaches this page can reflash your device, so add a login or token check before accepting any upload.

Keep the Server Alive

Just like OTA, the web server needs attention. Call server.handleClient() in loop so it can accept the upload request.

void loop() { server.handleClient(); }

Quick Check

Think about which library actually writes firmware to flash.

Recap

Run a web server that serves an upload form, feed the .bin to the Update library, verify it, then restart, all guarded behind a login. 🌐

Preguntas frecuentes

¿La lección «Alojar una página web de actualización» es gratis?

Sí — el texto completo de «Alojar una página web de actualización» es gratis para leer aquí en la web. Para practicarla de forma interactiva (editor de código integrado y tutor de IA 24/7) y desbloquear el resto del curso de Arduino & IoT Academy, actualiza a CoddyKit PRO. El curso de Arduino & IoT Academy incluye 4 lecciones en total.

¿Qué aprenderé en «Alojar una página web de actualización»?

Cargue firmware desde un formulario del navegador. Practicas Arduino & IoT Academy con código real que ejecutas directamente en el navegador, y un tutor de IA 24/7 responde tus preguntas mientras trabajas en la lección.

¿Necesito experiencia previa para empezar Arduino & IoT Academy?

No se requiere experiencia previa. Arduino & IoT Academy en CoddyKit está estructurado para principiantes hasta estudiantes avanzados, así que puedes empezar aquí o desde el inicio y avanzar a tu ritmo. Esta es la lección 3 de 4.

¿Cuánto tiempo toma la lección «Alojar una página web de actualización»?

La mayoría de las lecciones de CoddyKit toman alrededor de 5–10 minutos. Cada una es compacta e interactiva, así que avanzas constantemente y retomas exactamente por donde dejaste en la web y la app.

¿Puedo escribir y ejecutar código en esta lección de Arduino & IoT Academy?

Sí. Cada lección de Arduino & IoT Academy incluye un editor de código integrado, así que escribes y ejecutas código real directamente en tu navegador y obtienes retroalimentación instantánea de IA — sin configuración local necesaria.

Todas las lecciones de este curso

← Volver a Arduino & IoT Academy