小程序内嵌webview在部分iOS手机上的使用问题

Posted 2021-09-10 穿职业装的程序媛

先来描述一下需求

我们有一个小程序，里面用<web-view>嵌入一个H5页面，H5页面第一个页面是一个登陆页面，有存储和读取本地H5缓存localStorage，判断localStorage中token是否存在，如果存在，则直接进入下一个页面，不存在则留在本页，需要用户执行登陆操作

再来描述一下问题

昨天在休假，同事突然发消息来说，部分ios机型无法记住登陆状态，并且在第二次进入登录页面后，图形验证码无法展示出来，点击按钮，会发送实际请求出去，但是UI样式没有任何变化

问题分解

根据同事的反馈，上面的问题可以分类如下：
（1）无法记住登陆状态的问题，那就是token在第二次进入H5后获取不到
（2）UI阻塞的问题

问题处理

（1）查了资料，token获取不到，是由于部分机型在关闭小程序时自动清空webview的storage缓存所致。要解决的话需要将部分缓存放到小程序这边来。
（2）UI阻塞的问题，先检查了下，H5中获取图形验证码的逻辑是在created生命周期中做的，由于小程序对H5页面做了缓存，created生命周期似乎不会被执行？将created生命周期改为mounted之后，这个问题就解决了

问题延伸

H5发布版本之后，发现小程序这边依然没有更新内容，考虑到小程序将H5页面内容缓存了，就将小程序中<web-view>的src中链接的url改为加了时间戳后缀的url，这样的话每次进入的时候url都不一样，就会重新获取h5资源。处理了之后，设置---通用--存储空间--清理缓存 清除一下缓存，问题果然解决了