客户端浏览器缓存

浏览器本地缓存静态数据

1)使用Firefox浏览器查看缓存
以Firefox浏览器为例,在Firefox地址栏内输入about:cache将显示Firefox浏览器的缓存信息,点击List Cache Entries可以查看详细信息
2)清空firefox本地缓存数据
3)修改Nginx配置文件,定义对静态页面的缓存时间

# vim /usr/local/nginx/conf/nginx.conf

在server里面添加一个location,不要添加在原有的location里面。
server {
listen 80;
server_name localhost;

#charset koi8-r;

#access_log logs/host.access.log main;

location /status {
stub_status on;
}
location / {
root html;
index index.html index.htm;
}

location ~* \.(jpg|png)$ { #添加这3行,后面括号里是什么jpg之类要看工作时用到的类型
expires 30d; #定义客户端缓存时间为30天
}
}
---------------------------------------------------------------------------------------------
# nginx -s reload
# cp /usr/share/backgrounds/day.jpg /usr/local/nginx/html/ #拷贝一个桌面背景图片
---------------------------------------------------------------------------------------------
4)优化后,真机使用Firefox浏览器访问图片,再次查看缓存信息
然后清除火狐的全部历史记录,然后访问刚才复制的图片
firefox 192.168.4.5/day.jpg
真机在Firefox地址栏内输入about:cache,查看本地缓存数据的位置,查看是否有图片以及过期时间是否正确。


disk
Number of entries: 2 #这是火狐的历史记录信息
Maximum storage size: 358400 KiB
Storage in use: 386 KiB
Storage disk location: /root/.cache/mozilla/firefox/1eewp1tc.default/cache2 #这是它的缓存位置
List Cache Entries #点这个可以看到精确的浏览的历史记录!!!

Key Data size Fetch count Last Modifed Expires Pinning
http://192.168.4.5/day.jpg 392746 bytes 2 2018-11-03 10:44:52 2018-12-03 10:44:51

原文地址:https://www.cnblogs.com/summer2/p/10787936.html

时间: 2024-08-30 05:10:26

客户端浏览器缓存的相关文章

缓存(CDN缓存,浏览器(客户端)缓存)

1.什么是缓存? 缓存是一个到处都存在的用空间换时间的例子.通过使用多余的空间,我们能够获取更快的速度. 首先,看看没有网站没有接入CDN时,用户浏览器与服务器是如何交互的: 用户在浏览网站的时候,浏览器能够在本地保存网站中的图片或者其他文件的副本,这样用户再次访问该网站的时候,浏览器就不用再下载全部的文件,减少了下载量意味着提高了页面加载的速度. 但是如果在中间加上一层CDN,那么用户浏览器与服务器的交互如下: 客户端浏览器先检查是否有本地缓存是否过期,如果过期,则向CDN边缘节点发起请求,C

浏览器缓存机制浅析

非HTTP协议定义的缓存机制 浏览器缓存机制,其实主要就是HTTP协议定义的缓存机制(如: Expires: Cache-control等).但是也有非HTTP协议定义的缓存机制,如使用HTML Meta 标签,Web开发者可以在HTML页面的<head>节点中加入<meta>标签,代码如下: <META HTTP-EQUIV="Pragma" CONTENT="no-cache"> 上述代码的作用是告诉浏览器当前页面不被缓存,每

浏览器缓存控制

浏览器缓存控制 Last-Modified/ If-Modified-Since 在浏览器第一次请求某一个URL时,服务器端的返回状态码200,内容是客户端请求的资源,同时有一个Last-Modified的属性标记此文件在服务器端最后被修改的时间. Last-Modified格式类似这样:Last-Modified : Fri , 12 May 2006 18:53:33 GMT 客户端第二次请求此URL时,根据HTTP协议的规定,浏览器会向服务器传送If-Modified-Since报头,询问

304和浏览器缓存

