Device.openCamera

Functional API openCameraYou can use the same feature with it as well.

Feature description

Returns the image captured by running the camera.

If you don't have camera permission OpenCameraPermissionErroroccurs. Device.openCamera.getPermission() / Device.openCamera.openPermissionDialog()you can check/request permission with

Type

Device.openCamera(options?: OpenCameraOptions): Promise<ImageResponse>;

Params

type OpenCameraOptions = {
  /** Whether to return the image as Base64. Default is false. */
  base64?: boolean;
  /** Maximum image width (px). Default is 1024. */
  maxWidth?: number;
};

Response

type ImageResponse = {
  id: string;
  dataUri: string;
};

Error

The error is thrown as a class — error instanceof OpenCameraPermissionErroridentify it with. The class can @apps-in-toss/web-frameworkbe imported from

Error class	Description
OpenCameraPermissionError	This is when camera permission is denied. Device.openCamera.openPermissionDialog()You can request again with

Example code

import { Device, OpenCameraPermissionError } from "@apps-in-toss/web-framework";

const base64 = true;

async function captureAndShow() {
  try {
    const image = await Device.openCamera({ base64, maxWidth: 1024 });

    const img = document.getElementById("preview");
    img.src = base64
      ? "data:image/jpeg;base64," + image.dataUri
      : image.dataUri;
  } catch (error) {
    if (error instanceof OpenCameraPermissionError) {
      console.warn("You don't have camera permission.");
      return;
    }
    console.error(error);
  }
}

document
  .getElementById("open-camera")
  .addEventListener("click", captureAndShow);