一级目录
http详解
http缓存
http缓存就是将静态资源存储在浏览器内部,下次请求相同的资源的时候可以直接使用,不用再去请求,这样可以减少不必要的资源浪费的现象。优点:提高首屏加载速度,优化用户体验;介绍流量消耗;减轻服务器的压力。
http的缓存是比较容易实现,但是如何保证在资源的内容有变化的时候,缓存也会随之更新,这就需要http的几种方法。
在这里会用node代码的形式展现一下各种缓存方式,首先搭建一个测试框架:
//创建一个时间戳
function updateTime(){
timmer = this.timmer|| setInterval(()=>{
this.time = new Date().toUTCString()
},5000)
return this.time
}
//创建一个服务,来表示请求的变化
const http = require('http')
http.createServer((req,res)=>{
const {url} = req
if('/'===url){
res.end(
`
<html>
Html Update Time ${updateTime()}
<script src='main.js'></script>
</html>
`
)
}else if(url === '/main.js'){
const content = `document.writeln('<br>JS Update Time:${updateTime()}</br>')`
res.statusCode = 200;
res.end(content)
}else if(url==='/favicon.ico'){
res.end('')
}
})
.listen(3000,()=>{
console.log('http 请求的访问')
})
页面显示为:
强缓存策略
就是浏览器规定多长时间内,客户端如果需要的话直接从本地副本对比读取,不去请求服务器,返回的状态码是200.
使用定时器的方式来确定强缓存,设置静态资源的有效期。
HTTP1.0
expires
expires是http1.0中定义的缓存字段。当我们请求一个资源,服务器再返回时,可以在Response Header中增加expires字段表示资源的过期时间。
expires:Thu,03 Jan 2019
这是一个时间戳,当客户端请求该资源的时候,会用客户端的时间与该事件对比,如果大于改时间说明过期,否则直接使用该资源。
这个方法有个比较大的问题,就是发送请求是用的客户端的时间去对比,客户端与服务器端的时间可能不一致,还有就是客户端的时间是可以自行修改的。所以可能达不到预期的目标。
const content = `document.writeln('<br>JS Update Time:${updateTime()}</br>')`
//设定强缓存,在10秒之后过期
res.setHeader('Expires',new Date(Date.now()+10*1000).toUTCString())
res.statusCode = 200;
res.end(content)
效果对比:
在使用前缓存之前,两次请求的时间是一样的:
在使用强缓存之后,两次请求时间不同:
HTTP1.1
cache-control
当cache-control和expires同时存在的时候cache-control的优先级是比较高的.。该字段是一个时间长度,单位秒,表示该资源过了多少秒之后失效。当客户端请求资源的时候发现该资源还在有效时间内则使用该缓存,它不依赖客户端的时间。cache-control主要包括:max-age / s-maxage / public和private no-cache/ no-store等值。
Cache-directive | 说明 |
---|---|
public | 所有内容都将被缓存(客户端和代理服务器都可以缓存) |
private | 内容只缓存到私有缓存中(客户端可以缓存) |
no-cache | 需要使用协商缓存来验证缓存数据 |
no-store | 所有内容都不会缓存 |
must-revalidation/proxy-revalidation | 如果缓存内容失效,请求需要发送到服务器/或者代理进行重新验证 |
max-age=xxx | 缓存的内容将在xxx秒后失效,这个选项只在HTTP1.1中可用,并如果和Last-Modified一起使用的时候,优先级较高。 |
协商缓存策略
就是需要请求的资源不知道什么时候会更新,服务器也不方便确定具体的时间的情况,采用客户端与服务器协商的方式来解决,协商缓存有两种方法:一种是基于时间,在规定时间后更新了资源的话是需要更新缓存内容;一种是基于内容的,对内容进行摘要,对比内容发生变换的时候进行更新。