通过JavaScript钩子来获取UIWebView视频播放的状态

来源:互联网 发布:红警模型淘宝 编辑:程序博客网 时间:2024/05/16 17:25

转自:http://blog.csdn.net/chenyong05314/article/details/42120917

http://dev.classmethod.jp/client-side/javascript/uiwebview-video-tag/

如有侵犯,请来信oiken@qq.com


场景是这样的

在UIWebview里面有一个视频,点击之后会弹出全屏的系统的视频播放器,这时候你可能需要在全屏的时候,或者在用户看完视频的时候需要做一些事情。

videofullscreenhandler.js

(function () {    var scheme = 'videohandler://';    var videos = document.getElementsByTagName('video');    for (var i = 0; i < videos.length; i++) {        videos[i].addEventListener('webkitbeginfullscreen', onBeginFullScreen, false);        videos[i].addEventListener('webkitendfullscreen', onEndFullScreen, false);    }    function onBeginFullScreen() {        window.location = scheme + 'video-beginfullscreen';    }    function onEndFullScreen() {        window.location = scheme + 'video-endfullscreen';    }})();
在UIWebview的delegate里面做处理

#pragma mark - UIWebViewDelegate- (void)webViewDidFinishLoad:(UIWebView *)webView {     NSString *videoHandlerString = [[NSBundle mainBundle] myVideoFullScreenHandlerJavaScriptString];    if (videoHandlerString) {        [webView stringByEvaluatingJavaScriptFromString:videoHandlerString];    }} - (BOOL)webView:(UIWebView *)webView shouldStartLoadWithRequest:(NSURLRequest *)request navigationType:(UIWebViewNavigationType)navigationType  {        if ([request.URL.scheme isEqualToString:VideoHandlerScheme]) {      NSLog(@"%@", request.URL);//在这里可以获得事件     return NO;    }    return YES;}
---------------------

日本人的文章讲得清楚些:

这个是得到播放和停止的通知

videoplayendhandler.js

(function() {
    varscheme = 'videohandler://';
 
    varvideos = document.getElementsByTagName('video');
 
    for(var i = 0; i < videos.length; i++) {
        videos[i].addEventListener('play', onPlay,false);
        videos[i].addEventListener('ended', onEnded,false);
    }
 
    functiononPlay() {
        window.location = scheme +'video-play';
    }
 
    functiononEnded() {
        window.location = scheme +'video-ended';
    }
})();

MYWebViewController.m

/**
 *  ビデオハンドラのためのダミーURLスキーム
 */
static NSString *constVideoHandlerScheme = @"videohandler";
 
#pragma mark - Lifecycle methods
 
- (void)viewDidLoad
{
    [superviewDidLoad];
 
    NSString*htmlString =
    [[NSBundlemainBundle] myVideoPageHTMLString];
    [self.webView loadHTMLString:htmlString
                         baseURL:[[NSBundlemainBundle] bundleURL]];
}
 
#pragma mark - UIWebViewDelegate
 
- (void)webViewDidFinishLoad:(UIWebView *)webView
{
    NSString*videoHandlerString =
    [[NSBundlemainBundle] myVideoPlayEndHandlerJavaScriptString];
 
    if(videoHandlerString) {
        [webView stringByEvaluatingJavaScriptFromString:videoHandlerString];
    }
}
 
- (BOOL)webView:(UIWebView *)webView shouldStartLoadWithRequest:(NSURLRequest*)request
 navigationType:(UIWebViewNavigationType)navigationType
{   
    if([request.URL.scheme isEqualToString:VideoHandlerScheme]) {
        NSLog(@"%@", request.URL);//こちらでイベントがフックできます。
        returnNO;
    }
 
    returnYES;
}

这个是得到进入和退出全屏播放的通知

videofullscreenhandler.js

(function() {
    varscheme = 'videohandler://';
 
    varvideos = document.getElementsByTagName('video');
 
    for(var i = 0; i < videos.length; i++) {
        videos[i].addEventListener('webkitbeginfullscreen', onBeginFullScreen,false);
        videos[i].addEventListener('webkitendfullscreen', onEndFullScreen,false);
    }
 
    functiononBeginFullScreen() {
        window.location = scheme +'video-beginfullscreen';
    }
 
    functiononEndFullScreen() {
        window.location = scheme +'video-endfullscreen';
    }
})();


MYWebViewController.m

#pragma mark - UIWebViewDelegate
 
- (void)webViewDidFinishLoad:(UIWebView *)webView
{
    NSString*videoHandlerString =
    [[NSBundlemainBundle] myVideoFullScreenHandlerJavaScriptString];
 
    if(videoHandlerString) {
        [webView stringByEvaluatingJavaScriptFromString:videoHandlerString];
    }
}
 
- (BOOL)webView:(UIWebView *)webView shouldStartLoadWithRequest:(NSURLRequest*)request
 navigationType:(UIWebViewNavigationType)navigationType
{   
    if([request.URL.scheme isEqualToString:VideoHandlerScheme]) {
        NSLog(@"%@", request.URL);//こちらでイベントがフックできます。
        returnNO;
    }
 
    returnYES;
}

注意要吧uiwebView的参数allowsInlineMediaPlayback设置为YES,才会自动播放

0 0
原创粉丝点击