后台修改js或者css文件之后,客户端刷新但是无效的问题

前端开发会遇到一个问题:修改测试前端代码的时候,有时候修改了css或者js文件,但是前端刷新的时候却没有反应,不免让人感觉是不是修改错误,其实这有可能是客户端缓存问题。解决方法:

1)Ctrl+F5,清除浏览器缓存(等同于浏览器-->历史数据-->删除cookies)

2)在js或css后加版本号,这时候浏览器客户端会认为这是不同版本的js或者css文件,会自动重新刷新下载(浏览器会缓存下载页面js和css文件)

  2.1)形如:.css?v=x  或者 css?version=x     <link rel="stylesheet"  href="xx/xx.css?version=x.x.x" type="text/css" />  

  2.2)形如:.js?v=x  或者 css?version=x  <script type="text/javascript" src=../...js?v=x ></script>

3)使用gulp等进行前端构建

时间: 2024-12-24 04:35:50

后台修改js或者css文件之后,客户端刷新但是无效的问题的相关文章

gulp配置实现修改js、css、html自动刷新

写在前面: 本配置支持es6.less 1.首先 给出初始的目录结构 给出执行gulp后的目录结构 给出执行gulp --p后的目录结构 2.package.json里是一个写入.文件描述了npm包的相关配置信息(作者.简介.包依赖等)和所需模块. { "name": "gruntTest", "version": "1.0.0", "description": "", "ma

为js和css文件自动添加版本号

web应用必然要面对缓存问题,无论前台后台都会涉足缓存.特别是对于前端而言,缓存利用的是否得当直接关系到应用的性能. 通常情况下,我们会倾向于使用缓存,因为缓存一方面可以减少网络开销,一方面可以减轻服务器的压力. 但是有些时候缓存也会带来一些比较诡异的问题,呵呵.关于缓存的文章应该不在少数,不再讨论,本文的重点在于为js和css文件自动添加版本号. 这样做的原因是:首先对于js和css类型的静态文件设置了缓存机制,当文件被更新时,需要强迫浏览器下载修改后的新文件,也就是要更新缓存,而通过为js和

[转][前端优化]使用Combres合并对js、css文件的请求

本文转自:http://www.cnblogs.com/parry/archive/2011/01/28/Reduce_Http_Request_Using_Combres_For_Js_Css.html 在前端优化的各种金律铁规中,“减少客户端对资源的请求”都会在其中出现,刚好最近对网站做一些优化,使用了一下Combres组件,有点心得,遂整理成文. 园子中也有几篇Combres组件的介绍,如:Combres库学习小结以及部分源码分析和使用Combres 库 ASP.NET 网站优化.可部署时

将js和css文件装入localStorage加速程序执行

原理如下: 一次批量加要加载的文件存入数组,采用Ajax方式异步载入各个文件,然后采用循环方式逐个执行下载下来的Js或者Css文件,如果已经被缓存(localStorage)的则省略下载过程. 由于JS采用的是单线程模式运行,在执行某一个js时会阻塞其它并发的js执行,所以会按顺序执行各个js.在执行完所有的脚本之后,图片会被浏览器接着 加载,所以第一次加载速度略慢,后面就会比较快了.在JQuery Mobile 1.4.5+FireFox/微信浏览器下实测效果不错,IE就被省略了,我主要是要在

引入JS和CSS文件加版本号的作用

形如: <script type="text/javascript" src="/resources/js/myFunction.js?version=0.1.0"></script> <link rel="stylesheet" type="text/css" href="/resources/css/styles/myLocation.css?version=0.1.0"

Web移动端使用localStorage缓存Js和CSS文件

将js css文件缓存到localstorage区可以减少页面在加载时与HTTP请求的交互次数,从而优化页面的加载时间. 电脑端使用localstorage是测试没有问题的,但是用android的apk打包之后,导致localstorage失效,无法进行缓存,查阅资料之后,得知解决方法: 安卓代码: mWebView.getSettings().setDomStorageEnabled(true); mWebView.getSettings().setAppCacheMaxSize(1024*1

2个方法通过字[符串参数]加载外部js和css文件

Java语言的异常处理机制可以去确保程序的健壮性,提高系统的可用率,但是Java API提供的异常都是比较低级的(这里的低级是指 " 低级别的 " 异常),只有开发人员才能看的懂,才明白发生了什么问题.而对于终端用户来说,这些异常基本上就是天书,与业务无关,是纯计算机语言的描述,那该怎么办?这就需要我们对异常进行封装了. 近年来,深度学习的研究越来越深入,在各个领域也都获得了不少突破性的进展.基于注意力(attention)机制的神经网络成为了最近神经网络研究的一个热点,本人最近也学习

gulp-rev同时将js和css文件写在一个rev-manifest.json文件里面的方式探讨

参考: https://segmentfault.com/q/1010000002876613 https://github.com/sindresorhus/gulp-rev 测试发现,在官网上最主要的做法是: 加入如下参数: { base: 'build/assets', merge: true } 其中base为存放上一个生成的rev-manifest.json文件,然后merge为是否拼合进去,最后再输出到base这个目录上,就可以实现js和css文件同在一个rev-manifest.j

Django中载入js和css文件

Django中载入js和css文件 项目的文件夹结构例如以下: mysite |-mysite |-|-static |-|---js和css文件 |-|-|-init.py |-| |-models.py |-| |-views.py |-|-init.py |-|-settings.py |-|-urls.py |-templates |-|-(template html 文件) settings.py中static变量的设置: STATIC_ROOT = os.path.join(os.p