了解:

缓存的种类

  • memory cache(内存缓存)
  • disk cache(硬盘缓存)
一、强缓存:只要访问过该url,再次访问时,不再向服务器发送请求,直接从缓存中请求资源。

涉及两个响应头配置:

  1. <- cache-control: max-age=600 或者 设置为 ---- no-store (不缓存) no-cache (不使用强缓存)

http1.1以后增加的,max-age设置的强缓存的过期时间,600表示600毫秒。

  1. <- expires: Mon,4 Sep 2021 09:02:20 GMT

http1.0以后增加的,

以上当两者同时存在时,cache-control起作用。

一般不希望强缓存的是:index.html或者所有的html文件。
可强缓存的是:js、css,因为每次打包后,都会有个随机数,如果变化一定会重新发生请求。

二、协商缓存:第一次访问时,也会进行缓存,但再次访问时,均会向服务器发送请求,询问是否发生变化,服务器会返回code表示是否发生了变化,例如 若304则无变化,若200则服务器会将新的内容发送过来,浏览器再次进行缓存。

涉及两个响应头配置(1和3)及两个请求头配置(2和4):

  1. <- last-modified: Fri, 07 Aug 2021 02:35:59 GMT
  2. -> if-modified-since: Fri,07 Aug 2021 02:35:59 GMT

通过时间判断
第一次请求服务器时,服务器会返回给浏览器该文件最近一次修改的时间,及内容。
当再次请求服务器时,会通过上面带上改缓存文件的上一次修改的时间,服务器收到后,会根据这个修改时间 判断是否变化了,若无变化,服务器返回304,直接读取缓存即可。

  1. <- etag: W/“512cbe0f-2382”
  2. -> if-none-match: W/“5f2cbe0f-2382”

通过hash值判断
etag这一对儿与上面类似,只是后面跟着的是hash值,是一个唯一标志。过程与上面一样。

对比两种判断方式,当通过时间判断时,文件有可能修改的时间发生了变化,但是文件的内容并没有发生变化;当通过hash值判断时,只要hash值变化了,文件的内容就一定发生了变化。

Nginx相关配置方式

可以使用scp命令,将服务器中的文件下载到本地,修改后,再使用scp进行上传即可。scp 从服务器(用户名@域名:文件地址)/本地 到本地/服务器(用户名@域名:文件地址) 记得每次修改配置文件后,需要重启nginx。nginx -s reload

以下均是修改nginx.conf配置文件中的某一模块内容。

1、配置gzip(进行文件压缩)和etag(协议缓存)
http {
	# 开启gzip
	gzip on;
	#启用gzip压缩的最小文件:小于设置值的文件将不会被压缩
	gzip_min_length 1k;
	#gzip 压缩级别 1-10
	gzip_comp_level 2;
	#进行压缩的文件类型
	gzip_types text/plain application/javascript application/x-javascript text/css application/xml text/javascript application/x-httpd-php image/jpeg image/gif image/png;
	#是否在http header中添加Vary: Accept-Encoding(表示服务器支持压缩),建议开启
	gzip_vary on;
	
	#开启etag,默认也是开启状态
	etag on;
}
2、配置强缓存
server {
	#使用location进行正则匹配文件名称,针对特定的文件进行不同的强缓存设置
	#匹配html文件
	location ~* \.(html)$ {
		#关闭打印日志
		access_log off;
		#配置为不进行强缓存
		add_header Cache-Control max-age=no-cache;
	}
	
	location ~* \.(css|js|png|jpg|jpeg|gif|gz|svg|mp4|ogg|ogv|webm|htc|xml|woff)$ {
		access_log off;
		#配置为强缓存时长是360000毫秒
		add_header Cache-Control max-age=360000;
	}
}