前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >专栏 >使用 HTML meta 标签来禁用缓存

使用 HTML meta 标签来禁用缓存

作者头像
李维亮
发布于 2021-07-08 02:14:14
发布于 2021-07-08 02:14:14
4.6K00
代码可运行
举报
文章被收录于专栏:李维亮的博客李维亮的博客
运行总次数:0
代码可运行

如何完美滴使浏览器访问一个 HTML 页面时禁用缓存?

在测试某个 SPA 项目时,发现更改后 Chrome 浏览器页面刷新还是使用之前的版本。经调查发现 Chrome 默认缓存值为 300 秒。

经测试跨浏览器禁止缓存的 headers 如下:

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
Cache-Control: no-cache, no-store, must-revalidate
Pragma: no-cache
Expires: 0

Cache-Control is for HTTP 1.1 Pragma is for HTTP 1.0 Expires is for proxies

因为是 HTML 页面,可以于 HEAD 标签内直接添加 META 标签:

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
<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" />

其他文件就需要使用服务器设置文件控制 header 咯。

本文参与 腾讯云自媒体同步曝光计划,分享自作者个人站点/博客。
原始发表:2019-02-28,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体同步曝光计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
暂无评论
推荐阅读
编辑精选文章
换一批
Vue 入口缓存的问题
在开发时候经常遇到一个问题,我们根据版本号去控制缓存问题,当我们发布新版本,使用心得版本号的时候,发现 html 里面引用的版本号却是旧的版本号 ,原来是该 html 文件被缓存了,很多时候我们设置禁止 html 文件被缓存,但依然会出现被缓存的情况。
chuchur
2022/10/25
1.1K0
【前端 · 面试 】HTTP 总结(八)—— HTTP 强缓存
强缓存中,当请求再次发出时,浏览器会判断目标资源是否“命中”强缓存,如果命中则直接从缓存中获取资源,不会再与服务端发生通信。
编程三昧
2021/08/08
4270
【前端 · 面试 】HTTP 总结(八)—— HTTP 强缓存
微信页面入口文件被缓存解决方案
缓存对于前端页面来说,是加速页面加载的利器之一,但也同时带来了很多问题,比如新版本发布之后,怎么替换客户端上的缓存文件呢?大家一般的的解决方案主要有以下几种形式,
木子墨
2018/10/11
4K0
meta禁止页面缓存是一种HTML元标签设置
西里网
2025/05/15
970
【优化】vue项目缓存引发的白屏
近期vue项目在构建完成上线之后,每次往线上更新版本,总会收到一部分反馈——web页面白屏,需要清除缓存数据重新加载才能正常访问。
流眸
2020/12/15
3.4K0
vue 强制清除浏览器缓存
(1)最基本的方法就是,在打包的时候给每个打包文件加上hash 值,一般是在文件后面加上时间戳
全栈程序员站长
2022/09/09
2.1K0
前端单文件入口发布新版本 缓存问题
在现代 javascript框架项目开发中,一直有一个令人都疼的问题,就是缓存问题;每次发版完之后由于浏览器缓存机制,用户端不会实时获取新的项目页面,甚至有可能出现静态文件获取报404。
mousemin
2023/06/10
6630
CSS入门2-认识html之meta标签详解
(注1:如果有问题欢迎留言探讨,一起学习!转载请注明出处,喜欢可以点个赞哦!) (注2:更多内容请查看我的目录。)
love丁酥酥
2018/08/27
6920
如何不让浏览器缓存静态资源
一、请求时想要禁用缓存, 可以设置请求头: Cache-Control: no-cache, no-store, must-revalidate 二、另一种常用做法: 给请求的资源增加一个版本号, 如下:
河湾欢儿
2019/03/15
1.8K0
html meta 标签和浏览器缓存关系
1 https://www.cnblogs.com/zhuzhenwei918/p/6028414.html
西南_张家辉
2021/02/02
1.1K0
vue页面缓存问题_vue项目自动打开浏览器设置
浏览器缓存(Browser Caching)是为了节约网络的资源加速浏览,浏览器在用户磁盘上对最近请求过的文档进行存储,当访问者再次请求这个页面时,浏览器就可以从本地磁盘显示文档,这样就可以加速页面的阅览
全栈程序员站长
2022/11/01
1.3K0
浏览器缓存
HTTP header 缓存工作原理 浏览器发起请求的时候,根据请求头的 express 和 cache-control 来判断是否命中强缓存,如果是,怎直接从缓存读取资源,不会发起请求。 如果没有命中强缓存,浏览器会发起一个请求到服务端,并通过 last-modified If-modified-since 和 etag if-none-match 判断资源是否命中协商缓存,如果命中, 不会 中断请求,服务器会将这个请求返回(304),但是不会返回资源,资源会从缓存中读取。 如果没有命中缓存,则发起请求,
踏浪
2021/06/09
8960
浏览器缓存
WEB缓存探究
由于项目越来越大,即使了使用代码压缩工具减少文件大小,js文件还是不可避免的越变越大。而对于用户来说每次重新下载都有可能会消耗大量时间,让我们的首屏展示有较长时间的空白。为了提升网站性能,有效利用缓存能够提升用户体验,提高访问效率。
疯狂的技术宅
2019/03/28
7970
WEB缓存探究
浏览器缓存机制浅析--HTTP缓存
浏览器缓存机制,其实主要就是HTTP协议定义的缓存机制(如: Expires; Cache-control等)。但是也有非HTTP协议定义的缓存机制,如使用HTML Meta 标签,Web开发者可以在HTML页面的<head>节点中加入<meta>标签,代码如下:
Clearlove
2019/08/29
1K0
浏览器缓存机制浅析--HTTP缓存
强制缓存和协商缓存的区别
浏览器缓存(Brower Caching)是浏览器在本地磁盘对用户最近请求过的文档进行存储,当访问者再次访问同一页面时,浏览器就可以直接从本地磁盘加载文档。
用户9914333
2022/12/14
1K0
强制缓存和协商缓存的区别
【HTTP】缓存
随着用户访问量越来越大,缓存变得越来越重要。HTTP文件缓存可以减少冗余数据的传输;缓解网络瓶颈;降低对原始服务器的请求;以及降低距离延迟。
奋飛
2019/08/14
7050
<!DOCTYPE HTML PUBLIC “-//W3C//DTD HTML 4.01 Transitional//EN”>
大家好,又见面了,我是你们的朋友全栈君。[size=medium][color=orange][b]JSP页面头部的标识:<!DOCTYPE HTML PUBLIC “-//W3C//DTD HTML 4.01 Transitional//EN”>[/b][/color][/size]
全栈程序员站长
2022/09/14
1.9K0
在linux系统下Nginx缓存策略设置方式
在开发调试web的时候,经常会碰到因浏览器缓存(cache)而经常要去清空缓存或者强制刷新来测试的烦恼,提供下apache不缓存配置和nginx不缓存配置的设置。在常用的缓存设置里面有两种方式,都是使用add_header来设置:分别为Cache-Control和Pragma。
用户8989785
2021/10/13
2.4K0
【进阶系列】HTTP缓存机制专题
https://www.cnblogs.com/520yang/articles/4807408.html
江中散人_Jun
2023/10/16
4080
【进阶系列】HTTP缓存机制专题
IE内核浏览器的404页面问题和IE自动缓存引发的问题
本站404页面被IE替换成IE自己的404页面 在权限设置正确的情况下,自定义的404页面文件大小如果小于512字节,那么IE内核的浏览器会认为你自定义的404页面不够权威,从而使用其自带的404页面
mcq
2018/06/20
1.8K0
相关推荐
Vue 入口缓存的问题
更多 >
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档
本文部分代码块支持一键运行,欢迎体验
本文部分代码块支持一键运行,欢迎体验