浏览器虽然发现了本地有该资源的缓存,但是不确定是否是最新的,于是想服务器询问,若服务器认为浏览器的缓存版本还可用,那么便会返回304. 浏览器缓存分为强缓存和协商缓存. 1.浏览器请求某资源,通过header判断是否强缓存,若是强缓存,则从本地直接获取缓存文件,不发请求到浏览器 2.若不是强缓存,发送请求到服务器,服务器通过一些request header确定是否是协商缓存,如果是,服务器将请求返回,但不返回资源,而是让客户端从本地缓存获取资源 3.强缓存和协商缓存,资源都是本地,只是强缓存不会

浏览器缓存机制详解

对于浏览器缓存,相信很多开发者对它真的是又爱又恨.一方面极大地提升了用户体验,而另一方面有时会因为读取了缓存而展示了"错误"的东西,而在开发过程中千方百计地想把缓存禁掉.那么浏览器缓存究竟是个什么样的神奇玩意呢? 什么是浏览器缓存: 简单来说,浏览器缓存就是把一个已经请求过的Web资源(如html页面,图片,js,数据等)拷贝一份副本储存在浏览器中.缓存会根据进来的请求保存输出内容的副本.当下一个请求来到的时候,如果是相同的URL,缓存会根据缓存机制决定是直接使用副本响应访问请求,还是

浏览器缓存策略

浏览器一般缓存图片.CSS.JS等静态文件,因为这些文件的更新频率相对来说比较低,合理利用浏览器的缓存对网站的性能提升有很大帮助.HTTP缓存分为两部分,分别是本地缓存和缓存协商,当本地缓存不生效时会启用缓存协商.HTTP缓存主要由HTTP协议的头(Header)信息来制定. 本地缓存 本地缓存是指当浏览器请求资源时,如果命中了浏览器本地的缓存资源,那么浏览器就不会发送真正请求给服务器.它的执行过程是:1. 第一次浏览器发送请求给服务器时,此时浏览器还没有本地缓存副本,服务器返回资源给浏览器,响

nginx优化--gzip压缩与expire浏览器缓存

gzip压缩 概述 网页在服务器端经过了gzip或者其他格式的压缩后的输出明显减少了content-length字节,当访问过百万时,这些减少的字节就会变为客观的流量给节约下来;从而减轻服务器的压力以及网页的访问速度; 原理 客户端在向服务端发送http请求时,在请求头中有一个Accept-Encoding的头信息,该头信息告知服务器端本客服端能接收什么样的压缩文件,如果服务器端配置了压缩的需求,就会返回相应的压缩文件,然后浏览器再解码呈现出来;我们在做采集时,需要采集的是未压缩的文件,所以在h

浏览器缓存知识小结及应用

阅读目录 1. 浏览器缓存基本认识 2. 强缓存的原理 3. 强缓存的管理 4. 强缓存的应用 5. 协商缓存的原理 6. 协商缓存的管理 7. 浏览器行为对缓存的影响 浏 览器缓存,也就是客户端缓存,既是网页性能优化里面静态资源相关优化的一大利器,也是无数web开发人员在工作过程不可避免的一大问题,所以在产品开发的 时候我们总是想办法避免缓存产生,而在产品发布之时又在想策略管理缓存提升网页的访问速度.了解浏览器的缓存命中原理,是开发web应用的基础,本文着眼 于此,学习浏览器缓存的相关知识,总

Maven构造版本号的方法解决浏览器缓存问题

需要解决的问题 在做WEB系统开发时,为了提高性能会利用浏览器的缓存功能,其实即使不显式的申明缓存,现代的浏览器都会对静态文件(js.css.图片之类)缓存.但也正因为这个问题导致一个问题,就是资源的缓存逻辑有时出现问题后服务器的最新版本文件无法更新客户端的缓存. 这个问题会给用户产生许多的困扰,当然首先是测试人员会很头痛,一些看起来没有修复的bug为什么开发要说做好了?这种时候我会无奈的说:ctrl+f5刷新一下.但这毕竟不是解决问题的方法. 思路与方法考虑 思路 之前没有着手处理过这样的问题