记 iOS Safari 上无法使网页全屏展示的问题

今天又是修改 Bug 的一天，其中公司项目内的某个功能需要切换全屏展示的效果，排查后发现其实是 iOS Safari 上无法使用 FullScreen API。

// Safari
element.webkitRequestFullscreen(); // 进入全屏模式
document.webkitExitFullscreen(); // 退出全屏模式

// 其他正常浏览器
element.requestFullscreen();
document.exitFullscreen();

还有一个检查当前是否有全屏元素的 API，在 iOS 上均返回 undefined，网上也有不少关于这个问题的讨论，包括 Apple 论坛 以及 StackOverflow 上都明确比表示不能使用。只能说苹果在 Safari 的兼容性上确实就是大爷，你前端还不能不兼容。最终和产品那边确定后，将内容在窗口内“全屏”展示即可。