好吧，重复的 ajax 调用看起来肯定不对

setInterval(function(){
  controlPanel();
  counter1+=1;
  if (counter1==2){
    getLEDval();              //It was found that the 1st XML Request will be lost
    getLEDval();              //So a 2nd XML Request will be repeated.
  }
  if (counter1==4){
    counter1=0;
    getRSSI();
    getRSSI();
  }
},200);

基本上，您直接调用 getLEDval（） 或 getRSSI（） 两次，Ajax 本质上是异步的，因此您没有机会完成第一次调用，并且您已经在发送第二个请求。

此外，这些调用是按间隔发生的，这使得一切都更加异步，所有这些 Ajax 调用都可能被卡在一个大队列中，因为你每秒重复 5 次循环（您的浏览器可能可以很好地处理它，但 ESP 将难以处理超过 5-6 个并发请求。

** 编辑 **

好的，我已经稍微修改了你的 Javascript，它又快又脏，需要实施错误检查，否则它可能会在失败的 Ajax 调用上挂起

所有 Ajax 调用都将通过一个实用程序函数，该函数将查询、要执行的下一个函数以及调用它之前要等待的时间作为参数，以及将在调用此 Ajax 的函数中执行的回调以及响应值。

它应该确保事情按顺序发生，除了 toggleCheckbox（） 之外，您一次应该只有一个 Ajax 浮动并等待完成。

下面的代码从“LEDslider”开始，我已将 on 更改替换为可重用的函数调用

<input type="range" class="slider" id="LEDslider" min="0" max="255" value="0"
  onchange="controlPanel()">
</div>
<div class="LED_feedback_value">
  <h4>The feedback of LED intensity: <span id="LED_feedback_value">0</span></h4>
</div>
<div class="RSSI">
  <h4>The Received Signal Strength (RSSI): <span id="RSSI_feedback_value">N/A </span>dBm</h4><br>
</div>

<script>

var button_state_forward = false;

function toggleCheckbox(x) {
  ajax("/control?var=" + x + "&val=0")

}

function controlPanel(){
  ajax("/control?var=led_PWM&val=" + document.getElementById("LEDslider").value,getLEDval,400,function(){
    if(button_state_forward){
      toggleCheckbox('forward');
      button_state_forward=false; 
    }
    
  })
}

function getLEDval(){
  ajax("readLED",getRSSI, 400, function(response){
      document.getElementById("LED_feedback_value").innerHTML = this.responseText;

  })
}

function getRSSI(){
  ajax("readRSSI",controlPanel, 200, function(response){
    document.getElementById("RSSI_feedback_value").innerHTML = response;

  })
}

function ajax(query,nextCallFunction, nextCallDelay, responseCallback){
  
    let xhttpr = new XMLHttpRequest();
    xhttpr.onreadystatechange = function(){

      if (this.readyState == 4){
        if(this.status == 200){
            if(responseCallback){
                responseCallback(this.responseText);
            }
        }
        if(nextCallFunction){
            setTimeout(function(){
                nextCallFunction()
            },nextCallDelay)
        }
      }
    }
    xhttpr.open("GET", query, true);
    xhttpr.send();
}

window.onload = document.getElementById("photo").src = window.location.href.slice(0, -1) + ":81/stream";

controlPanel(); //kick start everything

</script>

正如我所说，这是快速而肮脏的，并且尚未经过测试，但像这样的方法至少应该可以防止您的浏览器过热。

你说你已经尝试过 ESPAsyncServ，这很好，但它有点野兽，我认为你的问题不在于以异步方式处理服务器请求，而在于浏览器端异步工作。

希望这会有所帮助

经过一些努力，它使我更简单地使用一个 http 服务器库来处理所有视频流，处理 http 请求和响应 ajax 请求。 最后采用了 ESPAsycnWebSvr 库。修改了此库的 GitHub 示例代码 （https://gist.github.com/me-no-dev)

现在，ESP32-CAM （AI Thinker） 提供 2 种方式与 Camera 串流通信。 AP 模式和客户端模式均已测试。

测试结果：网络性能

