解决web项目发布新版本需要清除浏览器缓存的问题

一、bug起因

最近做公司的项目,对样式进行了修改后,新版本上线。测试那边经常说:修改的样式没有生效,我都是让他们清下浏览器缓存试试。可是到了正式环境,用户(也就是老总们)并不都一定知道清缓存这件事,导致一出问题就找我们,所以上面下死命令,要把这个问题解决掉。

二、解决方案

其实浏览器缓存是有好处的,第一次访问网站会从服务器获取静态的资源,然后将静态资源在游览器中缓存,下次用户在访问时,就直接获取游览器的缓存的静态资源,加快响应速度。但是同样也有弊端,当你更新样式或者图片资源的时候,再次访问就不会获取最新修改的静态资源。

解决的方案有三种:
1、用户自行清理浏览器缓存。
2、使用禁用缓存标签,实现禁用浏览器缓存。
3、为js和css文件添加版本号。

2.1 第一种方式

用户自行清理游览器缓存。这个不太现实,老总受不了。

2.2 第二种方式

在html页面的head 头中添加如下代码:





2.3 第三种方式

在引用的静态文件后添加版本号参数,这个参数可以是时间戳或者随机数。处理方式的代码如下:


    
    
    

对于页面我们还是希望有缓存的,这样可以减轻服务器的压力,加快响应时间。需要解决的问题是:每次发布新版本重新部署后,第一次访问获取的是最新的静态资源,下次访问在走游览器的缓存。

综合上述分析,选用第三种方式:加版本号,但是一个文件里面有好多css和js,手动添加太费劲了。有没有其他的什么好办法呢,当然有啊,根据大佬的建议,使用maven插件:maven-replacer-plugin来完成。

具体操作是:通过 maven-replacer-plugin在项目打包 package(mvn package)时会自动为静态文件中的js或者css追加例如: xxx.js?v=time 的后缀,从而解决修改后浏览器缓存问题,需要注意的是此插件只会在生成 war 包源码时生效,不需要修改任何代码。

三、操作步骤

3.1 修改pom文件

在properties标签里添加版本号样式,例如:


        UTF-8
        UTF-8
        1.8
        
        yyyyMMddHHmmss
    

前面的配置是配置项目编码及java版本号用的,所以不用管,主要是最后一行配置

然后添加maven-replacer-plugin插件:如下


            
                org.apache.maven.plugins
                maven-war-plugin
                3.0.0
                
                    
                    true
                
                
                    
                    
                        prepare-war
                        prepare-package
                        
                            exploded
                        
                    
                
            
            
                com.google.code.maven-replacer-plugin
                replacer
                1.5.3
                
                    
                        prepare-package
                        
                            replace
                        
                    
                
                
                    
                    ${build.directory}
                    
                    
                        ${build.finalName}/WEB-INF/views/assess/assess-list.jsp
                    
                    
                    
                        
                            \.css\"
                            .css?v=${maven.build.timestamp}\"
                        
                        
                            \.css\'
                            .css?v=${maven.build.timestamp}\'
                        
                        
                            \.js\"
                            .js?v=${maven.build.timestamp}\"
                        
                        
                            \.js\'
                            .js?v=${maven.build.timestamp}\'
                        
                    
                
            

${build.finalName}/WEB-INF/views/assess/assess-list.jsp代表需要替换的页面的具体位置,可以配置多个include,代表修改多个页面
也可以使用 ${build.finalName}/WEB-INF/jsp/*.html 来替换所有jsp目录下所有html文件。

3.2 执行 mvn clean package

清除之前的版本包,并重新打包。

3.3 验证打包后项目中的war包是否生效。

未配置maven-replacer-plugin 插件前打包后template_main.jsp部分内容如下:


    

配置maven-replacer-plugin 插件前打包后template_main.jsp部分内容如下:


    

注意:配置完pom文件后可能会报红,需要手动从远程仓库更新依赖,idea里是点击那个类似刷新的按钮


image.png

四、总结

如果你的项目是maven项目,如果你的项目打出来是war包,那就赶紧试一试吧。参考文献:https://blog.csdn.net/ljk126wy/article/details/103911421
————————————————
版权声明:本文为CSDN博主「陌上、波寒雨」的原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接及本声明。
原文链接:https://blog.csdn.net/chen_bo526/java/article/details/103923070

你可能感兴趣的:(解决web项目发布新版本需要清除浏览器缓存的问题)