單頁面應用總是存在緩存問題,特別是在微信端,更新頁面之后訪問的還是老頁面,緩存的問題是因為用戶訪問的腳本地址並沒有改變,瀏覽器就會讀取原來的腳本
網上有幾種解決辦法,首先列舉一下
1.加meta,禁止頁面緩存
如果有些功能需要頁面緩存的話這種方式就不適用,而且禁止緩存之后用戶的請求的次數就會增多,流量消耗過快。
2.手動改變腳本地址,webpack打包的時候加一個版本號,這樣每次打包的腳本路徑就不同,瀏覽器就會重新讀取腳本,解決緩存問題,上圖說話
在config下的index.js中加一個version變量,然后修改assetsSubDirectory,然后打包之后就會是下圖這種
這種測試過,有一個問題,就是項目中css中如果有使用背景圖,背景圖就會找不到,圖片路徑有問題,目前我沒有辦法解決,如果有大佬能解決,可以留言,多謝
3.加時間戳的方法,html頁面加載腳本的時候給腳本后面加一個時間戳,原理和第二種一樣,改變路徑。直接上圖
按照圖上面加一個hash屬性,獲取時間戳
這是沒加之前的
這是加過之后的