chrome iframe中无法使用摄像头和麦克风

最新推荐文章于 2024-01-05 15:15:28 发布
最新推荐文章于 2024-01-05 15:15:28 发布
阅读量3.8k 收藏 4
点赞数
分类专栏： front-end 文章标签： jquery html
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/cao_haitao/article/details/110500932
版权
在Chrome浏览器中，当尝试在内嵌的iframe页面中访问摄像头和麦克风时，可能会遇到'NotAllowedError: Permission denied'的错误。解决这个问题的方法包括在iframe元素上添加allow属性。如果父页面和内嵌页面在同一域名下，可以在内嵌页面的jquery代码中设置；若跨域，则必须在父页面的iframe元素上设置。
摘要由CSDN通过智能技术生成

问题

在内嵌iframe页面中调用摄像头和麦克风提示：
Media access NotAllowedError: Permission denied

解决办法

如果是html+jquery，在iframe元素中添加属性

<iframe src="" allow='microphone;camera;midi;encrypted-media;'></iframe></
最低0.47元/天 解锁文章
「已注销」
关注
专栏目录
[Electron] http协议访问摄像头麦克风
imagination_7的博客
05-10 1486
这是一个添加命令行参数的方式，这个参数在chrome中同样有效（因为就是chromium支持的），具体使用如下，第二个参数接受的是一个数组，可以同时允许多个地址，相比于第一种方法会更加安全，推荐使用，除了代码的方式，也可以直接右键程序新增启动参数来实现；具体每个参数的含义这里不做解释，有兴趣可以去官网看看。也就是说这个方法可以把指定的协议当成安全的协议，从而允许调用摄像头等设备，但需要注意开启后该协议所有网址都会被视为安全网址，安全性会降低，这里推荐第二种方法；以下是官网对该方法描述。
iframe嵌套，无法调取麦克风，摄像头权限
bajiutao的博客
05-25 2445
iframe嵌套，无法调取麦克风，摄像头权限
谷歌浏览器高版本浏览器88或以上,引用iframe内嵌页面,页面加载不出来
ラピスラズリ(Dawn)的笔记本
06-16 2771
解决方案: 在外层页面加上这个强制用ie就行了 <meta http-equiv = "X-UA-Compatible" content="ie=edge"> 其他需要ie浏览器兼容,谷歌浏览器不兼容的也可以试试这个 ...
直播 vue中嵌入iframe后，没有办法调取摄像头和麦克风
zhumizhumi的博客
03-16 5083
今天遇到一个解决了很久都没有解决了的Bug 单纯的键一个html文件，无论是嵌进去还是直接跳转都是可以调取摄像头和麦克风的 但是在vue中只要用iframe嵌进去就调取不了麦克风 ...
H5中iframe中嵌套的页面无法使用摄像头和麦克风
Welcome to my csdn!
05-14 6444
无法使用的原因： 在 webview 的 iframe 中，默认禁止不同域名下的录音及摄像头的访问权限（即使手机在系统设置中已为 APP 开启了权限）。 使用： 如果需要访问需要对 iframe 的 allow 属性设置访问权限。根据报错提示，给标签加上相应的allow属性。 <iframe ref="iframes" src="xxx" allow='microphone;camera;'></iframe> 在vue中，直接在iframe上调用，有时候也是不行的； 解决方案：
iframe获取麦克风和摄像头权限
云player的博客
02-09 1120
iframe获取麦克风和摄像头权限
iframe内嵌页面 获取麦克风权限
Lv骚年
08-15 3601
iframe嵌入mic权限获取
iframe嵌入三方页面打开麦克风和摄像头权限
最新发布
qq_36384745的博客
01-05 1662
iframe嵌入三方页面打开麦克风和摄像头权限
特征策略 Feature Policy（iframe内功能控制）
windrainpy的博客
09-19 1280
背景：最近在开发一些产品经常用到iframe这个古老的标签（由于公司许多产品都存在功能耦合），当被嵌入的站点使用到clipboard api的地方功能无效，还有用到camera microphone 相关api时，刷新后音视频的声音无法自动播放，等等嵌入式使用时的功能无效问题，原来问题的来源是feature policy策略。 概念 Web提供的功能和API如果被滥用，可能会带来隐私或安全风险。在某些情况下，您可能希望严格限制在网站上使用此类功能的方式。 特征策略提供一种机制去声明哪些功能（web api
frame显示摄像头获取的图像
07-27
framebuffer显示摄像头获取的图像。
Android webview加载iframe标签的HTML
热门推荐
dxt8305的博客
09-01 1万+
我最近项目需求加入文档云 根据后台返回的数据直接返回iframe标签，但是Android这边想用webview加载，中间出现过各种问题还好最终解决了。所以就整理出一下的代码自己做个笔记同时也希望对您有帮助！ 直接上关键性的代码：  这是接口返回的iframe标签  （这是一个动态的PPT的文本，后台可以简单的定一下样式）      public static WebView pptWe
Django 开发中你不可不知的 7 个 Web 安全头
systemino的博客
10-08 521
Web是一个不断发展的平台，有很多向后兼容的问题。新的web安全实践通常来自于对存在缺陷的旧功能的认识。与其通过改变这些功能来破坏旧网站，还不如选择加入一些更安全的设置。你可以通过设置HTTP头来实现这一点。 Securityheaders.com是一个由安全顾问Scott Helme运行的工具，它可以在这些安全头上创建一个报告。它为任何URL提供从F到A+的...
XSS自动化工具——Beef
世间繁华梦一出
03-10 5542
Beef的使用一、Beef简介二、beef的下载安装三、Beef配置四、Beef的使用五、Ｂeef的主要功能 在我的记忆之中之前是有些过关于beef这款工具的使用的文章的，然而最近整理博客，一看，发现怎么没有了，可能是我忘了吧，或者可能也可能是在梦里写了。。。今天来写一下吧 一、Beef简介 Browser Exploitation Framework （BeEF） BeEF 是目前最强大的浏览器开源渗透测试框架，通过xss漏洞配合JS脚本和Metasploit进行渗透， BeEF 是基于Ruby语言编写的
微软 Edge，火狐Firefox和 谷歌 Chrome 浏览器无法调用 麦克风 原因及解决办法
weixin_44096473的博客
07-31 7417
原因：非 https 安全网址无法直接通过浏览器获取电脑硬件的访问权限，如：麦克风、摄像头等；需要手动将对应网址设置为安全的域名网址。Edge 浏览器：http://192.168.0.188:8081 网址为例： 第一步：在浏览器地址栏输入：edge://flags/#unsafely-treat-insecure-origin-as-secure 第二步：在 Insecure origins treated as secure 输入栏中输入需要获取麦克风权限的白名单网址。 第三步：将右侧 已禁用 状态改
web-view中页面录音无权限问题
qq_28546559的博客
10-19 1042
iframe标签的allow属性是HTML5中用来控制iframe内嵌的内容所允许访问的权限的一个属性。11. “picture-in-picture”：允许将iframe中的视频以画中画模式播放。2，需要指定iframe的可使用权限，如果A域名和B域名不一致，需要开放域名限制*2. “autoplay”：允许iframe中的音视频自动播放。8. “magnetometer”：允许使用磁力计设备。9. “microphone”：允许使用麦克风设备。3. “camera”：允许使用摄像头设备。
解决chrome无法加载https图片、无法调用摄像头和麦克风的问题
m0_46862648的博客
12-11 1848
在浏览器地址栏中输入“chrome://flags/#unsafely-treat-insecure-origin-as-secure”--》回车--》将该选项置为Enabled--》在输入框中输入需要访问的地址，多个地址使用“,”隔开--》点击右下角弹出的Relaunch按钮--》自动重启浏览器之后，就可以在添加的http地址下调用摄像头和麦克风了。（执行上述操作后，以后你每次通过该快捷方式打开chrome，都会从根本上忽略掉浏览器中的所有证书错误）②视频通话功能：无法调用摄像头和麦克风。
iframe嵌套页面，由于同源策略导致cookie无法获取，导致会话session失效问题得解决方案
阳光
04-21 6924
iframe嵌套页面，由于同源策略导致cookie无法获取，导致会话session失效问题得解决方案
【记录腾讯视频内嵌在iframe中无法访问的问题】
可厉害了的Fiona的博客
07-31 344
因为项目需要，腾讯视频功能需要内嵌在iframe中使用，发现语音和视频功能无法调起。只能使用localhost访问开发版才能正常访问，这点官方文档有写。
html scale 缩放iframe,在Chrome中使用css缩放iframe的模糊文本
05-25
在 Chrome 中缩放 iframe 时，如果使用 CSS 进行缩放，可能会导致文本模糊。这是因为 Chrome 会对缩放后的内容进行重新抗锯齿处理，从而导致模糊。 为了解决这个问题，可以尝试以下几种方法： 1. 使用 transform 进行缩放 使用 CSS 的 transform 属性进行缩放时，Chrome 不会进行重新抗锯齿处理，因此可以避免文本模糊的问题。示例代码如下： ```css iframe { transform: scale(0.8); transform-origin: top left; } ``` 2. 设置 iframe 的 width 和 height 将 iframe 的 width 和 height 设置为缩放后的值，而不是使用 CSS 进行缩放，也可以避免文本模糊的问题。示例代码如下： ```html <iframe width="800" height="600" src="..."></iframe> ``` 3. 设置 iframe 的 zoom 将 iframe 的 zoom 设置为缩放比例，也可以避免文本模糊的问题。示例代码如下： ```css iframe { zoom: 0.8; } ``` 不过需要注意的是，zoom 仅在 IE 浏览器中被支持，对于其他浏览器可能会出现兼容性问题。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值