热门标签 | HotTags
当前位置:  开发笔记 > 编程语言 > 正文

jshtml图片缓存问题,如何防止浏览器缓存CACHE?将CSS、JS、图片加上参数

什么是浏览器缓存浏览器缓存功能是网页性能优化的项目之一使用浏览器缓存功能如果用户再次来到您的网站,缓存css、js、jpg、png图档等静态资源将能使网页打开速度加快

ec9d636b4087ac1821379c915fcf9b2c.png

cache.jpg?resize=559%2C559

什么是浏览器缓存

浏览器缓存功能是网页性能优化的项目之一

使用浏览器缓存功能如果用户再次来到您的网站,缓存css、js、jpg、png图档等静态资源将能使网页打开速度加快,同时也能减少服务器负担。

更多关于浏览器缓存功能可参考google说明文档

https://developers.google.com/speed/docs/insights/LeverageBrowserCaching

用了浏览器缓存会遇到的问题

用了缓存之后总有些后遗症,例如调整了css或Javascript、更新了图片

但缓存时间还没到期,即便css、js与图档已经更新了,用户可能看见的仍是旧的内容

若要立即看到最新内容,就必须清除缓存或是使用Ctrl+F5强制重新加载页面

并不是所有的用户都懂得使用Ctrl+F5这类方式来看到最新的网页内容

解决浏览器缓存的方法

浏览器缓存这个问题虽然很烦人,但其实只要在扩展名后方加上参数

如此一来浏览器会认定URL变得不相同,向服务器请求新的下载

方式如下:

在style.css后方加上”?”以及”自订字符串”

可以是乱数、日期时间、版本编号

例如

乱数 > style.css?f5V3Ra (随机乱打就对了)

日期 > style.css?20140627

版本 > style.css?v2.10.1

累加 > style.css?0001 (每改一次+1)

依照自己的更新频率、习惯或喜好决定使用哪种方式即可

前提是不要与旧版本重复哦

原代码像这样:

css

js

同样方式也适用于图档喔

像是这样:

course1.png?v2%E2%80%B3

css的用到的图片也可以:

.logo{background:url(../images/logo.png?justin_edit);}

本站内容均为「码迷SEO」原创整理,未经授权严禁采集转载,违者必究。



推荐阅读
  • 问题描述现在,不管开发一个多大的系统(至少我现在的部门是这样的),都会带一个日志功能;在实际开发过程中 ... [详细]
  • 理解浏览器历史记录(2)hashchange、pushState
    阅读目录1.hashchange2.pushState本文也是一篇基础文章。继上文之后,本打算去研究pushState,偶然在一些信息中发现了锚点变 ... [详细]
  • 长期从事ABAP开发工作的专业人士,在面对行业新趋势时,往往需要重新审视自己的发展方向。本文探讨了几位资深专家对ABAP未来走向的看法,以及开发者应如何调整技能以适应新的技术环境。 ... [详细]
  • 本文探讨了如何通过优化 DOM 操作来提升 JavaScript 的性能,包括使用 `createElement` 函数、动画元素、理解重绘事件及处理鼠标滚动事件等关键主题。 ... [详细]
  • CSS Border 属性:solid 边框的使用详解
    本文详细介绍了如何在CSS中使用solid边框属性,包括其基本语法、应用场景及高级技巧,适合初学者和进阶用户参考。 ... [详细]
  • 本文介绍了SIP(Session Initiation Protocol,会话发起协议)的基本概念、功能、消息格式及其实现机制。SIP是一种在IP网络上用于建立、管理和终止多媒体通信会话的应用层协议。 ... [详细]
  • 二维码的实现与应用
    本文介绍了二维码的基本概念、分类及其优缺点,并详细描述了如何使用Java编程语言结合第三方库(如ZXing和qrcode.jar)来实现二维码的生成与解析。 ... [详细]
  • 1.绑定htmlcss1.1对象语法:  传给v-bind:class一个对象,以动态地切换class   ... [详细]
  • 解决JavaScript中法语字符排序问题
    在开发一个使用JavaScript、HTML和CSS的Web应用时,遇到从SQLite数据库中提取的法语词汇排序不正确的问题,特别是带重音符号的字母未按预期排序。 ... [详细]
  • 回顾两年前春节期间的一个个人项目,该项目原本计划参加竞赛,但最终作为练习项目完成。独自完成了从编码到UI设计的全部工作,尽管代码量不大,但仍有一定的参考价值。本文将详细介绍该项目的背景、功能及技术实现。 ... [详细]
  • 深入理解:AJAX学习指南
    本文详细探讨了AJAX的基本概念、工作原理及其在现代Web开发中的应用,旨在为初学者提供全面的学习资料。 ... [详细]
  • importjava.io.*;importjava.util.*;publicclass五子棋游戏{staticintm1;staticintn1;staticfinalintS ... [详细]
  • 我的读书清单(持续更新)201705311.《一千零一夜》2006(四五年级)2.《中华上下五千年》2008(初一)3.《鲁滨孙漂流记》2008(初二)4.《钢铁是怎样炼成的》20 ... [详细]
  • 本文将从基础概念入手,详细探讨SpringMVC框架中DispatcherServlet如何通过HandlerMapping进行请求分发,以及其背后的源码实现细节。 ... [详细]
  • 本文探讨了在一个物理隔离的环境中构建数据交换平台所面临的挑战,包括但不限于数据加密、传输监控及确保文件交换的安全性和可靠性。同时,作者结合自身项目经验,分享了项目规划、实施过程中的关键决策及其背后的思考。 ... [详细]
author-avatar
天河体育场里的执波仔_287
这个家伙很懒,什么也没留下!
PHP1.CN | 中国最专业的PHP中文社区 | DevBox开发工具箱 | json解析格式化 |PHP资讯 | PHP教程 | 数据库技术 | 服务器技术 | 前端开发技术 | PHP框架 | 开发工具 | 在线工具
Copyright © 1998 - 2020 PHP1.CN. All Rights Reserved | 京公网安备 11010802041100号 | 京ICP备19059560号-4 | PHP1.CN 第一PHP社区 版权所有