浏览器调用摄像头NotFoundError, Requested device not found?

我前端调用摄像头,一开始没问题,过了一会儿再去调用,就会出现

NotFoundError, Requested device not found

然后就怎么也弄不好了,只能重启电脑,这是什么问题?

image.png

阅读 1.5k
avatarAI BotBETA

遇到 NotFoundError: Requested device not found 错误通常表明浏览器无法访问之前请求的设备(如摄像头)。这种情况可能由多种原因引起,以下是一些可能的解决方案和排查步骤:

1. 摄像头权限

确保浏览器具有访问摄像头的权限。有些浏览器(如Chrome)在首次请求访问摄像头时会弹出权限请求窗口。如果用户拒绝,则后续请求会失败。检查浏览器的权限设置,确保允许网站访问摄像头。

2. 摄像头被其他应用占用

如果摄像头被其他应用程序(如视频通话软件、摄像头测试工具等)占用,浏览器可能无法访问它。确保没有其他程序正在使用摄像头,或者尝试关闭这些程序后重新加载你的网页。

3. 浏览器问题

  • 重启浏览器:有时简单的重启可以解决临时的资源锁定或状态问题。
  • 更新浏览器:确保你的浏览器是最新版本,因为旧版本可能包含未修复的bug。
  • 清除浏览器缓存和Cookie:有时缓存或Cookie可能导致问题。

4. 代码问题

  • 检查代码中的设备ID:如果你在代码中指定了摄像头的ID,确保这个ID是正确的,并且该设备仍然可用。
  • 重新请求设备:在出现错误后,尝试重新请求访问摄像头。在Web API中,通常可以通过调用navigator.mediaDevices.getUserMedia()再次请求。

5. 硬件问题

  • 检查摄像头硬件:确保摄像头没有物理损坏,并且正确连接到计算机。
  • 尝试其他设备:如果可能,尝试使用不同的摄像头或计算机来查看问题是否仍然存在。

6. 调试和日志

  • 查看浏览器控制台:浏览器控制台(通常可以通过F12键打开)可能会提供更多关于错误的详细信息。
  • 使用网络抓包工具:如Wireshark,检查是否有与摄像头相关的网络请求失败。

示例代码

如果你使用的是navigator.mediaDevices.getUserMedia(),确保你的代码类似于以下结构,并正确处理错误:

navigator.mediaDevices.getUserMedia({ video: true })
  .then(function(stream) {
    // 使用stream做一些事情,比如显示在video元素中
    var video = document.querySelector('video');
    video.srcObject = stream;
  })
  .catch(function(error) {
    console.error("摄像头访问失败:", error);
    // 根据错误类型处理,比如提示用户重新尝试或检查权限
  });

通过这些步骤,你应该能够诊断并解决 NotFoundError: Requested device not found 的问题。如果问题仍然存在,可能需要更深入地调查具体的系统或硬件问题。

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
宣传栏