WKWebview：点击应用程序中的按钮，直接播放嵌入的 Youtube 视频

Question

我的应用程序中有一个播放按钮覆盖在 UIImageView (headerView) 上。用户单击此按钮后，我想直接在此 UIImageView 的框架内显示嵌入的 YoutubeVideo。但是，首先我的 Youtube 视频无法自动播放，其次尺寸太小。我究竟做错了什么？我一直在谷歌搜索所有可能的答案并尝试了一切。还是模拟器相关的问题？这是我的代码，通过点击播放按钮触发：

NSString *videoIdentifier = @"EXaEz0mJXWY";

WKWebView *webView = [[WKWebView alloc] initWithFrame:self.headerView.bounds];
[webView.configuration setAllowsInlineMediaPlayback:YES];
[webView.configuration setMediaTypesRequiringUserActionForPlayback:WKAudiovisualMediaTypeNone];
[self.headerView addSubview:webView];

NSString* embedHTML = [NSString stringWithFormat:@"\
                       <html>\
                            <body style='margin:0px;padding:0px;'>\
                                <script type='text/javascript' src='http://www.youtube.com/iframe_api'></script>\
                                <script type='text/javascript'>\
                                    function onYouTubeIframeAPIReady() \
                                    {\
                                        ytplayer=new YT.Player('playerId',{events:{onReady:onPlayerReady}})\
                                    }\
                                    function onPlayerReady(a)\
                                    { \
                                        a.target.playVideo(); \
                                    }\
                                </script>\
                       <iframe id='playerId' type='text/html' width='%0.0f' height='%0.0f' src='http://www.youtube.com/embed/%@?enablejsapi=1&rel=0&playsinline=1&autoplay=1' frameborder='0'>\
                            </body>\
                       </html>", webView.frame.size.width, webView.frame.size.height, videoIdentifier];

//NSLog(@"Embeddedhtml: %@", embedHTML);
[webView loadHTMLString:embedHTML baseURL:[[NSBundle mainBundle] resourceURL]];

Answer 1

my Youtube Video doesn't auto play

您必须使用 configuration 参数初始化 WKWebView。之后更改配置无效。

WKWebViewConfiguration* config = [[WKWebViewConfiguration alloc] init];
[config setAllowsInlineMediaPlayback:YES];
[config setMediaTypesRequiringUserActionForPlayback:WKAudiovisualMediaTypeNone];
WKWebView *webView = [[WKWebView alloc] initWithFrame:self.headerView.bounds configuration:config];

the size is way too small

WKWebView 使用实际设备像素进行测量，并使用一些启发式方法进行默认缩放，而 UIKit returns 以点为单位的宽度和高度。简单的解决方法是将 viewport meta 添加到页面：

<head>
<meta name='viewport' content='width=device-width, initial-scale=1'>
</head>

WKWebview：点击应用程序中的按钮，直接播放嵌入的 Youtube 视频

WKWebview: On click of button in app, play directly embedded Youtube Video

objective-c

youtube-iframe-api

wkwebview