使用带有Javascript的网络摄像头拍摄快照

制作网页以使用网络摄像头拍摄快照。但突然间，它在每台计算机上都停止了工作。是我打错了我看不见自己，还是有人也有想法来解决这个问题

• 还添加了一个引入位

  // Put event listeners into place
  window.addEventListener("DOMContentLoaded", function() {
      // Grab elements, create settings, etc.
      var canvas = document.getElementById("canvas"),
          context = canvas.getContext("2d"),
          video = document.getElementById("video"),
          videoObj = { "video": true },
          image_format= "jpeg",
          jpeg_quality= 85,
          errBack = function(error) {
              console.log("Video capture error: ", error.code); 
          };
  
  
      // Put video listeners into place
      if(navigator.getUserMedia) { // Standard
          navigator.getUserMedia(videoObj, function(stream) {
              video.src = stream;
              video.play();
              $("#snap").show();
          }, errBack);
      } else if(navigator.webkitGetUserMedia) { // WebKit-prefixed
          navigator.webkitGetUserMedia(videoObj, function(stream){
              video.src = window.URL.createObjectURL(stream);
              video.play();
              $("#snap").show();
          }, errBack);
      } else if(navigator.mozGetUserMedia) { // moz-prefixed
          navigator.mozGetUserMedia(videoObj, function(stream){
              video.src = window.URL.createObjectURL(stream);
              video.play();
              $("#snap").show();
          }, errBack);
      }
  
  
  
  // Get-Save Snapshot - image 
      document.getElementById("snap").addEventListener("click", function() {
          context.drawImage(video, 0, 0, 640, 480);
          // the fade only works on firefox?
          $("#video").fadeOut("slow");
          $("#canvas").fadeIn("slow");
          $("#snap").hide();
          $("#reset").show();
          $("#upload").show();
  

---

在这部分代码中，您从未将视频绘制到画布上

另外，

navigator.getUserMedia

不再是“标准”，它已更新为

navigator.mediaDevices.getUserMedia

，这将返回一个承诺

var ctx=c.getContext（'2d'）；
var vid=document.createElement（'video'）；
vid.oncanplay=函数（）{
c、 宽度=此宽度；
c、 高度=此高度；
draw（）；
}
navigator.mediaDevices.getUserMedia({
视频：真的
})。然后（（流）=>{
vid.srcObject=流；
视频播放（）；
});
函数绘图（）{
ctx.drawImage（vid，0,0）；
请求动画帧（绘制）；
}

---

控制台会给您任何错误？。它曾经工作过吗？控制台只是告诉我“加载资源[media%20MediaStream]失败”（未找到）是的，以前它很有用，但只有我用chrome，yeez。任何其他的想法都是受欢迎的。我明白你的意思，什么有效，但我现在不确定我如何在我自己的代码中实现它。我对完整的代码进行了修改。你介意看一看吗？上帝啊，上帝之王，我为你消除我的头痛向你致敬！卡利多：你可能也想要采用vid.srcObject=stream；这是最简单的方法things@PhillipHancke你是对的。我想我没有，因为同时FF不幸地只接受MediaStream作为srcObject。。。