How to use ESP32 cam photo that’s stored in SPIFFS to be used in separate JS file

Background: my project involves the use of a LILYGO TTGO ESP32 Camera to take a picture that is stored in SPIFFS. Then I want to be able to access that photo from a Javascript file which is where the “calculations” for the photo will be done and later displayed on the webpage. All my files will be on SPIFFS(HTML, CSS, JS, photos).

I want to know how I can access that photo in javascript to carry out other commands using Fabric and TensorFlow

Here is some of the code I am using to capture a photo in Arduino:

bool checkPhoto( fs::FS &fs ) {
  File f_pic = fs.open( FILE_PHOTO );
  unsigned int pic_sz = f_pic.size();
  return ( pic_sz > 100 );
}

void capturePhotoSaveSpiffs( void ) {
  camera_fb_t * fb = NULL; // pointer
  bool ok = 0; // Boolean indicating if the picture has been taken correctly

  do {
    Serial.println("Taking a photo...");

    fb = esp_camera_fb_get();
    if (!fb) {
      Serial.println("Camera capture failed");
      return;
    }

    Serial.printf("Picture file name: %sn", FILE_PHOTO);
    File file = SPIFFS.open(FILE_PHOTO, FILE_WRITE);

    if (!file) {
      Serial.println("Failed to open file in writing mode");
    }
    else {
      file.write(fb->buf, fb->len); // payload (image), payload length
      Serial.print("The picture has been saved in ");
      Serial.print(FILE_PHOTO);
      Serial.print(" - Size: ");
      Serial.print(file.size());
      Serial.println(" bytes");
    }
    file.close();
    esp_camera_fb_return(fb);

    ok = checkPhoto(SPIFFS);
  } while ( !ok );
}

Here is the code I am using in JS to try and execute:

function findSpot(){
        capturePhoto();  
       
        var currentImg = document.createElement("img");
        currentImg.src = "./FILE_PHOTO.jpg";
     
    }

    function capturePhoto() {
    var xhr = new XMLHttpRequest();
    xhr.open('GET', "/capture", true);
    xhr.send();
  }