解决WEB对js、css缓存问题的一种可行方案

来源：互联网发布：如何制作常用算法演示编辑：程序博客网时间：2024/05/21 17:30

解决WEB对js、css缓存问题的一种可行方案

by solo

note : 该方案思想非原创，是作者结合互联网上各种解决方案汇总及筛选，实现的一个Demo

解决思想：给更新频繁的js或css请求连接加入版本号。

如下：

<script type="text/javascript" src="../mytest.js?v=20160822" ></script><link rel="stylesheet" href="../mytest.css?v=20160822"/>

具体实现思想：每个页面引入公共的内容，该公共内容中含有该版本号；版本号的配置要在配置文件或者可修改处，尽量在增量修改js或css时，修改版本号，但是不必重启服务；

公共部分
common.jsp

<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %><c:set var="version" value="20160822" />

引用部分
以index.jsp为例

<%@ page language="java" contentType="text/html; charset=utf-8" pageEncoding="utf-8"%><%@ include file="common.jsp" %><!DOCTYPE html><html><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8"><script type="text/javascript" src="jquery.js"></script><script type="text/javascript" src="mytest.js?v=${version}"></script><link href="mytest.css?v=${version}" rel="stylesheet"><title>no cache</title></head><body>    <span class="mycss">测试css样式</span>    <input id="testBtn" type="button" value="测试js" /></body></html>

其他代码
mytest.js

$(function(){    alert("bcd");    $("#testBtn").on('click',function(){        alert("abc-3");    });});

mytest.css

.mycss{    font-size: 30px;    color: blue;}

引入jar包

jst.jarstandard.jar[下载地址](http://archive.apache.org/dist/jakarta/taglibs/standard/binaries/)

总结：
1，这种方式未屏蔽浏览器对资源文件的缓存，并不是每次都向服务器端请求资源。
2，在资源文件改动后，服务器端修改公共部分的版本号，浏览器会请求最新的资源文件。
3，版本号放入jsp公共部分，在增量修改js或css等资源文件时，可以很方便的修改版本号，且不必重启服务。

0 0