WebRTC Fix For getUserMedia Undefined On Local Hosts

You’re in the process of building a video or audio app that is going to be the next big thing on the iPhone store. Development is almost done, and you try to test your video camera, but then you get this error that says:

getUserMedia Undefined

Or it looks something like this:

What this means is that is the browser does not have access camera or microphone of the computer. The error is not a problem with your programming, but browser security requires URL being a secure domain, meaning behind HTTPS.

When developing, how do you solve this problem so you can test it on your local computer? One way is using the service Ngrok, but this article will focus on allowing your browser to access the camera and microphone on insecure domains.

Solving In Chrome

In Chrome, you are going to solve it like this quickly.

1. In the navigation, copy and paste the following: chrome://flags/#unsafely-treat-insecure-origin-as-secure .
2. Find the “Insecure origins treated as secure” setting.
3. Enable it.
4. Enter the domain(s) you want to allow to have this kind of access. If you have multiple domains, comma separate them.
5. Restart Chrome

The domains entered should look something similar to this:

After the restart, go test your your camera again and all should work!