go to index

网页录音提示 TypeError Cannot read property 'getUserMedia' of undefined 错误的解决方法

read time 2 min read
录音 Chrome 安全

简介

在使用 JavaScript 进行网页录音时,本地调试可能正常工作,但在部署到正式环境后可能会遇到以下错误:

plaintext
TypeError: Cannot read property 'getUserMedia' of undefined

这是由于 Chrome 对安全性的限制导致的。navigator.mediaDevices.getUserMedia 只能在 HTTPS 环境下或本地开发环境中(如 localhost)正常使用。

解决办法

方法一:更改正式环境支持 HTTPS

最推荐的做法是确保你的正式环境支持 HTTPS。HTTPS 提供了更安全的通信协议,避免了许多浏览器的安全限制。

方法二:修改浏览器配置

如果你暂时无法将正式环境迁移到 HTTPS,可以通过修改浏览器配置来绕过此限制。请注意,这种方法仅适用于开发和测试环境,不建议在生产环境中使用。

步骤:

  1. 打开 Chrome 实验性标志页面: 在浏览器地址栏中输入以下 URL 并回车:

    plaintext
    chrome://flags/#unsafely-treat-insecure-origin-as-secure
    
  2. 启用不安全来源的安全处理: 找到 Insecure origins treated as secure 选项,并将其设置为启用状态。

    修改浏览器配置

  3. 添加需要信任的域名: 在弹出的输入框中添加你希望信任的不安全域名,例如 http://yourdomain.com

  4. 重启浏览器: 修改完成后,记得重启浏览器以使更改生效。