一个关于微信SPA页面webview的缓存问题

查看更多文章: https://alili.tech

一个低级问题

因为公司微信项目用的是angular路由的单页面应用.所以切换页面是基于hash值做到的.

我们遇到了一个问题,每一次部署新的网页代码到服务器上.
在Android微信客户端,总是要过好多天.甚至要重新卸载微信.重新打开页面之后,才会更新页面.(iPhone上却没有这个问题)

如果版本正式上线之后,遇到了紧急bug.那将是一场灾难啊.

解决办法

给url加上时间戳

首先想到的解决办法是,在网址后面加上时间戳,就像是这样:

xxx.com#/home/test/page/?t=(我是时间戳)

可是页面在安卓客户端却没有任何改善

这是为什么,是微信客户端的bug吗?

并不是,是时间戳加错了位置.

我们换一种方式.

xxx.com?t=(我是时间戳)#/home/test/page/

这个时候,我们发现安卓微信客户端的缓存问题迎刃而解了.

牵引出一个问题

为什么我们的时间戳放在最后面,浏览器取了缓存的代码.

首先我们看看URL的格式:

protocol :// hostname[:port] / path / [;parameters][?query]#hash

我们的时间戳用的是 “?” 分隔符,也就是query参数.

第一次,我们把query参数放在了"#"后面.于是我们的时间戳,也就是所谓的query参数,成了hash值.

不管是什么符号,什么字符,只要是放在了"#"后面的,都是hash值.

因为HTTP请求并不包括hash,所以不管我们怎么修改#号后面的时间戳,服务器接收到的请求,都是一样的.

重要的事情说三遍:

• HTTP请求不包括hash
• HTTP请求不包括hash
• HTTP请求不包括hash

---

公众号“ Alili丶前端大爆炸”，关注后提供海量学习资料