前端各类页面资源缓存问题
Nginx静态资源服务器,清除缓存配置
# html文件
location ~ .*\.(html)$ {
add_header Cache-Control "no-cache, no-store";
}
# css/js文件
location ~ .*\.(js|css)?$ {
expires 4h;
access_log off;
}
# 图片资源
location ~ .*\.(gif|jpg|jpeg|png|bmp|swf|flv|mp4|ico)$ {
expires 4h;
access_log off;
}
web页面html文件配置,清除缓存配置
<!-- 用于设定禁止浏览器从本地机的缓存中调阅页面内容 -->
<meta http-equiv="Pragma" content="no-cache">
<!-- Cache-Control指定请求和响应遵循的缓存机制。在请求消息或响应消息中设置Cache-Control并不会修改另一个消息处理过程中的缓存处理过程。 -->
<meta http-equiv="Cache-Control" content="no-cache">
<!-- 可以用于设定网页的到期时间 -->
<meta http-equiv="Expires" content="0">
微信小程序发布新版本,页面清除缓存
微信小程序官方文档
methods: {
// 下载小程序最新版本并重启
downLoadAndUpdate: function(updateManager) {
wx.showLoading();
// 静默下载更新小程序新版本,onUpdateReady:当新版本下载完成回调
updateManager.onUpdateReady(function () {
wx.hideLoading();
// applyUpdate:强制当前小程序应用上新版本并重启
updateManager.applyUpdate();
});
// onUpdateFailed:当新版本下载失败回调
updateManager.onUpdateFailed(function () {
// 下载新版本失败
wx.showModal({
title: "已有新版本",
content: "新版本已经上线了,请删除当前小程序,重新搜索打开",
});
});
},
autoUpdate: function() {
let _this = this;
// 获取小程序更新机制的兼容,由于更新的功能基础库要1.9.90以上版本才支持,所以此处要做低版本的兼容处理
if (wx.canIUse("getUpdateManager")) {
// wx.getUpdateManager接口,可以获知是否有新版本的小程序、新版本是否下载好以及应用新版本的能力,会返回一个UpdateManager实例
const updateManager = wx.getUpdateManager();
// 检查小程序是否有新版本发布,onCheckForUpdate:当小程序向后台请求完新版本信息,会通知这个版本告知检查结果
updateManager.onCheckForUpdate(function (res) {
// 请求完新版本信息的回调
if (res.hasUpdate) {
// 检测到新版本,需要更新,给出提示
wx.showModal({
title: "更新提示",
content: "检测到新版本,是否下载新版本并重启小程序",
success: function (res) {
if (res.confirm) {
// 用户确定更新小程序,小程序下载和更新静默进行
_this.downLoadAndUpdate(updateManager);
} else if (res.cancel) {
// 若用户点击了取消按钮,二次弹窗,强制更新,如果用户选择取消后不需要进行任何操作,则以下内容可忽略
wx.showModal({
title: "提示",
content:
"本次版本更新涉及到新功能的添加,旧版本将无法正常使用",
showCancel: false, // 隐藏取消按钮
confirmText: "确认更新", // 只保留更新按钮
success: function (res) {
if (res.confirm) {
// 下载新版本,重启应用
_this.downLoadAndUpdate(updateManager);
}
},
});
}
},
});
}
});
} else {
// 在最新版本客户端上体验小程序
wx.showModal({
title: "提示",
content:
"当前微信版本过低,无法使用该功能,请升级到最新微信版本后重试",
});
}
},
},
onLaunch: function() {
this.autoUpdate();
}
内嵌web-view缓存问题
src = `https://XXX.com?timestamp=${new Date().getTime()}`
<web-view src='{{src}}'></web-view>