javascript - How to force a 16:9 ratio with getUserMedia on all devices? -

i need use getusermedia while video set record in 16:9 resolution.

my code works on desktops , on android 7 , above:

navigator.getusermedia( {    audio: true,    video: {       mandatory: {           minwidth: 380,           minheight: 214,           maxwidth: 380,           maxheight: 214       }    } }) 

but on android 6 , below, , on desktops (can't figure out which), getusermedia breaks, , no image available camera.

this works on all devices , desktop, default resolution ratio of 4:3, while need 16:9:

navigator.getusermedia( {    audio: true,    video: true }) 

i tried omitting mandatory, no luck.

to add confusion, ios devices (11 beta) , android require passing facingmode argument:

video: { facingmode: 'user' } 

so, seems passing width , height arguments breaks getusermedia on desktops , devices android 5 , 6.

is there way force 16:9 ratio on devices? correct , conventional method of capturing video specific dimensions?

you're assuming cameras support 16:9, or browsers crop video you. not so. you're using outdated api. try the latest api (fiddle, samples):

var constraints = {video: {width: 320, height: 180, facingmode: "user"}};  navigator.mediadevices.getusermedia(constraints) .then(stream => video.srcobject = stream) .then(() => new promise(resolve => video.onloadedmetadata = resolve)) .then(() => log(video.videowidth +"x"+ video.videoheight)) .catch(e => console.log(e)); 

getusermedia @ heart camera/mic discovery api: min, max, exact, ideal keywords exist describe constraints, i.e. tolerance not getting want.

i suggest aspectratio constraint, except nobody implements yet, , it's constraint decrease tolerance.

at moment believe chrome downscale , crop camera output exact size want. turns out people want, discovers little user's camera. other browsers may follow, since there hasn't been demand else, don't downscale.

note though chrome won't upscale, if you're using chrome on android, there's chance asked higher resolution android 6 device can output. check overconstrainederror in case, , try again lower values.

in short, you're not going exact size want, depends on user's camera , browser.

but htmlvideoelement downscales on playback anyway, , can use css crop.