ImageCapture: takePhoto() メソッド

photoSettings 省略可

写真を撮るためのオプションを設定するオブジェクト。利用できるオプションは以下の通りです。

fillLightMode

このキャプチャ機器のフラッシュ設定です。 "auto"、"off"、"flash" のいずれかです。

imageHeight

画像の希望の高さを整数で指定します。ブラウザーが離散的な高さしか対応していない場合は、この設定に最も近い高さの値を選択します。

imageWidth

画像の希望の幅を整数で指定します。ブラウザーが離散的な幅しか対応していない場合は、この設定に最も近い幅の値を選択します。

redEyeReduction

論理値で、赤目軽減が利用できる場合に使用するかどうかを示します。

Blob で解決するプロミス (Promise) です。

InvalidStateError DOMException

コンストラクターで渡した MediaStreamTrack の readyState プロパティが live でない場合に発生します。

UnknownError DOMException

何らかの理由で処理を完了できない場合に発生します。

この例は、このシンプルな画像キャプチャのデモから抜粋したものです。 takePhoto() が返す Promise を使用して、返された Blob を <img> 要素にコピーする方法を示しています。簡単にするために、 ImageCapture オブジェクトをインスタンス化する方法は示していません。

let takePhotoButton = document.querySelector("button#takePhoto");
let canvas = document.querySelector("canvas");

takePhotoButton.onclick = takePhoto;

function takePhoto() {
  imageCapture
    .takePhoto()
    .then((blob) => {
      console.log("Took photo:", blob);
      img.classList.remove("hidden");
      img.src = URL.createObjectURL(blob);
    })
    .catch((error) => {
      console.error("takePhoto() error: ", error);
    });
}