HTML 如何禁用缓存

缓存可以加快Web请求的速度，在Web应用中，缓存有多种，包括：

浏览器端缓存
中间缓存服务器端缓存
Web服务器端缓存
以浏览器端缓存为例，浏览器将服务端响应的页面、图片、样式或是JS文件等保存在浏览器本地，下次访问的时候直接从本地查找就可以显示，好处是可以加快页面的展现速度，提高用户体验；坏处就是缓存的内容不是最新的，所以在某些场景下需要禁用缓存。

HTML协议中对缓存的控制

HTTP 协议中使用头信息控制缓存信息，包括浏览器端，中间缓存服务器端，Web服务器端。
HTTP协议中用于缓存信息头关键字包括：

Cache-Control , HTTP 1.1 版本使用
Pragma： HTTP 1.0 版本使用。
last-Modified　　最近修改的时间
Expires　　过期时间

Pragma

Pragma可以设置的值有：

Pragma：浏览器和缓存服务器都不缓存缓存
no-cache：浏览器和缓存服务器都不缓存，需要结合Expires为0.

Cache-Control

可以设置的值有：

no-cache ：浏览器和缓存服务器都不缓存
public 浏览器和缓存服务器都可缓存
no-store 请求和响应信息都不应该存储在对方的磁盘系统中
must-revalidate, 对于客户机的每次请求，代理服务器旭向服务器验证缓存是否过时。

HTML协议头信息的定义

HTML协议中使用<meta>标签定义头信息，在该信息里使用http-equiv 和 contect 定义键和值，比如文档类型的头信息 Content-Type:text/html , 这里的键是Content-Type，其对应的值是text/html，所以使用 meta 定义如下：


<meta http-equiv="Content-Type" contect="text/html">

##　HTML页面如何禁用缓存
综合以上，在一个HTML 页面中禁用缓存的方式是在<head>标签内加入如下头信息定义：

<meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate" />
<meta http-equiv="Pragma" content="no-cache" />
<meta http-equiv="Expires" content="0" />

补充

HTML中meta 的作用

meta 翻译一下是元数据。
在html 中meta 用来在HTML文档中模拟 HTTP协议的响应头报文。
<meta>标签定义在 <head>中。
meta的属性有两种：

name: 用于描述网页，对应Content, 用处是便于搜索引擎查找、分类。最重要的属性description 和keywords。
http-equiv :

####　meta name

Generator 生成工具
keywords 搜索引擎页面关键字
description 站点说明
Author 作者
Robots：
- all 文件被检索，页面上的链接可以被查询
- none 文件不被检索，链接不可以被查询
- index 文件将被检索
- follow 页面上的链接可以被查询
- noindex 文件不被检索页面上的链接可以被查询
- nofollow 文件不被检索页面上的链接可以被查询

http-equiv

Content-Type 内容类型


<meta http-equiv="Content-Type" contect="text/html";charset=UTF-8">

Content-Language 语言

<meta http-equiv="Content-Language" contect="zh-CN">

Refresh 指定时间页面跳转

<meta http-equiv="Refresh" contect="n;url=http://yourlink">

Pragma 缓存
set-cookie Cookie 过期设置

<meta http-equiv="set-cookie" contect="Mon,12 May 2001 00:20:00 GMT">

Pics-label 网页等级评定

<meta http-equiv="Pics-label" contect="">

页面必须以独立页面显示，防止在frame中嵌入使用

<meta http-equiv="windows-Target" contect="_top">

Page-Enter ， Page-Exit 设置页面进入和离开的特殊效果

JSP 设置

如果使用的JSP页面，也可以通过response设置响应头信息，代理类似：

response.setHeader("Cache-Control", "public");
response.setHeader("Pragma", "Pragma");

HTML 如何禁用缓存相关推荐

SpringBoot 【IDEA热部署+浏览器禁用缓存】迅速提升效率
SpringBoot微服务写页面,每次都需要重启才生效,使用[IDEA热部署+浏览器禁用缓存]迅速提升效率: 参考 https://blog.csdn.net/qq_27416233/article/ ...
chrome浏览器的跨域设置 Google Chrome浏览器下开启禁用缓存和js跨域限制--disable-web-security...
chrome用户默认路径 Win7:C:\Users\[用户名]\AppData\Local\Google\Chrome\User Data\ XP:C:\Documents and Settings ...
sql查询禁用缓存_如何在SQL Server 2017中启用和禁用身份缓存
sql查询禁用缓存 Every data warehouse developer is likely to appreciate the significance of having surrogat ...
Chrome禁用缓存
Chrome默认对JS和CSS等静态资源进行缓存,对HTML不启用缓存. 在开发阶段,我们想要更改之后马上看到效果,那就必须禁用JS和CSS. 快捷键是F12+F1,F12相当于打开dev-tool, ...
谷歌浏览器和火狐浏览器永久禁用缓存【一劳永逸的解决方式】
目录前言谷歌浏览器方式一方式二火狐浏览器前言缓存对于开发人员来说异常的痛苦,很多莫名其妙的bug就是由缓存导致的,但当我们在网上查找禁用缓存的方式时,找到的方式大多数都是在开发者工具的面 ...
nginx禁用缓存_如何开启或禁用nginx缓存
有时我们在调试网站程序的时候,会遇到由于浏览器的缓存导致的代码修改无效的问题,此时我们必须强制刷新后才能清掉缓存,非常的不方便. (学习视频分享:编程视频) 如果我们禁用nginx缓存,让浏览器每次到 ...
win10一键优化禁用缓存，禁用组件，
win10一键优化禁用缓存,禁用组件, 网盘下载地址: http://www.bytepan.com/ZJtEINyARsQ
【ajax】Ajax $().load() 禁用缓存
最近使用jquery中的load加载页面时会出现页面只加载一次,而且这种情况只出现在ie浏览器中,chrome就不会,一开始以为是ie浏览器的原因,后来上网查了一下发现是ajax缓存的原因,所以在页面 ...
chrome谷歌浏览器开发者模式禁用缓存的设置方法
开发时建议关闭chrome的缓存[Disable cache(while DevTools open)] 问题:修改了css,JS后,chrome看不到效果