dom / latest / imagecapture / takephoto.html /

ImageCapture.takePhoto()

The takePhoto() method of the ImageCapture interface takes a single exposure using the video capture device sourcing a MediaStreamTrack and returns a Promise that resolves with a Blob containing the data.

Syntax

takePhoto()
takePhoto(photoSettings)

Parameters

photoSettings Optional

An object that sets options for the photo to be taken. The available options are:

  • fillLightMode: The flash setting of the capture device, one of "auto", "off", or "flash".
  • imageHeight: The desired image height as an integer. The user agent selects the closest height value to this setting if it only supports discrete heights.
  • imageWidth: The desired image width as an integer. The user agent selects the closest width value to this setting if it only supports discrete widths.
  • redEyeReduction: A boolean indicating whether the red-eye reduction should be used if it is available.

Return value

A Promise that resolves with a Blob.

Examples

This example is extracted from this Simple Image Capture demo. It shows how to use the Promise returned by takePhoto() to copy the returned Blob to an <img> element. For simplicity it does not show how to instantiate the ImageCapture object.

var takePhotoButton = document.querySelector('button#takePhoto');
var canvas = document.querySelector('canvas');

takePhotoButton.onclick = takePhoto;

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

Specifications

Browser compatibility

Desktop Mobile
Chrome Edge Firefox Internet Explorer Opera Safari WebView Android Chrome Android Firefox for Android Opera Android Safari on IOS Samsung Internet
takePhoto
60
59-60
photoSettings parameter not supported.
79
No
See bug 888177.
No
47
46-47
photoSettings parameter not supported.
No
60
59-60
photoSettings parameter not supported.
60
59-60
photoSettings parameter not supported.
No
See bug 888177.
44
43-44
photoSettings parameter not supported.
No
8.0
7.0-8.0
photoSettings parameter not supported.

© 2005–2021 MDN contributors.
Licensed under the Creative Commons Attribution-ShareAlike License v2.5 or later.
https://developer.mozilla.org/en-US/docs/Web/API/ImageCapture/takePhoto