在離子2應用中使用iframe播放youtube視頻

Question

在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。當憑證標誌爲真時，'Access-Control-Allow-Origin'標頭中不能使用通配符'*'。因此'Origin'https://www.youtube.com'不允許訪問。 XMLHttpRequest的憑證模式由withCredentials屬性控制。

不知道如何解決這個問題。任何幫助/領導將不勝感激。

順便說一句，我正在開發/測試鉻瀏覽器開發工具。

感謝，

Answer 1

你最好添加到您的config.xml：

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

另外，還要確保您的Android清單有：

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

Answer 2

我已經編輯兩個解決iframe問題html_sanitizer.js文件。您可以在node_modules\@angular\platform-browser\src\security和node_modules\@angular\platform-browser\esm\src\security文件夾下找到它們。

打開它們並搜索該行var BLOCK_ELEMENTS，插入iframe標籤名稱並保存。現在它應該可以工作，至少它適用於我。