ImageCapture: takePhoto() メソッド

takePhoto() は ImageCapture インターフェイスのメソッドで、 MediaStreamTrack をソースとする動画キャプチャ端末を使用して単一の撮影を行い、データを格納した Blob で解決するプロミス (Promise) を返します。

構文

takePhoto()
takePhoto(photoSettings)

引数

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);
 });
}

仕様書

ブラウザーの互換性