Showing posts from February, 2016

HTML 5 Web Capture Quirks

Today I've been playing around with HTML 5 Web Camera capture and for the most part its been quite easy. HTML5Rocks has a good intro post which covers many things.

Now it came to testing and everything worked as expected in Chrome and Firefox however in Microsoft Edge (We all test in MS Edge don't we.... ) I found an odd behavior. 
I'm being quite lazy and wanting a 640 x 480px image, so 4:3 aspect ratio which I then take a smaller portion from. Below is what it looks like in Chrome:

However in Edge I was getting:

Originally my source was just:
navigator.getUserMedia({video:true}, (stream) => {

So I decided to add explicit constraints:

var constraints = { video: { width: 640, height: 480, } }; navigator.getUserMedia(constraints, (stream) => {

However the results were still the same. I then started digging around any Edge documentation I could find and found my way to the initial ed…