Question

我正在开发Chrome打包应用（不是传统的打包应用）;我的应用需要包含沙盒iframe（运行第三方HTML / JS代码），我需要使用webview或iframe来显示Youtube视频。都不起作用;我无法播放任何Youtube视频。（但是，webview在沙盒iframe之外使用时会起作用。）

主HTML文件如下所示：

 <iframe src="sandbox.html"></iframe>

文件sandbox.html在manifest.json中声明。它看起来像这样（我尝试了另外两种播放Youtube视频的方式）：

<webview width="420" height="315" src="http://www.youtube.com/embed/XGSy3_Czz8k"></webview>
<iframe width="420" height="315" src="http://www.youtube.com/embed/XGSy3_Czz8k"></iframe>

当我运行此应用时，webview是一个空的白色矩形。另一方面，iframe包含封面图片，Youtube播放器控制视频。

首先，为什么webview为空？只要我使用沙箱webview之外的webview ，iframe就可以在此应用中播放（播放视频）。当webview位于沙箱内时，它会无声地拒绝加载任何内容。

其次，当我运行此应用程序时，控制台中存在错误：

 GET chrome-extension://boadgeojelhgndaghljhdicfkmllpafd/cast_sender.js net::ERR_FAILED www-embed-player.js:140
 GET chrome-extension://dliochdbjfkdbacpmhlcpmleaejidimm/cast_sender.js net::ERR_FAILED www-embed-player.js:140
 GET chrome-extension://hfaagokkkhdbgiakmmlclaapfelnkoah/cast_sender.js net::ERR_FAILED www-embed-player.js:140
 GET chrome-extension://fmfcbgogabcbclcofgocippekhfcmgfj/cast_sender.js net::ERR_FAILED www-embed-player.js:140
 GET chrome-extension://enhhojjnijigcajfphajepfemndkmdlo/cast_sender.js net::ERR_FAILED www-embed-player.js:140

当我在沙盒页面中加载上面显示的iframe时，会出现这些错误。这些错误很奇怪（为什么Chrome会尝试从一些随机的Chrome扩展程序中加载JS文件？）

当我尝试在iframe中播放视频时，有时会收到消息＆＃34;发生错误＆＃34;来自Youtube播放器，有时没有消息，但播放器变黑。在所有情况下，我在控制台上都有此错误：

 XMLHttpRequest cannot load https://www.youtube.com/get_video_info?html5=1&video_id=S2VXOd3uXh8&cpn=Rso…=en_US&sts=16309&lact=11140&width=300&height=300&iframe=1&c=web&cver=html5. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'null' is therefore not allowed access.

我的manifest.json拥有所有必要的权限：

 "permissions": [
 "http://www.youtube.com/*", "https://www.youtube.com/*", "webview" ],
 "sandbox": {
   "pages": [ "sandbox.html" ]
 }, ...

我尝试了<object data=...>，<embed src=...>，MediaElement - 在Chrome应用中，它们都不起作用。

我不知所措，也无法在网上找到任何相关信息。

为什么webview在沙盒iframe内时是空白的？
我可以采取哪些措施让webview或iframe在打包的Chrome应用中的沙盒iframe内工作以显示Youtube视频吗？

Answer 1

您应该将网址直接加载到webview，而不是iframe。您的主HTML应包含：

<webview  width="420" height="315" src="http://www.youtube.com/embed/XGSy3_Czz8k"></webview>

直接。
我尝试将您的网址http://www.youtube ....加载到浏览器示例应用中，该应用会在内部加载网址并且似乎正常工作。
可以在此处找到浏览器示例应用程序以供参考： webview-samples/browser

Answer 2

解决方法是使用webview使用iframe播放视频。

这会产生许多其他问题，例如webview的异步性质，webview如果不可见则会静默卸载所有内容，等等。但至少视频会播放。< / p>

没有其他组合可行：我在webview内部webview，iframe内部iframe或webview { {1}}。

主HTML文件：

iframe

内部<webview src="sandbox.html" partition="static"></webview>：

sandbox.html

在<iframe width="420" height="315" src="http://www.youtube.com/embed/XGSy3_Czz8k"></iframe>：

manifest.json

Webview和iframe无法在Chrome打包应用中的沙盒iframe中显示Youtube视频

2 个答案: