php网站微信清除缓存,vue项目微信端清理缓存问题解决

vue为单页面前端框架，清理缓存，常规的方式是添加html头部meta，如果逻辑里面是需要使用缓存的，这种方式不建议使用，代码片段如下：

......

第二种方式就是在文件名后添加随机数，可以在路由里面进行设置，但如果路由是需要带参数的，会有影响

const routes = [

{ path: '/', redirect: '/userInfo'},

{ path: '/home',component:home},

{ path: '/login?123232', component: login, meta: {title: '登录'}},

{ path: '/userInfo', component: userInfo, meta: { requiresAuth: true, title: '账号管理' }},

{ path: '/toggleIdentity',component:toggleIdentity, meta: { requiresAuth: true, title: '身份切换' }},

{ path: '/myTracks', component: myTracks, meta: { requiresAuth: true, title: '我的足迹' }},

// { path: '/applicationCenter', component: applicationCenter, meta: { requiresAuth: true, title: '应用中心'}},

{ path: '/topicList', component: topicList, meta: { requiresAuth: true, title: '话题探讨' }},

{ path: '/topicList/:id', component: topicDetail, meta: {title: '话题详情'}},

{ path: '/activityList', component: activityList, meta: { requiresAuth: true, title: '精彩活动' }},

{ path: '/interactionList', component: InteractionList, meta: { requiresAuth: true, title: '家校互动' }},

{ path: '/officeMsg', component: OfficeMsg , meta: { requiresAuth: true, title: '办公短信' }},

{ path: '/msgInfo/:messageId/:type/:smsMessageType/:keyTime', component: MsgInfo, meta: { requiresAuth: true, title: '详情' } },

{ path: '/sendMessage', component: SendMessage , meta: { requiresAuth: true, title: '发消息' }},

{ path: '/msgStatusReport/:messageId/:msgType/:keyTime', component: MsgStatusReport , meta: { requiresAuth: true, title: '状态报告' }},

{ path: '/commentList',component:commentList},

{ path: '/DPlayer/:id',component:DPlayer},

{ path: '/application', component: Application , meta: { requiresAuth: true, title: '应用' }}

];

第三种就是在vue项目里面进行代码添加后缀，以随机数的形式，进入。原理上和第二种方式相似，url地址变化，就不会有上次的缓存了。参考地址https://blog.csdn.net/yelin042/article/details/79763061

import store from './vuex/store'

import cookie from './libs/cookie'

// 路由预先判断

router.beforeEach((to, from, next) => {

// 首先判断是否已有用户登录信息userInfo

if (store.state.user.info) {

next()

} else {

// 强制给index.html 加上时间戳

if (document.URL.indexOf('index.html?t=') < 0) {

let timestamp = (new Date()).valueOf()

window.location.href = '/index.html?t=' + timestamp + '#' + to.fullPath

}

let ua = window.navigator.userAgent.toLowerCase()

// 判断微信客户端

if (ua.indexOf('micromessenger') > 1) {

// 首先获取授权cookie authid

let authid = cookie.get('authid')

if (authid) {

Vue.http.post('/index.php/weixin/Auth/auth', {authid: authid}).then((response) => {

let res = response.data

if (res.code === '04') {

cookie.del('authid')

window.location.href = '404.html'

} else if (res.code === '01') {

store.dispatch('setUserInfo', res.userInfo)

next()

}

}, (response) => {})

} else {

// 强制跳转，授权登录，并设置cookie

window.location.href = '/index.php/weixin/Auth/redirect?redirect=' + encodeURIComponent(document.URL)

}

} else {

// 非微信客户端

Vue.http.post('/index.php/weixin/Auth/auth', {openid: cookie.get('openid')}).then((response) => {

let res = response.data

if (res.code === '04') {

cookie.del('authid')

next()

// window.location.href = '/index.php/weixin/Auth/redirect?redirect=' + encodeURIComponent(document.URL)

} else if (res.code === '01') {

store.dispatch('setUserInfo', res.userInfo)

next()

}

}, (response) => {})

}

}

})