ESPAsyncWebServerで非同期

上記記事の非同期版である。内容は同じ。
ソースコードのポイント

#include

#include <esp32_pachokigu_inferencing.h>
#include "edge-impulse-sdk/dsp/image/image.hpp"
#include "esp_camera.h"
#include <WiFi.h>
#include <ESPAsyncWebServer.h>

ルートエンドポイントの設定

    server.on("/", HTTP_GET, [](AsyncWebServerRequest *request) {
        String html = R"rawliteral(
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>ESP32 Camera</title>
    <style>
        body { font-family: Arial, sans-serif; text-align: center; }
        img { width: 100%; max-width: 500px; }
    </style>
</head>
<body>
    <h1>ESP32 Camera Stream</h1>
    <img src="capture" id="camera-stream">
    <script>
        function reloadImage() {
            var img = document.getElementById('camera-stream');
            img.src = 'capture?' + new Date().getTime();
        }
        setInterval(reloadImage, 1000);  // 1秒ごとに画像を更新
    </script>
</body>
</html>
)rawliteral";
        request->send(200, "text/html", html);  // HTMLをクライアントに送信
    });

画像キャプチャエンドポイントの設定

    server.on("/capture", HTTP_GET, [](AsyncWebServerRequest *request) {
        fb = esp_camera_fb_get();  // フレームバッファの取得
        if (fb) {
            AsyncWebServerResponse *response = request->beginResponse_P(200, "image/jpeg", fb->buf, fb->len);
            response->addHeader("Cache-Control", "no-store, no-cache, must-revalidate, max-age=0");
            response->addHeader("Pragma", "no-cache");
            response->addHeader("Expires", "Thu, 01 Jan 1970 00:00:00 GMT");
            request->send(response);  // 画像データをクライアントに送信
            esp_camera_fb_return(fb);  // フレームバッファの解放
        } else {
            request->send(500, "text/plain", "Camera capture failed");  // エラーメッセージを送信
        }
    });