iOS 17下97% H5页面失真：13年UI测试工程师的兼容性突围

　　我原以为iOS 17只是加了个待机模式，结果点开测试环境的H5页面——字歪着长、按钮悬空、输入框光标在隔壁div里乱跳。不是bug，是渲染层集体叛逃。

　　去年7月份，我们那个给银行做实名核验的H5页面，在iPhone 14 Pro上直接把身份证上传区域压进底部安全区以下。不是盖住，是“消失”。开发说查了WebKit更新日志，苹果没提这个事；我说那你就当它提了——因为97%的H5页面都失真，这不是概率，是判刑书。

　　提交工单那天，孩子把乐高积木倒进键盘缝里，我一边抠塑料块一边点“提交”，三次。第一次卡在验证码，第二次提示“邮箱未验证”，第三次弹出“请先完成企业实名认证”——可我们早三个月就在工信部备案系统里上传过营业执照扫描件，连公章都带反光水印。客服回复：“系统未同步到最新状态哦～”语气像在讲童话。我截图发过去，她回：“亲，建议您刷新一下页面。”

文章配图，仅供参考

　　我骂的不是苹果。苹果改什么我背得比Safari源码还熟：flex-direction默认值改了，input[type=date]现在强行调系统日历，rem计算精度被强制截断到小数点后两位……这些都好办。真正要命的是厂商——就那个你交钱续费两百多、名字带“云”字、logo是蓝绿渐变的那个——他们连个iOS 17兼容性公告都不敢发。只在控制台悄悄加了一行注释：“已知问题，预计Q4修复（不承诺）”。而他们去年Q4修复的，还是iOS 16.4里被砍掉的document.execCommand。

　　上周又碰上一个：用户扫完码，页面顶部导航栏突然缩成一条像素线，返回按钮只剩半颗圆点。我们本地Chrome DevTools一切正常。切到真机——iOS 17.4 Beta 3，直接全屏白屏。抓包发现JS没报错，HTML结构完整，CSS也加载了。最后发现是vendor.css里一行transform: translateZ(0)触发了Safari新版本的层叠上下文暴走。删掉这行，好了。可这行是我们三年前加的，为了解决安卓低端机的闪屏问题。现在它成了iOS上的自杀引信。

　　代理商老张昨儿还微信问我：“你们是不是用了哪家CDN？我客户说打开慢。”我说没用CDN，纯静态托管。他停了三秒，发来个截图——是他自己网站的备案号页面，状态栏写着“审核中（已提交27天）”。底下小字备注：“因管局系统升级，暂不受理跨省接入备案”。我没回他。他去年帮人迁站，迁到一半，服务商跑路，数据备份在另一家“快照服务”里，要另付三百块解锁。他没付，现在客户所有订单页都显示“404 Not Found”——但页面DOM明明存在，只是CSS文件403 Forbidden。他说：“他们说这是防盗链策略，很合理。”

　　我真服气。早年买虚拟主机，2008年，一块钱一个月，送phpMyAdmin和在线文件管理器，还能自己改.htaccess。后来换云服务器，要学安全组、子网、弹性IP。再后来搞容器化，得配Ingress、ConfigMap、Liveness Probe……现在呢？连个H5页面都要靠厂商帮你“兜底兼容”。兜什么底？兜苹果扔下来的碎玻璃？

　　我们测了七家主流托管平台，六家没提供iOS 17设备实时调试通道，剩下一家叫“迅云”的，登录进去全是iPhone 12，连13都没有。我让实习生去问，对方客服说：“亲，13和14的渲染引擎是一样的哦～”——她没说“一样崩”。我截图发群里，同行老李直接回：“我上个月用他们家做适配测试，测完发现他们自己官网的下载按钮，在iOS 17里点击热区偏移了13像素。但他们工单回复是‘经排查，属用户操作习惯差异’。”

　　还有一次，同一个页面，上午十点测正常，下午两点再测，header里的图标全变成方块。不是字体丢失，是SVG内联base64解码失败——只在iOS 17.2之后出现。我们重传了三次资源，最后一次传完，系统提示“检测到重复文件，已跳过覆盖”。但跳过的是旧版。新版压根没存进去。联系客服，等了三天，终于等到自动回复：“尊敬的客户，您的问题已归档至知识库编号KB-8829（iOS兼容性相关）”。没有链接，没有日期，没有更新说明。我就盯着那个KB-8829看，像看一张死亡通知单。

　　我早该想到的。去年初他们把备案服务从“免费”改成“基础版免费，高级审核加收一百五”，理由是“提升合规质量”。结果今年审核周期从五个工作日拉到十九天，驳回理由写“主体信息与域名注册信息不一致”，可我们域名就是从他们平台买的，信息怎么可能不一致？我让运营小姑娘去查whois，发现他们给自己买的域名，whois信息里法人姓名填的是“王建国”，身份证号后四位是“0000”。她问我：“要不要也照着填？”我说别填，填了更过不了。

　　优胜劣汰不是口号。是当你测完第三十七个H5页面，在iOS 17上全部失真，而厂商文档最后一行写着“本平台不对第三方前端框架渲染行为负责”时，你终于承认：他们不是做不到，是不想做。成本太高，ROI太低，不如让用户骂苹果。

　　明年到期就迁走。不选新的“云”，回IDC托管静态资源，自己配Nginx做Gzip压缩和MIME类型校验。实在不行，把H5包进PWA壳里——至少Safari对PWA的渲染策略，三年没变过。

　　对了，昨天整理旧硬盘，翻出2011年测试报告的PDF。当时写的结论是：“Android 2.3.6下，部分WebView存在CSS background-size解析异常，建议降级为background-repeat”。现在看，多清澈啊。那时候崩溃归崩溃，至少知道谁崩的。

（编辑：站长网）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!