10

我有使用 twilio javascript SDK 的基本视频聊天 nodeJS webapp

视频.xyz.com

我正在尝试将其添加到在不同的 web 服务和子域上运行的 webapplet 的 iframe 中

演示.xyz.com

当我直接运行时，浏览器会显示摄像头和麦克风访问提示，它工作正常。但在 iframe 内我无法访问摄像头和麦克风。

两个 webapplet 都在相同的端口上运行，但在不同的子域上。

我已尝试document.domain在视频聊天应用程序上进行设置以匹配将添加 iframe 的父页面应用程序，但没有使其正常工作。我在 chrome 中收到此错误：

"Uncaught DOMException: Failed to set the 'domain' property on 'Document': Assignment is forbidden for sandboxed iframes."

我确实有允许麦克风和相机属性。

<iframe allow="camera; microphone" sandbox="allow-forms allow-scripts" src="https://video.xyz.com"></iframe>

我需要做什么才能在 iframe 中访问相机？哪个网络应用需要这种改变？这需要CORS吗？

提前致谢。任何帮助，将不胜感激。

4

2 回答 2

11

只需阅读https://groups.google.com/forum/#!topic/bigbluebutton-dev/jauJm_sBbU8

这以前有效：

<iframe src="example.com" allow="camera; microphone"/>

在我的例子中，网页有一个 HTTP 响应头：“Content-Security-Policy: child-src 'self' *;” 并且 Iframe 中的 URL 的来源与其父 URL 的来源不同。

但现在我们应该这样做：（在 Chrome 版本 83.0.4103.61 中测试）

<iframe src="example.com" allow="camera https://example.com; microphone https://example.com"/>
于 2020-06-02T19:41:54.000 回答
1

小菜一碟：

<iframe
       title="Open identification process"
       src="xxx.com"
       frameBorder="0"
       width="600"
       height="800"
       allow="camera; microphone"
     />
于 2020-01-27T10:02:25.780 回答