takePhoto.ts

import {Capacitor} from "@capacitor/core"
import { Camera, CameraDirection, CameraResultType, CameraSource } from "@capacitor/camera";

async function takePhoto() {
  let cameraPermission = {camera: "granted"};
  // On web, Camera.requestPermissions is not implemented, we we do it only if we are on a native platform
  if (Capacitor.isNativePlatform()) {
    cameraPermission = await Camera.requestPermissions({permissions: ["camera"] });
  }
  if (cameraPermission.camera !== "denied") {
    try {
      const image = await Camera.getPhoto({
        allowEditing: true,
        correctOrientation: false,
        direction: CameraDirection.Rear,
        quality: 90,
        source: CameraSource.Camera,
        resultType: CameraResultType.Uri,
      });
      // here i got two urls: 'capacitor://localhost/...' and "file:///..." both fail to fetch due to CORS
      console.log("taken image webpath, path: ", image.webPath, image.path);
      if (image.webPath) {
        const resp = await fetch(image.webPath);
        const blob = await resp.blob();
        return { blob, image };
      }
      // This is dirty as fuck but capcitor throw an error
      // for whatever happens in the api other than a full complete "picture taken and validated" logic
    } catch (e) {
      console.error("something went wrong: ", e);
    }
    return null;
  }
  return null;
}

export { takePhoto };