代码是为需要此函数的用户共享的：

#include <WiFi.h>
#include "Arduino.h"
#include "esp_camera.h"
#include "ESPAsyncWebSrv.h"

#include "soc/soc.h"              // disable brownout problems
#include "soc/rtc_cntl_reg.h"     // disable brownout problems


#define Flashlight 4              // Build-in flashlight of ESP32-CAM Board
const int ledFreq = 1000;
const int ledChannel = 4;
const int ledResolution = 12;     // 12 bits give good resolution at low lux
int led_intensity = 0;


// For AI Thinker ESP32-CAM Board ONLY
#define PWDN_GPIO_NUM     32
#define RESET_GPIO_NUM    -1
#define XCLK_GPIO_NUM      0
#define SIOD_GPIO_NUM     26
#define SIOC_GPIO_NUM     27

#define Y9_GPIO_NUM       35
#define Y8_GPIO_NUM       34
#define Y7_GPIO_NUM       39
#define Y6_GPIO_NUM       36
#define Y5_GPIO_NUM       21
#define Y4_GPIO_NUM       19
#define Y3_GPIO_NUM       18
#define Y2_GPIO_NUM        5
#define VSYNC_GPIO_NUM    25
#define HREF_GPIO_NUM     23
#define PCLK_GPIO_NUM     22



// WiFi credentials
const char* ssid = "SSID";
const char* password = "Password";


typedef struct {
        camera_fb_t * fb;
        size_t index;
} camera_frame_t;

#define PART_BOUNDARY "123456789000000000000987654321"
static const char* STREAM_CONTENT_TYPE = "multipart/x-mixed-replace;boundary=" PART_BOUNDARY;
static const char* STREAM_BOUNDARY = "\r\n--" PART_BOUNDARY "\r\n";
static const char* STREAM_PART = "Content-Type: %s\r\nContent-Length: %u\r\n\r\n";

static const char * JPG_CONTENT_TYPE = "image/jpeg";
static const char * BMP_CONTENT_TYPE = "image/x-windows-bmp";

AsyncWebServer server(80);


const char* htmlHomePage PROGMEM = R"HTMLHOMEPAGE(
<!DOCTYPE html>
<html>
  <head>
  <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
    <style>
      .slider {
        width: 20%;
        height: 10px;
        border-radius: 3px;
      }
    </style>
  
  </head>
  <body class="noselect" align="center" style="background-color:white">
    <h1><br></h1>
    <img id="cameraImage" src="" style="width:400px;height:250px">
    <h2><br></h2>
    
    <div class="slidecontainer">LED_Brightness
        <input type="range" min="0" max="255" value="0" class="slider" id="LEDslider" oninput='sendButtonInput("LED",value)'>
    </div>
    <div class="LED_feedback_value">
      <h4>The feedback of LED intensity: <span id="LED_feedback_value">0</span></h4>
    </div>
    <div class="RSSI">
      <h4>The Received Signal Strength (RSSI): <span id="RSSI_feedback_value">N/A </span>dBm</h4><br>
    </div>


    <script>
      var counter1 = 0;
      let panelButtons = 0;

      function controlPanel(){
        fetch(document.location.origin+'/control?var=led_PWM&val='+ document.getElementById("LEDslider").value);
      }

      function getLEDval(){
        var xhttpr = new XMLHttpRequest();
        xhttpr.onreadystatechange = function(){
          if (this.readyState == 4 && this.status == 200){
            document.getElementById("LED_feedback_value").innerHTML = this.responseText;
          }
        }
        xhttpr.open("GET", "readLED", true);
        xhttpr.send();
      }

      function getRSSI(){
        var xhttpr = new XMLHttpRequest();
        xhttpr.onreadystatechange = function(){
          if (this.readyState == 4 && this.status == 200){
            document.getElementById("RSSI_feedback_value").innerHTML = this.responseText;
          }
        }
        xhttpr.open("GET", "readRSSI", true);
        xhttpr.send();
      }


      setInterval(function(){                     // pressure test,  every 200ms
        controlPanel();
        counter1+=1;
        if (counter1==2){
          getLEDval();
        }
        if (counter1==4){
          counter1=0;
          getRSSI();
        }
      },200); 


      window.onload = document.getElementById("cameraImage").src = window.location + "stream";
    </script>
  </body>    
