Not able to access webcam (Javascript)?
Question
I am learning to use getUserMedia() to access webcam in javascript. But i am getting an error - Not allowed to load local resource: blob:null/3485f5b8-46c1-4a40-946a-8de2588720f0
I searched on the net but they said that i needed an https connection or something, file urls are not allowed, but i didn't completely understand what is going on.
the code is -
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta content="stuff, to, help, search, engines, not" name="keywords"> <meta content="What this page is about." name="description"> <meta content="Display Webcam Stream" name="title"> <title>Display Webcam Stream</title> <style> #container { margin: 0px auto; width: 500px; height: 375px; border: 10px #333 solid; } #videoElement { width: 500px; height: 375px; background-color: #666; } </style> </head> <body> <div id="container"> <video autoplay="true" id="videoElement"> </video> </div> <script> var video = document.querySelector("#videoElement"); navigator.getUserMedia = navigator.getUserMedia || navigator.webkitGetUserMedia || navigator.mozGetUserMedia || navigator.msGetUserMedia || navigator.oGetUserMedia; if (navigator.getUserMedia) { navigator.getUserMedia({video: true}, handleVideo, videoError); } function handleVideo(stream) { video.src = window.URL.createObjectURL(stream); } function videoError(e) { // do something console.log("error"); } </script> </body> </html>
2 answers
solution1
2 ACCPTED 2016-10-12 06:36:01
For privacy and security reasons, Google decided to allow certain features only to "secure" origins, ie getUserMedia is only available on websites using HTTPS.
For more of the reasoning you can read their article on this .
Your code is fine and works fine when used via HTTPS, the easiest way to do that during development is probably jsbin .
solution2
1 2016-10-12 06:44:47
If you are trying at chromium, chrome at file: protocol, close all chromium, chrome instances, then re-launch chromium, chrome with --allow-file-access-from-files flag to allow browser access to files at local filesystem. See also Jquery load() only working in firefox?
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.