在调用浏览器进行音视频播放或者麦克风权限的时候经常会报getUserMedia错误,以下是常见的两种原因:

  1. 网络协议不安全;
  2. 页面存在iframe嵌套,而需要授权的页面是iframe的子页面,且父子页面存在跨域访问;

网络协议不安全

一、这种情况首选的是生产环境升级http协议为https协议,这个时候浏览器就会放权。【当然本地使用localhost访问,浏览器默认是支持权限开放的】

二、如果在测试环境,不具备配置https的条件,可以采用在浏览器配置白名单方式放权:

  1. chrome系(内核)浏览器:
  • 浏览器地址栏输入: chrome://flags/#unsafely-treat-insecure-origin-as-secure
    
  • 如图配置:然后重启浏览器就可以。
    

在这里插入图片描述

  1. 火狐浏览器:
  • 浏览器地址栏输入: about:config
    
  • 如图搜索insecure
    

在这里插入图片描述

  • 如图配置,将下面两项设置为true
    
media.devices.insecure.enabled = true
media.getusermedia.insecure.enabled = true

在这里插入图片描述

页面存在iframe嵌套

getUserMedia()使用跨源 iframe访问相机和麦克风,默认情况下它将失败,解决办法是在iframe标签里添加allow属性:

<iframe src="" allow="camera *;microphone *;autoplay *;"></iframe>
Logo

有“AI”的1024 = 2048,欢迎大家加入2048 AI社区

更多推荐