记录iOS 17.4.1 Safari 本地视频无法正常显示的2个问题
原文中文，约1400字，阅读约需4分钟。
📝
内容提要
近期发现Safari在本地视频播放存在问题，包括路由切换时视频中断和视频元素不随宽高变化而变化。已向苹果官方反馈，目前尚无有效解决方法。
🔎
延伸解读
问题影响范围与设备限制
文章明确指出，这两个Safari本地视频播放问题仅出现在iPhone和iPad上，Mac设备暂时没有发现。这意味着移动端用户和开发者需要特别关注，尤其是依赖摄像头捕捉或动态调整视频尺寸的应用场景。如果你主要面向桌面端，可能不会遇到这些故障。
临时规避方案的实际代价
针对路由切换导致摄像头中断，作者将history模式改为hash模式来规避；针对视频内容不随宽高变化，采用block->none->flex的强制重渲染。这些方案虽然能暂时绕过问题，但可能带来URL风格改变、额外渲染开销或代码可维护性下降等副作用，开发者需权衡是否采用。
官方反馈进展与复现难点
作者已向苹果官方反馈两个问题，但截至文章发布，问题一在beta版就存在且正式版未修复，问题二官方反馈无法复现。作者发现iframe中无法复现，因此改用GitHub Pages供苹果测试。由于时差，沟通效率较低，修复进展缓慢，读者需有等待心理准备。
❓
Q&A
Safari在本地视频播放中存在哪些问题？
Safari在本地视频播放中存在两个主要问题：路由切换时视频中断和视频元素不随宽高变化而变化。
如何解决Safari路由切换时视频中断的问题？
解决方案是将history模式改为hash模式。
视频元素不随video标签宽高变化的触发条件是什么？
触发条件包括视频播放本地摄像头、父级display从block变为flex，以及video标签附近有合适尺寸的img标签。
目前针对Safari视频播放问题，苹果官方的反馈是什么？
苹果官方反馈目前无法复现这些问题，并未提供有效解决方案。
如何强行重新渲染视频元素以解决显示问题？
可以将原先的block->flex改为block->none->flex进行强行重新渲染。
在iOS 17.4.1上如何复现Safari视频播放问题？
在iPhone上打开特定链接，允许摄像头访问，等待相机画面出现后，单击摄像机源以更改视频大小。
🏷️
