Capacitor Camera issues v2.4.7

Hey,

I have two main issues with Capacitor camera, lets start with the most significant:

1. Reduce image size, for better server handling.

smartphone cameras output an image that is about 5-10Mb.
I am trying to reduce the image size by changing the quality parameter to 20 or 50.
but it seems like nothing has changed, I have tried to set the height and width of the camera using
the width and height property but it didn’t affect the image output either.


const cameraPhoto = await Camera.getPhoto({
      resultType: CameraResultType.Base64,
      source: CameraSource.Camera,
      direction: CameraDirection.Rear,
      quality: 100
    });

1. Camera direction
The camera direction is always opening the front-facing (selfie) camera, and not the rear one despite declaring.

     direction: CameraDirection.Rear,

Am I doing anything wrong? are those know issues with Capacitor? ideas to override this behavior?

Many thanks,
Zoan

Hey there! So I just tried this wasn’t seeing the same issue you described. What platform are you testing on? iOS or Android? What device are you using?

1 Like

Hey Mike,
Thanks for looking into it. Appreciated!

I am using Chrome on UBUNTU and Chorme on Android 11 (MI A3).

import {
  Plugins,
  CameraResultType,
  CameraSource,
  CameraDirection,
  CameraPhoto
} from "@capacitor/core";

export function usePhotoGallery() {
  const { Camera } = Plugins;

  const takePhoto = async () => {
    const cameraPhoto = await Camera.getPhoto({
      resultType: CameraResultType.Base64,
      source: CameraSource.Camera,
      direction: CameraDirection.Rear,
      quality: 10
    });
    var base64Image = cameraPhoto.base64String;
    console.log(base64Image)
  };

  return {
    takePhoto
  };
}

It doesn’t matter if I change the “quality” property, the base64 string will be the same size.

Am I missing anything? (first time working with Capacitor)

Thanks in advance,
Zoan

Is this testing within android natively or just using the browser ala PWA?

Using just the browser.

Ah, yeah that would be expected. If you’re just testing the browser, make sure you have

  1. The @ionic/pwa-elements package installed
  2. Know that that browser doesn’t provide the same control over the photos that native does (due to browser limitations).