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

转自：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 () {

     var scheme = 'videohandler://' ;

 

     var videos = document.getElementsByTagName( 'video' );

 

     for ( var i = 0; i < videos.length; i++) {

         videos[i].addEventListener( 'play' , onPlay, false );

         videos[i].addEventListener( 'ended' , onEnded, false );

     }

 

     function onPlay() {

         window.location = scheme + 'video-play' ;

     }

 

     function onEnded() {

         window.location = scheme + 'video-ended' ;

     }

})();

MYWebViewController.m

/**

  *  ビデオハンドラのためのダミーURLスキーム

  */

static NSString * const VideoHandlerScheme = @"videohandler" ;

 

#pragma mark - Lifecycle methods

 

- ( void )viewDidLoad

{

     [ super viewDidLoad];

 

     NSString *htmlString =

     [[ NSBundle mainBundle] myVideoPageHTMLString];

     [ self .webView loadHTMLString:htmlString

                          baseURL:[[ NSBundle mainBundle] bundleURL]];

}

 

#pragma mark - UIWebViewDelegate

 

- ( void )webViewDidFinishLoad:(UIWebView *)webView

{

     NSString *videoHandlerString =

     [[ NSBundle mainBundle] 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); //こちらでイベントがフックできます。

         return NO ;

     }

 

     return YES ;

}

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

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' ;

     }

})();

MYWebViewController.m

#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 ;

}

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