【前端踩坑】网页调用摄像头

计算机狂热爱好者

最近发现了一个好东西,是网页调用摄像头的插件(一个柏林的大神编写的),传送门:
github下载插件地址:https://github.com/infusion/jQuery-webcam,
大神文档:https://www.xarg.org/project/jquery-webcam-plugin/,
大神主站(follow中...):https://github.com/infusion


好了,开始改BUG吧

前端视频不出来
  • 网页调用摄像头获取视频并拍照的作品报错:Failed to execute 'createObjectURL' on 'URL'

  • 原因是Chrome升级后,新版本的Chrome不再支持该用法。
    其他主流浏览器也是如此,详细讨论请参考如下链接:https://www.fxsitecompat.com/en-CA/docs/2017/url-createobjecturl-stream-has-been-deprecated/

  • 在控制台找到出错点:

video.src = (window.URL || window.webkitURL).createObjectURL(stream);
  • 将它改为:
video.srcObject = stream;
  • 有一个兼容的写法:
try {
  this.srcObject = stream;} catch (error) {
  this.src = window.URL.createObjectURL(stream);}
  • 测试一下,It Works!! 开心
0 warnings,0 errors

你可能感兴趣的:(【前端踩坑】网页调用摄像头)