youtube videos on iphone phonegap app
I'm sorry to come back to this topic again, but i'm really frustrated!! I've read every resource i've found, googling around the web, but i couldn't come up with a definitive answer to my problem.
Problem description
I'm creating an iphone app with phonegap 1.0. In this app, one tab is dedicated to a rss feed from my youtube channel and i want my users to be able to play these videos, after clicking on a specific entry. Question: is it possible? best solution would be to play the video inside the app, but displaying a thumbnail image and redirecting the user to native youtube app is also acceptable (even though in this case i want the control back to the original app when youtube finishes to play the video).Tried solutions
Searching on the web I found several solutions and people say that these solutions work for them, but none of them work for me!use an "object" tag, i end up with a white screen
<object id="video开发者_如何转开发" width="296" height="100%" data="http://www.youtube.com/v/gDjb9RVMF4c" type="application/x-shockwave-flash"> <param name="allowfullscreen" value="true" /> <param name="src" value="http://www.youtube.com/v/gDjb9RVMF4c" /> </object>using an "embed" tag, i end up with a white screen
<embed src="http://www.youtube.com/v/gDjb9RVMF4c" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="280" height="100%"></embed>i also tried a "video" tag, but as far as i understood, this is still not possible.
I'm really sorry if i missed a solution already written somewhere, but trust me ... i did my homework before askying :-) Thx!!
Here is a nice tutorial Which Saved my Day
http://eisabainyo.net/weblog/2012/01/24/embed-a-youtube-video-iframe-in-phonegap-app/
Also i m posting some codes For a quick Access.
<html>
<head>
<title>YouTube video</title>
<meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0; user-scalable=0;" />
<meta name="apple-mobile-web-app-capable" content="yes" />
<meta name="apple-mobile-web-app-status-bar-style" content="black" />
<script src="phonegap-1.2.0.js"></script>
</head>
<body>
<iframe width="560" height="315" src="http://www.youtube.com/embed/9HDeEbJyNK8" frameborder="0" allowfullscreen></iframe>
</body>
</html>
Then make the following changes in Phonegap.plist
MediaPlaybackRequiresUserAction: NO
AllowInlineMediaPlayback: YES
OpenAllWhitelistURLsInWebView: YES
ExternalHosts
*.youtube.com
*.ytimg.com
Video will play on your Simulator Also.
Apart from using <iframe> ... </iframe> you also need to set the property OpenAllWhitelistURLsInWebView to YES in your PhoneGap.plist. This would show and play the video inside the PhoneGap application itself. It is tried and tested.
You could try embedding the YouTube video as an iframe, I believe that is the recommended way to do it now:
http://apiblog.youtube.com/2010/07/new-way-to-embed-youtube-videos.html
<iframe src="http://www.youtube.com/embed/VIDEO_ID" class="youtube-player" type="text/html" width="640" height="385" frameborder="0">
</iframe>
Here is a component I've end up using in my app. Done with a help of YouTube iFrame API.
加载中,请稍侯......
精彩评论