iOS iFrame库嵌入YouTube视频在11-13版本模拟器播放后消失问题

问题复现条件 #

• 嵌入方式：使用iOS iFrame方案加载YouTube视频
• 异常系统：iOS 11.0 ~ iOS 13.7全版本模拟器，已验证覆盖iOS 11.4、iOS 12.0、iOS 12.4、iOS 13.7
• 开发环境：Xcode 11.7、Xcode 12.5运行均稳定复现
• 对照结论：真实iOS设备无该异常，仅模拟器存在问题

根因说明 #

该问题属于iOS模拟器WebKit渲染框架的适配缺陷：
iOS 11到13版本的x86/arm架构模拟器，对视频播放的全屏切换、画中画触发逻辑做了简化适配，YouTube iFrame播放器默认的播放触发逻辑会调用模拟器存在兼容问题的视频渲染接口，导致视频图层被错误回收消失。真机的WebKit内核为完整适配版本，不存在该兼容问题。

修复方案 #

方案1：配置iFrame内联播放参数 #

在YouTube视频的嵌入链接中添加playsinline=1参数，强制视频在iFrame内部播放，避免触发全屏切换逻辑：

<iframe 
  width="自定义宽度" 
  height="自定义高度" 
  src="https://www.youtube.com/embed/你的视频ID?playsinline=1" 
  frameborder="0"
  allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture"
></iframe>

方案2：配置WKWebView播放属性 #

如果是使用WKWebView加载iFrame内容，需要在初始化时开启内联播放配置：

Objective-C 代码

WKWebViewConfiguration *webConfig = [[WKWebViewConfiguration alloc] init];
// 开启内联播放支持
webConfig.allowsInlineMediaPlayback = YES;
// 适配iOS 11+播放权限配置
if (@available(iOS 11.0, *)) {
    webConfig.mediaTypesRequiringUserActionForPlayback = WKAudiovisualMediaTypeNone;
}
WKWebView *webView = [[WKWebView alloc] initWithFrame:CGRectZero configuration:webConfig];

Swift 代码

let webConfig = WKWebViewConfiguration()
webConfig.allowsInlineMediaPlayback = true
if #available(iOS 11.0, *) {
    webConfig.mediaTypesRequiringUserActionForPlayback = []
}
let webView = WKWebView(frame: .zero, configuration: webConfig)

补充说明 #

该问题仅影响模拟器调试场景，不会触发热线上的真机用户，若无需在模拟器调试视频播放逻辑，也可以选择忽略该异常。

内容的提问来源于stack exchange，提问作者Ofree Weisman