Bruce Lawson's personal site

Specifying which camera in getUserMedia

getUserMedia started life as a nice little API that allowed the developer to grab video and/ or audio from a device.

navigator.getUserMedia({audio: true, video: true}, success, error);

It’s shipping for camera access in Opera 12 desktop and Opera Mobile 12 and implemented in Chrome nightlies.

The spec has ballooned since I last looked at it in detail. There is a new “constraints API” which adds significant complexity, while the language of the spec isn’t rigorous (yet). This is likely to delay standardisation yet the simplest use-cases that it originally met are the core features.

Originally, it had a method for authors to hint to the user agent which camera to use – you could suggest “user” for the camera that faces you, or “environment” for the camera that faces outwards. This has disappeared from the spec, to be dealt with later, once the complex capabilities & constraints API is fleshed out.

Should the author be able to specify which camera should be used? It seems to me that this would be a good idea. For example, my mobile phone camera is usually set to use the rear-facing “environment” camera, but if I were to start up a video-conferencing app (or any of the fun “Photo booth” apps on Shiny Demos) I’d like the app to switch to using the forward-facing “user” camera without my having to manually switch camera. (Some devices don’t have hardware switches, so would require me to go to a system preference to change which camera to use, which would be a major pain in the arse.)

I strongly feel that the Working Group should allow authors to choose which camera to use before fleshing out advanced capabilities & constraints APIs which are beyond the use-cases of many authors.

However, although most phones will continue to have two cameras, some devices like the Mito 611 have more than two. How do we write a specification for hinting which camera to use with multiple cameras?

Buy "Calling For The Moon", my debut album of songs I wrote while living in Thailand, India, Turkey. (Only £2, on Bandcamp.)

9 Responses to “ Specifying which camera in getUserMedia ”

Comment by AlastairC

Do you let the developer specify it, or suggest that user-agents provide the choice at the appropriate time?

For example, if I open a web app that requests video usage I should get a choice:
1. if my device has one camera: yes / no
2. If it has multiple cameras: front / back / no

That would also help prevent the creep-out factor of cameras turning on automatically.

Comment by kl

I have two cameras facing me!

One in my open laptop and other in my external display. I want to choose primary one

Comment by AlastairC

@kl, I used a simple example, but that helps my point: the UA is best placed to know what cameras are available and give the user a choice.

In your case it might be: laptop / monitor / no

But the point being you’d be given a choice by your browser, rather than a developer making an assumption about what ‘most people’ have. Too much diversity here.

Comment by Bruce

The user should definitely be in control. But it would still be useful for the developer to hint which camera should be accessed, but the user can over-ride it.

Comment by Craig McCahill

Heh good article,

Completely agree about rear cameras. But I’m also interested in the possibilities of 3D stereoscopic cameras which use two cameras and other devices like Kinect with multiple inputs.

For a start I’d love to build a fun demo with a Minoru 3D anaglyph camera –



Comment by Fred Clark

A default camera as well as mic/speaker needs to be set at startup, but the user needs to be able to change as need. It is really best if it can be done in the middle of a session. It is much more useful that way, particularly for users that are unfamiliar with how things work.

Comment by Jacob Simmons

has anyone figured out a way to use the front-facing camera on android in any browser with getusermedia? I can’t seem to find the settings anywhere. I also tried searching the phone to set front-facing as default but had no luck. I’m using an HTC One if that helps

Leave a Reply

HTML: You can use these tags: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong> . To display code, manually escape it.