在离子2 app中使用iframe播放youtube视频

时间:2016-08-20 23:33:12

标签: iframe youtube ionic2 access-control

在Ionic 2应用中,我尝试使用iframe嵌入一个YouTube视频。代码如下所示:

<iframe width="320" height="315" src="https://www.youtube.com/embed/VIDEOID?autoplay=1&controls=1" frameborder="0" allowfullscreen></iframe>

然而,当我导航到该页面时,我收到此错误。我找不到如何解决这个问题的好答案。

  

XMLHttpRequest无法加载https://googleads.g.doubleclick.net/pagead/id。通配符&#39; *&#39;不能用于“访问控制 - 允许 - 来源”#39;凭证标志为true时的标头。起源&#39; https://www.youtube.com&#39;因此不允许访问。 XMLHttpRequest的凭证模式由withCredentials属性控制。

不确定如何解决这个问题。任何帮助/领导都将不胜感激。

BTW,我正在开发/测试Chrome浏览器开发工具。

谢谢,

3 个答案:

答案 0 :(得分:3)

您最好将此添加到config.xml:

<preference name="AllowInlineMediaPlayback" value="true"/>
<access origin="*" subdomains="true" /> 

还要确保您的Android清单有:

<application android:hardwareAccelerated="true" ...>

答案 1 :(得分:0)

我通过编辑两个iframe文件解决了html_sanitizer.js问题。您可以在node_modules\@angular\platform-browser\src\securitynode_modules\@angular\platform-browser\esm\src\security文件夹下找到它们。

打开它们并搜索此行var BLOCK_ELEMENTS,插入iframe标记名称并保存。现在它应该工作,至少它适用于我。

答案 2 :(得分:0)

尝试在源代码中使用enablejsapi=1