iOS之WKWebView 视频内联自动播放

目的

WKWebView常用来加载html网页，如果碰上h5页面有video标签，想达到内联(非全屏)自动播放，这就需要h5和原生配置才能达到效果。

实现操作

原生iOS

在WKWebView中，在配置类WKWebViewConfiguration中，设置几个属性，如下：

// 初始化配置对象
WKWebViewConfiguration *configuration = [[WKWebViewConfiguration alloc] init];
// 默认是NO，这个值决定了用内嵌HTML5播放视频还是用本地的全屏控制
configuration.allowsInlineMediaPlayback = YES;
// 自动播放, 不需要用户采取任何手势开启播放
if (@available(iOS 10.0, *)) {
    // WKAudiovisualMediaTypeNone 音视频的播放不需要用户手势触发, 即为自动播放
    configuration.mediaTypesRequiringUserActionForPlayback = WKAudiovisualMediaTypeNone;
} else {
    configuration.requiresUserActionForMediaPlayback = NO;
}
       
WKWebView *webView = [[WKWebView alloc] initWithFrame:CGRectZero configuration:configuration];

前端html

在video标签中，

iOS10以下：添加webkit-playsinline属性
iOS10以上：添加playsinline属性

<video width="320" height="240" controls="" webkit-playsinline="true" playsinline="true">
   <source src="https://qson.com.xxx.mp4" type="video/mp4">
</video>

参考：https://www.jianshu.com/p/cc4b3cb42925