Playing youtube video in UIWebView only using iFrame - ios

I'm trying to play youtube videos on my UIWebView using <iframe> tag with below code -
NSString *html = #"\
<html><head>\
<style type=\"text/css\">\
body { background-color: transparent;\
color: white; \
}\
</style>\
</head><body style=\"margin:0\">\
<iframe class=\"youtube-player\" width=\"300\" height=\"300\" src=\"http://www.youtube.com/embed/efRNKkmWdc0\" frameborder=\"0\" allowfullscreen=\"true\"></iframe>\
</body></html>";
UIWebView *videoView = [[UIWebView alloc] initWithFrame:CGRectMake(0.0, 0.0, 320.0, 460.0)];
[videoView loadHTMLString:html baseURL:nil];
Its working fine.
But, i need to play this on webview itself not using iPhone default player. How do i restrict this to play on UIWebView only. I was defined the iframe player class as class=\"youtube-player\" also. But, its taking iPhone's default player.
Any idea appreciated!

Try using this code to initialize the iframe player:
player = new YT.Player('player', {
height: '100%',
width: '100%',
videoId: 'M7lc1UVf-VE',
playerVars: {
'controls' : '0',
'playsinline' : 1
}
});
Note the "playsinline" parameter being set to 1. In the containing view, initialize the UIWebView with this parameter:
webView.allowsInlineMediaPlayback = YES;
One thing I've noticed is that you cannot set the baseURL parameter to NULL; it has to be an NSString. Here's an example that loads an HTML file named iframe-player.html containing the required HTML and JavaScript code:
NSString *path = [[NSBundle mainBundle] pathForResource: #"iframe-player" ofType: #"html"];
NSString *embedHTML = [NSString stringWithContentsOfFile: path
encoding:NSUTF8StringEncoding
error: &error];
[webView loadHTMLString:embedHTML baseURL:[NSURL URLWithString:#"about:blank"]];

Not possible. Web videos are always in full screen on iPhone.
The only possibility to play video in your app is to use MPMoviePlayer and add the view to your screen. But then you need to have a direct link to the video file

Related

How to play video linked in Blob URL?

I have a video linked in video tag like this: src="blob:http://www.domain.com/884f-ff99697a3a91"
So are there any ways for me to play the video in iOS app? I tried to build a html5 page with video tag and use a webView to load the page but nothing happens.
Thank you in advance!
No, a Blob URL acts as a pseudo protocol to enable using Blobs as if they where byte-streams. They would not make sense in any other context as the original Blob they're referring to would not be available.
The temporary internal link to the Blob (or File) becomes invalid once the original document creating it is unloaded (or the URL revoked).
You would need a way to load the original video source directly, which would either require an user interaction if from a local file system, or the video must exist online and be referable via an ordinary URL.
- (void)videoThumb:(NSString *)urlString frame:(CGRect)frame {
NSString *embedHTML = #"\
<html><head>\
<style type=\"text/css\">\
body {\
background-color: transparent;
color: white;
}\
</style>\
</head><body style=\"margin:0\">\
<embed id=\"yt\" src=\"%#\" type=\"application/x-shockwave-flash\" \
width=\"%0.0f\" height=\"%0.0f\"></embed>\
</body></html>";
NSString *html = [NSString stringWithFormat:embedHTML, urlString, frame.size.width,frame.size.height];
[webView loadHTMLString:html baseURL:nil];
[self.view addSubview:webView];
[webView release];
}

_itemFailedToPlayToEnd when playing local mp4 using UIWebView

I am trying to play a local mp4 video using html5 video as follows.
<video id="media" controls="true" preload="auto" src="xxxx.mp4">
</video>
but its does not play. I get following error
_itemFailedToPlayToEnd: {
kind = 1;
new = 2;
old = 0;
}
Any suggestion for playing video in UIWebView will be appreciated.
What you can do, so that you aren't hosting the video on your website is post the video to youtube, and embed it into your website so that way all you do is copy and paste the embedded code into your html...or you can do this:
- (void)viewDidLoad {
[super viewDidLoad];
NSString *embedHTML = #"\
<html><head>\
<style type=\"text/css\">\
body {\
background-color: transparent;\
color: white;\
}\
</style>\
</head><body style=\"margin:0\">\
<embed id=\"yt\" src=\"http://www.businessfactors.de/bfcms/images/stories/videos/defaultscreenvideos.mp4\" type=\"application/x-shockwave-mp4\" \
width=\"%0.0f\" height=\"%0.0f\"></embed>\
</body></html>";
webView = [[UIWebView alloc] initWithFrame:CGRectMake(0.0, 0.0, 320.0, 412.0)];
[webView setOpaque:NO];
NSString *html = [NSString stringWithFormat:embedHTML, webView.frame.size.width, webView.frame.size.height];
[webView loadHTMLString:html baseURL:nil];
[self.view addSubview:webView];
}
Try This, Should do the trick

how to control Youtube video through IBAction

I am playing video in my app and I want to control video like full screen and play functions by my own IBAction is it possible?
my code is
- (void)embedYouTube:(NSString *)urlString frame:(CGRect)frame {
NSString *embedHTML = #"\<html><head>\<style type=\"text/css\">\
body {\
background-color: transparent;\
color: white;\
}\
</style>\</head><body style=\"margin:0\">\
<embed id=\"yt\" src=\"%#\" type=\"application/x-shockwave-flash\" \
width=\"%0.0f\" height=\"%0.0f\"></embed>\
</body></html>";
NSString *html = [NSString stringWithFormat:embedHTML, urlString, frame.size.width, frame.size.height];
webView = [[UIWebView alloc] initWithFrame:frame];
[webView loadHTMLString:html baseURL:nil];
[self.view addSubview:webView];
[self.view bringSubviewToFront:tvImg];
[self.view bringSubviewToFront:btnBack];
[self.view bringSubviewToFront:btnPlay];
[self.view bringSubviewToFront:btnVol];
[self.view bringSubviewToFront:btnFullScreen];
[self.view bringSubviewToFront:btnFav];
}
and i am calling it in viewDidLoad
If you are using it in a UIWebView you can try to send a javascript Command to the UIWebView(but i'm not sure which to use or if youtube does even support it)
Unless you are loading the Video in another way there is no other option
Send this is to The UIWebView when clicking The Button:
var myPlayer = document.getElementById('playerid');
myPlayer.stopVideo();

iOS6 play videos with webView (works in iOS5)

I used to play videos inside my iOS app using uiwebviews with the following code:
NSString *embedHTML = #"\
<html><head>\
<style type=\"text/css\">\
body {\
background-color: transparent;\
color: white;\
}\
</style>\
</head><body style=\"margin:0\">\
<embed id=\"yt\" src=\"%#\" type=\"application/x-shockwave-flash\" \
width=\"%0.0f\" height=\"%0.0f\"></embed>\
</body></html>";
NSString *html = [NSString stringWithFormat:embedHTML, urlToOpen, frame.size.width, frame.size.height];
self.videoView = [[UIWebView alloc] initWithFrame:frame];
[videoView loadHTMLString:html baseURL:nil];
[self.videoView setDelegate:self];
[self.view addSubview:videoView];
[videoView release];
With iOS6 it doesn't work.
Has anybody find any solution to play youtube videos compiling with iOS6?
Thanks
Ok, Here is the answer.
Use http://www.youtube.com/v/XXXXXXX
instead of http://www.youtube.com/watch?v=XXXXXXX.
find it here:
iOS - UIWebView not working due to parsing error
I just tested with iOS6 Simulator and iOS5 device, if you use the new embed code (iframe) then it works.
<iframe class="youtube-player" type="text/html" width="320" height="200" src="http://www.youtube.com/embed/VIDEOID" frameborder="0"></iframe>
Only downside is that the iframe contains a lot of dom elements that are downloaded.
Replace your code with the follow
NSString *embedHTML = #"\
<html><head>\
<style type=\"text/css\">\
body {\
background-color: transparent;\
color: white;\
}\
</style>\
</head><body style=\"margin:0\">\
<iframe title=\"YouTube Video\" class=\"youtube-player\" type=\"text/html\"\
width=\"%0.0f\" height=\"%0.0f\" src=\"%#\"\
frameborder=\"0\" allowFullScreen ></iframe>";
NSString *urlToOpen = #"http://www.youtube.com/embed/u1zgFlCw8Aw?autoplay=1";
NSString *html = [NSString stringWithFormat:embedHTML, urlToOpen, frame.size.width, frame.size.height];
self.videoView = [[UIWebView alloc] initWithFrame:frame];
[videoView loadHTMLString:html baseURL:nil];
[self.videoView setDelegate:self];
[self.view addSubview:videoView];
[videoView release];
As Youtube has discard the webview video and introduce iframe so You have to use this html for ios 6 and for ios 5 use the older one.
And remember that your url link for youtube video is should like
http://www.youtube.com/embed/video_Id?autoplay=1
where you can replace video_Id with your own video id.
If you use the embed in Phonegap you have set OpenAllWhitelistURLsInWebView to YES in Phonegap settings
Youtube with Webviews in iOS6 requires enabled cookies in the WebView. In order to do that, you need to add the following instruction in the AppDelegate:
- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions
{
[[NSHTTPCookieStorage sharedHTTPCookieStorage] setCookieAcceptPolicy:NSHTTPCookieAcceptPolicyAlways];
...
}
I tried this in simulator
[_webview loadRequest:[NSURLRequest requestWithURL:[NSURL URLWithString:#"https://www.youtube.com/embed/b22cH2sfVcc"]]];
and it works
directly provide the embed src of youtube video to web view and it works.

Playing YouTube on iOS 5 without leaving application

My application needs to support to play YouTube video and shows the first frame as Thumbnail. Since we need to keep our application running about playing video, therefore, in iOS 4.3.5, we used a method to embed a HTML link in a WebView. It works fine to play Video with YouTube player and it would return to my application upon finished.
Unfortunately, this method does not work. Any suggestion ?
My previous method is as follows:
NSString* embedHTML = #"body {background-color: transparent;color: white;}
";
NSString* html = [NSString stringWithFormat:embedHTML, url, frame.size.width, frame.size.height];
NSLog(#"HTML = %#", html);
UIWebView* videoView = [[UIWebView alloc] initWithFrame:frame];
videoView.backgroundColor = [UIColor clearColor];
[videoView loadHTMLString:html baseURL:nil];
[_supview addSubview:videoView];
[videoView release];
Use this:
- (void)embedYouTube:(NSString*)url frame:(CGRect)frame {
NSString* embedHTML = #"\
<html><head>\
<style type=\"text/css\">\
body {\
background-color: transparent;\
color: white;\
}\
</style>\
</head><body style=\"margin:0px\">\
<embed id=\"yt\" src=\"%#\" type=\"application/x-shockwave-flash\" \
width=\"%0.0f\" height=\"%0.0f\"></embed>\
</body></html>";
NSString* html = [NSString stringWithFormat:embedHTML, url,
frame.size.width, frame.size.height];
NSLog(#"%#",html);
if(youtube == nil) {
youtube = [[UIWebView alloc] initWithFrame:frame];
[self.view addSubview:youtube];
}
[youtube loadHTMLString:html baseURL:nil];
[youtube setUserInteractionEnabled:YES];
}
For iOS 5 or new apps use official syntax, see the link below it works very fine
http://apiblog.youtube.com/2010/07/new-way-to-embed-youtube-videos.html

Resources