This is an experimental technology
Check the Browser compatibility table carefully before using this in production.
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
var promise = ImageCapture.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"on"
.imageHeight
: The desired image height as an integer. The user agent selects the closest width 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
.
Example
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 simplicy it does not show how to instantiate the image capture 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
Specification | Status | Comment |
---|---|---|
MediaStream Image Capture The definition of 'takePhoto()' in that specification. |
Working Draft | Initial definition. |
Browser Compatibility
Feature | Chrome | Firefox (Gecko) | Internet Explorer | Opera | Safari (WebKit) |
---|---|---|---|---|---|
Basic support | 59 | ? | ? | 46 | ? |
photoSettings argument |
60 | ? | ? | 47 | ? |
Feature | Android Webview | Chrome for Android | Firefox Mobile (Gecko) | Firefox OS | IE Mobile | Opera Mobile | Safari Mobile |
---|---|---|---|---|---|---|---|
Basic support | 59 | 59 | ? | ? | ? | 46 | ? |
photoSettings argument |
60 | 60 | ? | ? | ? | 46 | ? |