</html>
)HTMLHOMEPAGE";


class AsyncBufferResponse: public AsyncAbstractResponse {
    private:
        uint8_t * _buf;
        size_t _len;
        size_t _index;
    public:
        AsyncBufferResponse(uint8_t * buf, size_t len, const char * contentType){
            _buf = buf;
            _len = len;
            _callback = nullptr;
            _code = 200;
            _contentLength = _len;
            _contentType = contentType;
            _index = 0;
        }
        ~AsyncBufferResponse(){
            if(_buf != nullptr){
                free(_buf);
            }
        }
        bool _sourceValid() const { return _buf != nullptr; }
        virtual size_t _fillBuffer(uint8_t *buf, size_t maxLen) override{
            size_t ret = _content(buf, maxLen, _index);
            if(ret != RESPONSE_TRY_AGAIN){
                _index += ret;
            }
            return ret;
        }
        size_t _content(uint8_t *buffer, size_t maxLen, size_t index){
            memcpy(buffer, _buf+index, maxLen);
            if((index+maxLen) == _len){
                free(_buf);
                _buf = nullptr;
            }
            return maxLen;
        }
};

class AsyncFrameResponse: public AsyncAbstractResponse {
    private:
        camera_fb_t * fb;
        size_t _index;
    public:
        AsyncFrameResponse(camera_fb_t * frame, const char * contentType){
            _callback = nullptr;
            _code = 200;
            _contentLength = frame->len;
            _contentType = contentType;
            _index = 0;
            fb = frame;
        }
        ~AsyncFrameResponse(){
            if(fb != nullptr){
                esp_camera_fb_return(fb);
            }
        }
        bool _sourceValid() const { return fb != nullptr; }
        virtual size_t _fillBuffer(uint8_t *buf, size_t maxLen) override{
            size_t ret = _content(buf, maxLen, _index);
            if(ret != RESPONSE_TRY_AGAIN){
                _index += ret;
            }
            return ret;
        }
        size_t _content(uint8_t *buffer, size_t maxLen, size_t index){
            memcpy(buffer, fb->buf+index, maxLen);
            if((index+maxLen) == fb->len){
                esp_camera_fb_return(fb);
                fb = nullptr;
            }
            return maxLen;
        }
};

