iOS 中微信端打开项目发现图标显示成一个个方框;切换页面也同样没显示。但是在Android端、IOS的浏览器显示正常
【借用下网上的效果】
一开始的思考方向
一开始怀疑是字体图标的导入出错了,所以重新导入,但是仍然没解决。因为网上也很多说字体图标文件导入顺序等等问题影响。但这并没有解决我的问题。
发现错误的原因
后来又重新思考为什么偏偏是 ios&&微信端 才出问题,意识到我的微信端为了做微信授权登录跳转了一遍地址。会不会是这一次跳转引起的。所以我决定先不跳转地址,结果真的就正常了。
出错的原理
后来翻阅资料终于找到了出错的真相,IOS的微信端,是因为缓存机制引起的。
// 具体原因:刚进入页面会检测微信环境的话会发生一次跳转(获取微信用户信息),在未跳转前,浏览器正在下载图标文件;而跳转使得
// 这些文件下载终止导致不完整。再跳转后想下载这些文件但因为浏览器缓存机制问题所以复用那些不完整的文件.
解決方案
- 微信登录不跳转,右后台静默完成(推荐);
- window.onload()方法中执行跳转,因为此时文件都下载完毕
- 延迟跳转(在用)
最后祝福大家生活愉快