白屏问题涉及三个端,H5、安卓、IOS、所以出现白屏问题不能直接定位是H5的问题。
- 之前开发内嵌H5的时候就出现了一个问题,在三星手机上面打开app内嵌的H5页面,在切换app到后台然后在打开app就会出现白屏。像这种情况就是因为三星手机的WebView的问题需要和APP对接。
- 如果是H5的问题,可以通过一些远程上报错误的的tool管理和修复。如Sentry Or 神策 之内的。
- 然后就是通过APP帮你打一个debugger包,在本地进行调试。app内的H5也是可以在浏览器上面抓到的。
安卓和IOS开发中遇到的兼容性问题
- location.replace 安卓会有兼容性问题。不往浏览器添加路由栈。
if(history.replaceState){
history.replaceState(null, document.title, url); history.go(0);
} else {
location.replace(url);
}
}
2、cookie 问题
在IOS中存储cookie或者更新或者覆盖、会有问题这个地方。可以让APP往window上面挂载一个方法,然后通过方法的方式获取。
const { BossJobApp } = window
// Not IOS
if (!isIOS) {
return getCookie(refreshToken)
}
//IOS
try {
if (BossJobApp && BossJobApp?.getRefreshToken) {
const refreshToken = BossJobApp?.getRefreshToken()
if (refreshToken && refreshToken?.length) {
setCookie('refreshToken', refreshToken, false)
return refreshToken
} else {
return getCookie(refreshToken)
}
} else {
return getCookie(refreshToken)
}
} catch (error) {
return getCookie(refreshToken)
}
}
3、IOS关闭掉WebView之后还是会继续执行js代码,也就是说WebView关闭更像是一种隐藏。所以如果你有轮询之类的,需要在用户关闭web view的时候让IOS通知你一下。