Camera

Camera

Camera: Taking and Choosing Photos

Camera 8.1 deprecated getPhoto() and pickImages() in favor of takePhoto() and chooseFromGallery(), with recordVideo() and editPhoto() beside them. On Android, takePhoto() hands the shot to the phone's camera app, and chooseFromGallery() opens the system Photo Picker. Both resolve with a MediaResult:

Taking a photo in src/js/lab.jsJavaScript

export async function photo() {
  const shot = await Camera.takePhoto({
    quality: 80, targetWidth: 800, targetHeight: 600, includeMetadata: true,
  });
  document.querySelector('#lab-photo').src = shot.webPath; // a /_capacitor_file_/ URL
  const { format, resolution, size } = shot.metadata;
  return show('photo', { uri: shot.uri, webPath: shot.webPath, format, resolution, size });
}

Output

LAB photo {"uri":"/data/user/0/com.example.booknest/cache/PIC_20260924_213827.jpg","webPath":"h
  ttps://localhost/_capacitor_file_/data/user/0/com.example.booknest/cache/PIC_20260924_213827.
    jpg","format":"jpg","resolution":"1856x1392","size":73056}

Pass uri, the native path, to other plugins, and put webPath, the same file through the /_capacitor_file_ route of Local Schemes, in an <img>. The file lands in cache/, which Android may clear, so copy it with Filesystem to keep it. The emulator's camera app returned its full 1856x1392 frame despite targetWidth and targetHeight, so check metadata.resolution. No permission dialog appeared: the camera app took the picture, and BookNest declares no CAMERA permission (Runtime Permissions). On iOS (not run here), Info.plist needs NSCameraUsageDescription and NSPhotoLibraryUsageDescription.

MENU