Question

我已经将一个youtube嵌入式视频加载到WKWebView： https://www.youtube.com/embed/amtuB-2wGeQ?playsinline=1&autoplay=1

然后在WKWebView didFinishNavigation事件被触发后，我调用：

func webView(_ webView: WKWebView, didFinish navigation: WKNavigation!) {

webView.evaluateJavaScript("document.querySelector('video').play()", completionHandler: { (result, error) in
    if let r = result {
        print(r)
    }
    if let e = error {
        print(e)
    }
  })
}

但是，javascript命令没有被执行，错误和结果都是nil。

当我在Chrome开发者工具中执行相同的javascript命令时，它成功播放视频并通过调用“play（）”和“pause（）”暂停视频。

document.querySelector('video').play()
document.querySelector('video').pause()

我不知道WKWebView里面发生了什么，有什么想法吗？谢谢！

Answer 1

好的，终于弄清楚它为什么不起作用了。

如果你也在为＃34;为什么我的javascript无法在WKWebView＆＃34;中工作，下面是一个很好的方法来找出原因：

<强> 1。打开Safari，首选项 - ＆gt;高级，启用＆＃34;在菜单栏中显示开发人员菜单＆＃34;

<强> 2。在Safari菜单中，开发 - ＆gt;模拟器，连接你的iPhone模拟器

第3。现在你可以在Safari中看到网页html和脚本，在控制台输入区域，尝试运行不同的javascript来查看哪个有效。

<强> 4。然后调用＃34; evaluateJavaScript＆＃34;

它之所以不起作用的原因是嵌入式网页在普通网页浏览器和WKWebView之间的呈现方式不同。我把浏览器脚本作为没有用的例子。

在Safari调试器的帮助下，你可以看到WKWebView里面真正发生了什么，这真的很酷。

希望如果遇到同样的问题会有所帮助。谢谢！

Answer 2

使用UIWebView代替WKWebView，并使用此代码播放YouTube视频。

#pragma mark - Embed Video

- (UIWebView *)embedVideoYoutubeWithURL:(NSString *)urlString andFrame:(CGRect)frame {
    NSString *videoID = [self extractYoutubeVideoID:urlString];

    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.youtube.com/v/%@\" type=\"application/x-shockwave-flash\" \
    width=\"%0.0f\" height=\"%0.0f\"></embed>\
    </body></html>";
    NSString *html = [NSString stringWithFormat:embedHTML, videoID, frame.size.width, frame.size.height];
    UIWebView *videoWebView = [[UIWebView alloc] initWithFrame:frame];
    [videoWebView loadHTMLString:html baseURL:nil];

    return videoWebView;
}

/**
 @see https://devforums.apple.com/message/705665#705665
 extractYoutubeVideoID: works for the following URL formats:

 www.youtube.com/v/VIDEOID
 www.youtube.com?v=VIDEOID
 www.youtube.com/watch?v=WHsHKzYOV2E&feature=youtu.be
 www.youtube.com/watch?v=WHsHKzYOV2E
 youtu.be/KFPtWedl7wg_U923
 www.youtube.com/watch?feature=player_detailpage&v=WHsHKzYOV2E#t=31s
 youtube.googleapis.com/v/WHsHKzYOV2E
*/

- (NSString *)extractYoutubeVideoID:(NSString *)urlYoutube {
    NSString *regexString = @"(?<=v(=|/))([-a-zA-Z0-9_]+)|(?<=youtu.be/)([-a-zA-Z0-9_]+)";
    NSError *error = NULL;
    NSRegularExpression *regex = [NSRegularExpression regularExpressionWithPattern:regexString options:NSRegularExpressionCaseInsensitive error:&error];
    NSRange rangeOfFirstMatch = [regex rangeOfFirstMatchInString:urlYoutube options:0 range:NSMakeRange(0, [urlYoutube length])];

    if(!NSEqualRanges(rangeOfFirstMatch, NSMakeRange(NSNotFound, 0))) {
        NSString *substringForFirstMatch = [urlYoutube substringWithRange:rangeOfFirstMatch];

        return substringForFirstMatch;
    }

    return nil;
}

或使用google的youtube-ios-player-helper pod

WKWebView evaluateJavaScript不适用于youtube嵌入式视频网址

2 个答案: