微信 history.back 时候的 缓存问题处理, 最近搞得我很头疼

最近在写微信的项目, 遇到一个很坑爹的问题, 为了更好的用户体验,我希望在项目中

  1. 点击返回按键的时候能返回到 某一个指定的页面
  2. 返回某些页面的时候页面不缓存
    • jsp 页面缓存
    • src 请求缓存
    • ajax 请求缓存

主要操作的 api 有:

  1. popstate,pushstate , history.back()
  2. pageshow, pagehide

经过测试, 在 pc 端(模拟器)和 移动端(微信) 很多时候 history 的 表现方式是不一样的。

1. 点击返回按键的时候能返回到 某一个指定的页面

之前写的文章

2. 返回页面的时候 页面不缓存

不知到为什么 meta 三种数据清除方式没有生效
难道是 location.href 的时候才会生效?

主要通过 如下代码来清除 ios 和 android 缓存

2.1 jsp 页面返回清除缓存

<%
response.setHeader("Cache-Control","no-store");
response.setHeader("Pragrma","no-cache");
response.setDateHeader("Expires",0);
%>


上面的 jsp 代码对页面的 src 请求图片生效了, 但是 jsp 中的其他变量数据没有生效, 配合下面的 pageshow 代码 jsp 页面就 ok 了

通用的返回清除缓存方式

  var isPageHide = false;
  window.addEventListener('pageshow', function() {
      if(isPageHide) {
          window.location.reload();//自己重新刷新,这一步相当于模拟了跳转
      }
  });
  window.addEventListener('pagehide', function() {
      isPageHide = true;
  });

添加时间戳 进行页面更新的时候, ios 中的数据还是没有更新, android 的中的 没有问题, 添加 pageshow 代码就ok 了

添加时间戳 返回的时候清除缓存

$.ajax({
	url: '...?timestamp='+ Date.now()
})

你可能感兴趣的:(javascript,wechat)