Webcam js Error in Chrome: Could not access webcam

Question

I am using Webcam JS in one of my projects.

https://github.com/jhuckaby/webcamjs

version I was using: 1.0.0 Latest version available: 1.0.5

It was working fine in both Chrome and Firefox. But lately webcam error started showing only in CHROME. Firefox still works fine.

Error that I received in 1.0.0: Webcam.JS Error: cannot access webcam.

I upgraded the version and now the error I'm getting in chrome is

Webcam.js Error: Could not access webcam.
Permission Error: Only secure origins are allowed

https://www.chromium.org/Home/chromium-security/prefer-secure-origins-for-powerful-new-features

My website has a secure origin.

Can anyone tell me why I'm facing errors like that?

I believe there's no point in copy pasting webcam.js code.

Here's the code I use:

Webcam.set({
      width: 320,
     height: 240,
     dest_width: 320,
     dest_height: 240,
     image_format: 'jpeg',
     jpeg_quality: 90,
     force_flash: false
    });
    Webcam.attach( '#my_camera' );

Answer 1

Chrome 47 requires that the site be HTTPS in order for user media / webcam to work! This is a brand new requirement that I didn't see coming...

Chromium Docs on the topic: https://www.chromium.org/Home/chromium-security/prefer-secure-origins-for-powerful-new-features

This means I'll have to buy a SSL cert. The library should work fine in Chrome 47, as long as you are using it on 127.0.0.1, or over HTTPS.

Issue Discussion

Solution