iOS WebView 对 H5 视频播放的控制

各大厂商在媒体播放这块一般管控都比较严格，所以经常会出现一些非常规的行为，比如 iOS 唤出全屏，比如自动播放，比如画中画(PiP) 无法唤起等问题。

在 iOS 中，我们各个 App 引入的 Webview 容器都是官方推荐的 WKWebView ，我们需要它来加载我们的网页，从而完成部分功能。但是处于安全隐私的考虑，它默认的一些属性是并不开启的。其中我们比较关注的视频播放有这么几项：

applicationNameForUserAgent 用于设置 WebView user agent
allowsInlineMediaPlayback 是使用h5的视频播放器在线播放, 还是使用原生播放器全屏播放
mediaTypesRequiringUserActionForPlayback 允许哪些媒体格式需要用户手动触发播放
allowsAirPlayForMediaPlayback 是否允许 Apple 的 Airplay
allowsPictureInPictureMediaPlayback 是否允许画中画模式(PiP)

在 Swift 中，我们可以简单的初始化一个 webview

struct WebView: UIViewRepresentable {
    let request: URLRequest
    var config = WKWebViewConfiguration()
    func makeUIView(context: Context) -> WKWebView {
	    // edit your config
        config.applicationNameForUserAgent = "Mozilla/5.0 (iPhone; CPU iPhone OS 13_2_3 like Mac OS X) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/13.0.3 Mobile/15E148 Safari/604.1 core_player_wm/0.1.1"
        config.allowsInlineMediaPlayback = true
        config.allowsAirPlayForMediaPlayback = true
        config.allowsPictureInPictureMediaPlayback = true
        config.mediaTypesRequiringUserActionForPlayback = .all
        return WKWebView(frame: .zero, configuration: config)
    }
    
    func updateUIView(_ uiView: WKWebView, context: Context) {
        uiView.load(request)
    }
}

struct WebVIew_Previews: PreviewProvider {
    static var previews: some View {
        WebView(request: URLRequest(url: URL(string: "https://swift-webview-video.now.sh/")!))
    }
}

Code Source

如果你对 Swift 不是很了解，你可以直接使用

swift-webview-video

直接 clone 代码，然后运行它，它提供了一个属性对比，可以查看属性开启或者不开枪的效果是怎样的。

运行效果:

扩展阅读