页面缓存规则

2019独角兽企业重金招聘Python工程师标准>>>

页面部署到服务器后需做到按F5刷新就能保持页面为最新文件,无需手动清除缓存.

总体思路,通过修改url地址来防止页面缓存.具体规则如下:

1.引入的css

[推荐]方法一

1.css路径配置到config.js

"pqgridC":ipconfig.address.spxc+"tools/ParamQuery-grid-v2.2.0/themes/Office/pqgrid.css?v="+cacheVersion ,

2.通过统一资源导入在页面里导入css

var headHref2=".."; 
var headHref="../"; 
//获取缓存版本号
if(typeof(cacheVersion)=="undefined"){
	$.ajax({
		type : "GET",
		url : headHref+'js/cache-version.js',
		dataType: "script",
		async:false
	});
}
if(typeof(cacheVersion)=="undefined"){
	var cacheVersion="";
}
//获取配置文件信息,此操作非必须
var ipconfig=null;
	$.ajax({
		url : headHref+'config/data?fileName=ip.json&v='+cacheVersion,
		dataType:"json",
		type : "POST",
		async: false,
		success : function(data) {
			ipconfig=data;
		}
	});
//所有要引入的js,iframe写在获取缓存版本号后
if(typeof(sc)=="undefined"){
	$.ajax({
		type : "GET",
		url : headHref+"js/config.js?v="+cacheVersion,
		dataType: "script",
		data:ipconfig,
		cache:true,
		async:false
	});
	var sc = new sourceController();
	sc.setRoot(headHref2);
		sc.css = [  sourcePath.pqgridMinC,sourcePath.pqgridC,sourcePath.webuploaderC,sourcePath.layerC];
		sc.script = [
		// sourcePath.WdatePicker,
		sourcePath.jqueryForm,
		sourcePath.layer,
		sourcePath.jqueryUi,
		sourcePath.pqgrid,
		sourcePath.localize,
		// sourcePath.init,
		sourcePath.tmInit,
		// sourcePath.fenyeInit,
		sourcePath.objToHtmlUtil,
		sourcePath.testLogin,
		sourcePath.es5Shim,
		sourcePath.es5Sham,
		sourcePath.json3,
		sourcePath.template,
		sourcePath.DateUtil];
		var iframePage=true;
		//获取URL参数方法  参数必须在&后面
		 var reg = new RegExp('(^|&)' + 'pageLoadType' + '=([^&]*)(&|$)', 'i');
		 var r = window.location.search.substr(1).match(reg);
		 if (r != null) {
			 if("iframe"!= unescape(r[2])){
				iframePage=false;

			 };
		 }
		if(iframePage) // 根据需要额外添加的文件
		{
			 sc.addCss("../css/common.css"); // 额外添加的css文件，必须在加载资源之前加入
			 sc.addCss(ipconfig.address.spxc+"css/index.css?v="+cacheVersion);
//	     sc.addScript("javaScript/index.js"); // 额外添加的js文件，必须在加载资源之前加入
		}
		sc.setCallBack(function(){
				var mokuai=getQueryString("mokuai");
						if(mokuai!=null){
					$("#"+mokuai+" a")[0].click();
			   }
		});
		sc.addSource(); // 加载常用的js和css文件
	}else{
		$(function(){
		//不是第一次加载时运行到这里
		});
	}

3.修改引用css的页面所在项目cache-version.js文件
cache-version.js文件说明

[推荐]方法二

不配置config.js,直接在方法一的步骤二写入 sc.addCss方法

 sc.addCss(ipconfig.address.spxc+"css/index.css?v="+cacheVersion);

方法三

css有变动时手动修改所有该css文件的版本号v,代码如下:

<link rel="stylesheet" href="../css/form.css?v=2">  

2.ajax get

如需禁止缓存需加上cache:false

    $.ajax({
		type : "GET",
		url : "../system/user/getCurrentUser",
		data:'json',
		//禁止缓存
		cache:false,
		success : function(data) {
			$(".name").html(data.fullName);
		}
	});

3.引入的js

步骤1.在页面中引入js

//获取缓存版本号
if(typeof(cacheVersion)=="undefined"){
	$.ajax({
		type : "GET",
		url : headHref+'js/cache-version.js',
		dataType: "script",
		async:false
	});
}
if(typeof(cacheVersion)=="undefined"){
	var cacheVersion="";
}
//获取配置文件信息,此操作非必须
var ipconfig=null;
	$.ajax({
		url : headHref+'config/data?fileName=ip.json&v='+cacheVersion,
		dataType:"json",
		type : "POST",
		async: false,
		success : function(data) {
			ipconfig=data;
		}
	});
//所有要引入的js,iframe写在获取缓存版本号后
$.ajax({
	type : "GET",
	//需要引入的js
	url : headHref+"example.js?v="+cacheVersion,
	dataType: "script",
	success : function(data) {
		//需在此js(config)之后执行的js
	}
});
$.ajax({
	type : "GET",
	//需要引入的js
	url : ipconfig.address.spxc+"exampleB.js?v="+cacheVersion,
	dataType: "script",
	success : function(data) {
		//需在此js(config)之后执行的js
	}
});
//iframe加载
if($(thisO).attr("href").indexOf("?") == -1){
	$(frame).src = $(thisO).attr("href")+"?v="+cacheVersion;
}else{
	$(frame).src = $(thisO).attr("href")+"&v="+cacheVersion;
}

步骤2.修改引用js的页面所在项目cache-version.js文件
cache-version.js文件说明

4.iframe

[推荐]方法一

通过target=iframe生成iframe,并修改cacheVersion(版本号大于等于tm-init-v0.1.5)

方法二

加载方式为js加载地址,不配置config.js,直接在引入的css方法一的步骤二写入 sc.addScript(方法

 sc.addCss(ipconfig.address.spxc+"js/index.js?v="+cacheVersion);

方法三

加载方式为js加载地址, 修改cacheVersion并编写代码,代码见上方js部分

转载于:https://my.oschina.net/u/3146772/blog/1829721