ESP8266 server AP, wysłanie danych ze strony metodą fetch() przykładowy kod
/api metodą fetch(…{method:'POST'}…).server.arg("plain")) i zwraca odpowiedź JSON. ESP8266WebServer.h./* ===== ESP8266 ===== */
#include <ESP8266WiFi.h>
#include <ESP8266WebServer.h>
#include <ArduinoJson.h> // do parsowania (opcjonalnie)
const char* ssid = "ESP-AP";
const char* password = "12345678";
ESP8266WebServer server(80);
/* ——— Strona HTML w pamięci Flash ——— */
const char HTMLpage[] PROGMEM = R"rawlit(
<!DOCTYPE html><html lang="pl">
<head><meta charset="UTF-8"><title>fetch() → ESP8266</title></head>
<body>
<h2>Wpisz wiadomość i wyślij do ESP8266</h2>
<input id="msg" value="Hello ESP8266"><button onclick="send()">Wyślij</button>
<pre id="log"></pre>
<script>
async function send(){
const txt = document.getElementById('msg').value;
try{
const r = await fetch('/api', {
method:'POST',
headers:{'Content-Type':'application/json'},
body: JSON.stringify({msg:txt, t:Date.now()})
});
document.getElementById('log').textContent = await r.text();
}catch(e){console.error(e);}
}
</script></body></html>
)rawlit";
void handleRoot() { server.send_P(200,"text/html",HTMLpage); }
void handleAPI() {
if(!server.hasArg("plain")){ server.send(400,"text/plain","Brak danych"); return; }
String body=server.arg("plain");
Serial.println("RX: "+body);
// (opcjonalnie) parsowanie JSON
StaticJsonDocument<200> doc;
deserializeJson(doc, body);
const char* txt = doc["msg"] | "";
String resp = "{\"status\":\"OK\",\"echo\":\""+String(txt)+"\"}";
/* Nagłówki CORS – gdyby strona była poza ESP */
server.sendHeader("Access-Control-Allow-Origin","*");
server.send(200,"application/json",resp);
}
void setup() {
Serial.begin(115200);
WiFi.softAP(ssid,password);
Serial.print("AP IP: ");Serial.println(WiFi.softAPIP());
server.on("/",HTTP_GET,handleRoot);
server.on("/api",HTTP_POST,handleAPI);
server.begin();
}
void loop(){ server.handleClient(); }• Tryb AP: WiFi.softAP() tworzy własną sieć (domyślnie 192.168.4.1).
• Serwer HTTP: ESP8266WebServer obsługuje trasy / (HTML) i /api (JSON).
• fetch(): nowoczesny, natywny interfejs JS dla żądań asynchronicznych;
– nagłówek Content-Type: application/json informuje ESP8266, że treść to JSON;
– body: JSON.stringify(...) konwertuje obiekt JS do tekstu.
• Odbiór po stronie ESP: server.arg("plain") zawiera cały „payload” POST-a; dla złożonych struktur warto użyć ArduinoJson.
• Zarządzanie pamięcią: HTML trzymamy w PROGMEM (send_P), ponieważ ESP8266 ma ~40 kB RAM.
• CORS: gdy strona hostowana jest gdzie indziej niż ESP, dodajemy nagłówek Access-Control-Allow-Origin.
• Bezpieczeństwo: minimum 8-znakowe hasło WPA2, ewentualnie HTTPS (wymaga BearSSL i większego flasha).
ESPAsyncWebServer (asynchroniczny, wydajniejszy, WebSockety). WiFi.softAP(ssid,pass,channel). server.send() z Content-Encoding: gzip). esp8266.local). http://192.168.4.1/. Serial.setRxBufferSize() przy dużych payloadach. Content-Type: text/html; charset=utf-8. ArduinoOTA.h). Udostępniliśmy kompletny, działający przykład: ESP8266 w trybie AP serwuje stronę, która wysyła JSON metodą fetch() do endpointu /api. Po stronie mikrokontrolera dane są odbierane i opcjonalnie parsowane biblioteką ArduinoJson, a odpowiedź zwracana w formacie JSON. Pokazano też praktyczne uwagi dotyczące pamięci, bezpieczeństwa i rozszerzeń (AsyncWebServer, OTA, TLS). Dzięki temu szkieletowi można łatwo rozbudować aplikację o sterowanie GPIO, logowanie sensorów czy integrację z większym systemem IoT.