H5缓存机制

野性酷女 2022-04-02 06:29 274阅读 0赞

做过返回页面定位的功能，因为带分页，所以用了缓存sessionStorage，请见[博客][Link 1]，然后顺便又了解了其他的缓存机制。

一、消除缓存

//方法一 修改请求header头，比如php添加：
    header("Expires: Mon, 26 Jul 1997 05:00:00 GMT");
    header("Cache-Control: no-cache, must-revalidate");
    header("Pragma: no-cache");

//方法二 修改html的head块：
    <META HTTP-EQUIV="pragma" CONTENT="no-cache">
    <META HTTP-EQUIV="Cache-Control" CONTENT="no-cache, must-revalidate">
    <META HTTP-EQUIV="expires" CONTENT="Wed, 26 Feb 1997 08:21:57 GMT">
    <META HTTP-EQUIV="expires" CONTENT="0">

//方法三：添加随机参数：
    //对于图片或者css，可使用如下方式：
    <img src="./data/avatar_mingpian_bak.jpg?rand=h9xqeI"  width="156" height="98">
    //对于js则可以直接使用时间戳：
    <script language="javascript" src="UILib/Common/Common.js?time=new Date()">

二、应用缓存  
除了http协议缓存，HTML5 提供一种应用程序缓存机制，使得基于web的应用程序可以离线运行。为了能够让用户在离线状态下继续访问 Web 应用，开发者需要提供一个 cache manifest 文件。  
[可以参考这篇文章][Link 2]  
[  
H5的离线缓存技术][H5]

[Link 1]: https://blog.csdn.net/zhaohanqq/article/details/85235458
[Link 2]: https://www.cnblogs.com/bugly/p/7047908.html
[H5]: https://blog.csdn.net/wang_gongzi/article/details/82846309

发表评论取消回复

表情：

评论列表（有 0 条评论，274人围观）

还没有评论，来说两句吧...

相关阅读

相关浏览器缓存机制：http缓存

http缓存简介一般项目中每个页面会有很多http请求，每个页面资源也有很多共享的资源，比如：图片、js、css等资源。http缓存就是可以将平时大量常用并且很少修改的

迈不过友情╰/ 2024年03月25日 15:05/ 0 赞/ 87 阅读

相关 H5当中的web缓存

localStorage 方法存储的数据没有时间限制保存数据 localStorage.setItem("name", “Jack"); 读取数据

悠悠/ 2022年12月25日 11:55/ 0 赞/ 134 阅读

相关 WebView自动H5缓存-清除缓存ios

iOS的Webview加载HTML时会自动缓存JS、CSS等文件，当下次加载HTML时会根据请求的缓存策略是否使用缓存本地的JS和CSS，如果本地有缓存，那么直接返回本地资源(

╰+哭是因爲堅強的太久メ/ 2022年10月09日 14:30/ 0 赞/ 233 阅读

相关 H5 缓存机制浅析移动端 Web 加载性能优化

1 H5 缓存机制介绍 H5，即 HTML5，是新一代的 HTML 标准，加入很多新的特性。离线存储（也可称为缓存机制）是其中一个非常重要的特性。H5 引入的离线存储，这

╰+哭是因爲堅強的太久メ/ 2022年08月18日 11:59/ 0 赞/ 259 阅读

相关 Web缓存机制综述（HTML5缓存总结与细节释疑）

标签： | 发表时间：2013-10-17 17:28 | 作者：bob007abc 出处：http://blog.csdn.net/bob007

Bertha 。/ 2022年07月16日 06:20/ 0 赞/ 212 阅读

相关浏览器缓存机制——http缓存

http缓存是基于HTTP协议的浏览器文件级缓存机制。即针对文件的重复请求情况下，浏览器可以根据协议头判断从服务器端请求文件还是从本地读取文件，chrome控制台下的Frame

ゞ浴缸里的玫瑰/ 2022年07月12日 12:23/ 0 赞/ 311 阅读

相关 h5离线缓存技术

HTML5提供了很多新的功能以及相应的接口，离线存储就是其中的一个，离线存储可以将站点的一些文件存储在本地，在没有网络的时候还是可以访问到以缓存的对应的站点页面，其中这些文

布满荆棘的人生/ 2022年05月21日 01:22/ 0 赞/ 313 阅读

相关 H5缓存机制

做过返回页面定位的功能，因为带分页，所以用了缓存sessionStorage，请见[博客][Link 1]，然后顺便又了解了其他的缓存机制。一、消除缓存 //方法

野性酷女/ 2022年04月02日 06:29/ 0 赞/ 275 阅读

相关如何设置Nginx缓存来减少H5流量

指令含义 expires 控制HTTP应答中的"Expires"和"Cache-Control"的头标。通过设置浏览器缓存资源的过期时间，来降低服务器的请求压

末蓝、/ 2022年02月19日 19:51/ 0 赞/ 392 阅读

相关 day5——h5

Htlm5介绍 1.标签更具语义化例如： article定义一篇文章；nav:定义导航区；section：定义区域，相比div更优化，一个页面中不止用一次，a

浅浅的花香味﹌/ 2021年12月04日 01:11/ 0 赞/ 447 阅读