微信小程序H5页面缓存问题处理

微信小程序会缓存H5页面，导致页面升级之后不能及时刷新。

这种情况通过配置nginx不缓存静态页面无法影响到小程序缓存。

假设H5请求地址是 https://xxx/h5/

用户进入小程序之后生成一个数字，请求H5时把数字拼接到URL后缀即可。

例： https://xxx/h5/222/

微信小程序里面的本地缓存

wx.setStorage（wx.setStorageSync）、wx.getStorage（wx.getStorageSync）、wx.clearStorage（wx.clearStorageSync）

localStorage ：是永久存储，以用户维度隔离，同一台设备上，A 用户无法读取到 B 用户的数据。

在小程序中无 Sync 结尾的本地缓存中，都为 异步缓存

wx.setStorage（object）

参数object说明

控制台

表示储存成功

wx.getStorage（object）

示例

这个key值就是先前setStorage的命名key，证明指定获取那个缓存中的数据

wx.clearStorage(object)

清理本地数据缓存

将之前储存在Storage中的数据清空。适用于退出登录后登录信息的清除

wx.getStorageInfo(object)

异步获取当前storage的相关信息（ 当前小程序里面所有的storage的储存信息 ）

参数说明

执行结果

wx.removeStorage(OBJECT)

从本地缓存中异步移除指定 key值

获取当前data值时将报错undefined

执行结果

小程序webview的页面缓存会影响开发中的调试和生产中的使用

1.页面缓存由浏览器缓存引起，那么可以通过设置来修改浏览器缓存。

可以通过nginx设置cache-control 来关闭浏览器缓存

2.由于是单页面应用，所以只需要对index.html设置即可。

对index.html中的资源地址，也会存在缓存，可以通过webpack构建时加入hash值解决。

---