如何在Phonegap ios应用中嵌入youtube视频

时间:2013-10-29 15:03:26

标签: ios cordova

我一直在寻找解决方案的时间很长,但我能找到的所有内容都与旧版本的phonegap相关。

我基本上需要在我的应用中添加一些youtubes视频,但目前正在使用包含代码,例如:

<iframe width="240" height="180" src="http://www.youtube.com/embed/PEfxz7PuI0g" allowfullscreen></iframe>

除了视频占用的空间外,这不显示任何内容,只是一个灰色的框。我正在使用phonegap 2.9.0和最新版本的xCode。我已经尝试设置域名以允许youtube,但这没有帮助:

MediaPlaybackRequiresUserAction: NO
AllowInlineMediaPlayback: YES
OpenAllWhitelistURLsInWebView: YES
ExternalHosts
          *.youtube.com
          *.ytimg.com

我认为这是针对ios的早期版本的phonegap应用程序。如果有人帮忙,我们将不胜感激。

3 个答案:

答案 0 :(得分:8)

尝试以下代码,希望它能为您提供全面的帮助

var video_embeded ='PEfxz7PuI0g';

<object><param name="movie" value="https://www.youtube.com/v/'+video_embeded+'&hl=en_US&feature=player_embedded&version=3"></param><param name="allowFullScreen" value="true"></param><param name="allowScriptAccess" value="always"></param><embed src="https://www.youtube.com/v/'+video_embeded+'?suggestedQuality=medium&hl=en_US&feature=player_embedded&version=3" type="application/x-shockwave-flash" allowfullscreen="true" allowScriptAccess="always"></embed></object>

这对我来说很有帮助....

答案 1 :(得分:4)

我在使用PhoneGap应用时遇到了类似的问题。该视频(YouTube或Vimeo)在Android上运行良好,但在iOS上只有一个空白区域。 我尝试了许多不同的解决方案,但唯一真正有效的方法是在config.xml中添加以下行:

<preference name="AllowInlineMediaPlayback" value="true" />
<preference name="MediaPlaybackRequiresUserAction" value="false" />   
<allow-navigation href="*youtube*" />
<allow-navigation href="*ytimg*" />

希望这有帮助。

答案 2 :(得分:0)

我想做什么改变..

 <!DOCTYPE html>
 <html lang="en">
 <head>
 <meta charset="UTF-8">
 <title>Document</title>
 </head>
 <body>
 <!--<iframe width="560" height="315"src="https://www.youtube.com                  
 /embed/Qhl5B4K1N0k" frameborder="0"allowfullscreen></iframe>-->

 <object><param name="movie" value="https://www.youtube.com/v/'
 +video_embeded+'&hl=en_US&feature=player_embedded&version=3"></param>       
 <param name="allowFullScreen" value="true"></param><param     
 name="allowScriptAccess" value="always"></param><embed   
 src="https://www.youtube.com/v/'+video_embeded+'?
 suggestedQuality=medium&hl=en_US&feature=player_embedded&version=3" 
 type="application/x-shockwave-flash" allowfullscreen="true" 
 allowScriptAccess="always"></embed></object>
 </body>
 </html>