How to embed youtube video in Phonegap ios app

Question

I've been searching for a long time for a solution but all i can find are things related to the old versions of phonegap.

I basically need to include some youtubes videos on my app, but currently using a include code such as:

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

This doesn't display anything apart from the space the video would take up, just a grey box. I'm using phonegap 2.9.0 and the latest version of xCode. I've tried setting the domains to allow youtube, but this didn't help:

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

I believe that was for previous versions of phonegap apps for ios. Can anyone help, it would be appreciated.

I see the new facebook app doing this now - in app, autoplaying, not in separate video window. Would love to know how they solved this. — Eskim0, Dec 26 '13 at 18:05

score 8 · Accepted Answer · answered Jan 16 '14 at 05:36

8

try the below code hope it will help full for you

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>

this is help full for me....

answered Jan 16 '14 at 05:36

Gopal vaid

376
3
7

1

That's really working. Can't understand why this answer has been left without attention. Nice solution! – Mike Jun 02 '14 at 15:15
This is the first answer that worked after hours of research. – bentsai Jun 07 '14 at 13:59
1

We're having this same issue, is it still working for you? Can you share a complete example? – sbsbessa Mar 06 '17 at 11:43

score 5 · Answer 2 · answered Sep 24 '16 at 17:44

I had a similar issue with a PhoneGap app. The video (either YouTube or Vimeo) worked well on Android, but on iOS there was just an empty space. I tried many different solutions, but the only one that really worked was adding the following lines to config.xml:

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

Hope this helps.

We're having this same issue, even when using these lines, is it still working for you? Can you share a complete example? — sbsbessa, Mar 06 '17 at 11:43

score 0 · Answer 3 · edited Dec 28 '15 at 05:58

Is there any changes i want to do..

 <!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>

How to embed youtube video in Phonegap ios app

3 Answers3

Linked