class AsyncJpegStreamResponse: public AsyncAbstractResponse {
    private:
        camera_frame_t _frame;
        size_t _index;
        size_t _jpg_buf_len;
        uint8_t * _jpg_buf;
        uint64_t lastAsyncRequest;
    public:
        AsyncJpegStreamResponse(){
            _callback = nullptr;
            _code = 200;
            _contentLength = 0;
            _contentType = STREAM_CONTENT_TYPE;
            _sendContentLength = false;
            _chunked = true;
            _index = 0;
            _jpg_buf_len = 0;
            _jpg_buf = NULL;
            lastAsyncRequest = 0;
            memset(&_frame, 0, sizeof(camera_frame_t));
        }
        ~AsyncJpegStreamResponse(){
            if(_frame.fb){
                if(_frame.fb->format != PIXFORMAT_JPEG){
                    free(_jpg_buf);
                }
                esp_camera_fb_return(_frame.fb);
            }
        }
        bool _sourceValid() const {
            return true;
        }
        virtual size_t _fillBuffer(uint8_t *buf, size_t maxLen) override {
            size_t ret = _content(buf, maxLen, _index);
            if(ret != RESPONSE_TRY_AGAIN){
                _index += ret;
            }
            return ret;
        }
        size_t _content(uint8_t *buffer, size_t maxLen, size_t index){
            if(!_frame.fb || _frame.index == _jpg_buf_len){
                if(index && _frame.fb){
                    uint64_t end = (uint64_t)micros();
                    int fp = (end - lastAsyncRequest) / 1000;
                    // log_printf("Size: %uKB, Time: %.0fms (%.1ffps)\n", _jpg_buf_len/1024, fp, 1000./fp);           // METER !
                    lastAsyncRequest = end;
                    if(_frame.fb->format != PIXFORMAT_JPEG){
                        free(_jpg_buf);
                    }
                    esp_camera_fb_return(_frame.fb);
                    _frame.fb = NULL;
                    _jpg_buf_len = 0;
                    _jpg_buf = NULL;
                }
                if(maxLen < (strlen(STREAM_BOUNDARY) + strlen(STREAM_PART) + strlen(JPG_CONTENT_TYPE) + 8)){
                    //log_w("Not enough space for headers");
                    return RESPONSE_TRY_AGAIN;
                }
                //get frame
                _frame.index = 0;

                _frame.fb = esp_camera_fb_get();
                if (_frame.fb == NULL) {
                    log_e("Camera frame failed");
                    return 0;
                }

                if(_frame.fb->format != PIXFORMAT_JPEG){
                    unsigned long st = millis();
                    bool jpeg_converted = frame2jpg(_frame.fb, 80, &_jpg_buf, &_jpg_buf_len);
                    if(!jpeg_converted){
                        log_e("JPEG compression failed");
                        esp_camera_fb_return(_frame.fb);
                        _frame.fb = NULL;
                        _jpg_buf_len = 0;
                        _jpg_buf = NULL;
                        return 0;
                    }
                    // log_i("JPEG: %lums, %uB", millis() - st, _jpg_buf_len);                                        // METER !!
                } else {
                    _jpg_buf_len = _frame.fb->len;
                    _jpg_buf = _frame.fb->buf;
                }

                //send boundary
                size_t blen = 0;
                if(index){
                    blen = strlen(STREAM_BOUNDARY);
                    memcpy(buffer, STREAM_BOUNDARY, blen);
                    buffer += blen;
                }
                //send header
                size_t hlen = sprintf((char *)buffer, STREAM_PART, JPG_CONTENT_TYPE, _jpg_buf_len);
                buffer += hlen;
                //send frame
                hlen = maxLen - hlen - blen;
                if(hlen > _jpg_buf_len){
                    maxLen -= hlen - _jpg_buf_len;
                    hlen = _jpg_buf_len;
                }
                memcpy(buffer, _jpg_buf, hlen);
                _frame.index += hlen;
                return maxLen;
            }

            size_t available = _jpg_buf_len - _frame.index;
            if(maxLen > available){
                maxLen = available;
            }
            memcpy(buffer, _jpg_buf+_frame.index, maxLen);
            _frame.index += maxLen;

            return maxLen;
        }
};


void handleRoot(AsyncWebServerRequest *request) 
{
  request->send_P(200, "text/html", htmlHomePage);
}

void handleNotFound(AsyncWebServerRequest *request) 
{
    request->send(404, "text/plain", "ESP32: File Not Found");
}



void streamJpg(AsyncWebServerRequest *request){
    AsyncJpegStreamResponse *response = new AsyncJpegStreamResponse();
    if(!response){
        request->send(501);
        return;
    }
    response->addHeader("Access-Control-Allow-Origin", "*");
    request->send(response);
}



void handleControl(AsyncWebServerRequest *request){
    if(!request->hasArg("var") || !request->hasArg("val")){
        request->send(404);
        return;
    }
    String var = request->arg("var");
    const char * variable = var.c_str();
    int val = atoi(request->arg("val").c_str());

    sensor_t * s = esp_camera_sensor_get();
    if(s == NULL){
        request->send(501);
        return;
    }


    if(!strcmp(variable, "led_PWM")){
      led_intensity = val/4;
      // Serial.printf("Command: LED PWM = %u\n",led_intensity);                  // This line would slow down the ESP32
      ledcWrite(Flashlight, led_intensity);                                       // val 
    }  
    else {
        log_e("unknown command %s", var.c_str());
        request->send(404);
        return;
    }
    // log_d("Got setting %s with value %d. Res: %d", var.c_str(), val, res);

    AsyncWebServerResponse * response = request->beginResponse(200);
    response->addHeader("Access-Control-Allow-Origin", "*");
    request->send(response);
}

void setup(){

  WRITE_PERI_REG(RTC_CNTL_BROWN_OUT_REG, 0);                // Disable brownout detector

  ledcSetup(ledChannel, ledFreq, ledResolution);            // Setup LED PWM freq & resolution
  ledcAttachPin(Flashlight, 4);                             // Channel 4
  ledcWrite(Flashlight, 0x03);                              // Startup indicated by low light

  Serial.begin(115200);
  Serial.setDebugOutput(true);



  // Start Wifi and init camera //

  // Start Wifi


 IPAddress local_ip(192,168,4,1);
 IPAddress gateway(192,168,4,1);
 IPAddress subnet(255,255,255,0);
 WiFi.softAPConfig(local_ip, gateway, subnet);             //AP Mode
 WiFi.softAP(ssid, password);                              //
 Serial.print("AP IP address: ");                          //
 Serial.println(WiFi.softAPIP());                          //


  WiFi.begin(ssid, password);                               // Client Mode
  WiFi.setSleep(false);                                     //
  while (WiFi.status() != WL_CONNECTED) {                   //
    delay(500);                                             //
    Serial.print(".");                                      //
  }                                                         //
  Serial.println("");                                       //
  Serial.println("WiFi connected");                         //
  Serial.print("Camera Stream Ready! Go to: http://");      //
  Serial.println(WiFi.localIP());                           //



  // init camera
  camera_config_t config;
  config.ledc_channel = LEDC_CHANNEL_0;
  config.ledc_timer = LEDC_TIMER_0;
  config.pin_d0 = Y2_GPIO_NUM;
  config.pin_d1 = Y3_GPIO_NUM;
  config.pin_d2 = Y4_GPIO_NUM;
  config.pin_d3 = Y5_GPIO_NUM;
  config.pin_d4 = Y6_GPIO_NUM;
  config.pin_d5 = Y7_GPIO_NUM;
  config.pin_d6 = Y8_GPIO_NUM;
  config.pin_d7 = Y9_GPIO_NUM;
  config.pin_xclk = XCLK_GPIO_NUM;
  config.pin_pclk = PCLK_GPIO_NUM;
  config.pin_vsync = VSYNC_GPIO_NUM;
  config.pin_href = HREF_GPIO_NUM;
  config.pin_sscb_sda = SIOD_GPIO_NUM;
  config.pin_sscb_scl = SIOC_GPIO_NUM;
  config.pin_pwdn = PWDN_GPIO_NUM;
  config.pin_reset = RESET_GPIO_NUM;
  config.xclk_freq_hz = 20000000;
  config.pixel_format = PIXFORMAT_JPEG; 
  if(psramFound()){
    config.frame_size = FRAMESIZE_VGA;
    config.jpeg_quality = 10;
    config.fb_count = 2;
  } else {
    config.frame_size = FRAMESIZE_SVGA;
    config.jpeg_quality = 12;
    config.fb_count = 1;
  }


  // camera init
  esp_err_t err = esp_camera_init(&config);
  if (err != ESP_OK) {
    log_e("ERROR : Camera init failed with error 0x%x\n", err);
    return;
  }
  else {
    log_d("Camera init OK");
  }

  sensor_t * s = esp_camera_sensor_get();
  log_d("Sensor PID : %d\n",s->id.PID);
    
  // =============================================




  server.on("/", HTTP_GET, handleRoot);
  server.on("/stream", HTTP_GET, streamJpg);
  server.on("/control", HTTP_GET, handleControl);
  server.onNotFound(handleNotFound);


// Ajax xhr response to Web page
  server.on("/readLED", HTTP_GET, [](AsyncWebServerRequest *req){
    req->send(200, "text/plain",String(led_intensity));
  });

  server.on("/readRSSI", HTTP_GET, [](AsyncWebServerRequest *req){
    req->send(200, "text/plain",String(WiFi.RSSI()));
  });


  server.begin();
}

// ==== UPDATE : main loop ====
void loop(){
vTaskDelay(5000 / portTICK_PERIOD_MS);
}
// ============================