Http 2021-08-25

Http

一 、缓存

1. 通常浏览器缓存策略分为两种：强缓存（Expires，cache-control）和协商缓存（Last-modified ，Etag），并且缓存策略都是通过设置 HTTP Header 来实现的。
2. 缓存的出现是为了优化浏览器减少重复的请求
3. 缓存过程
   

浏览器缓存过程

1. 浏览器第一次加载资源，服务器返回200，浏览器将资源文件从服务器上请求下载下来，并把response header及该请求的返回时间一并缓存；
2. 下一次加载资源时，先比较当前时间和上一次返回200时的时间差，如果没有超过cache-control设置的max-age，则没有过期，命中强缓存，不发请求直接从本地缓存读取该文件（如果浏览器不支持HTTP1.1，则用expires判断是否过期）；如果时间过期，则向服务器发送header带有If-None-Match和If-Modified-Since的请求；
3. 服务器收到请求后，优先根据Etag的值判断被请求的文件有没有做修改，Etag值一致则没有修改，命中协商缓存，返回304；如果不一致则有改动，直接返回新的资源文件带上新的Etag值并返回200；
4. 如果服务器收到的请求没有Etag值，则将If-Modified-Since和被请求文件的最后修改时间做比对，一致则命中协商缓存，返回304；不一致则返回新的last-modified和文件并返回200；

1.强缓存

强缓存是有两个属性分别是Expires和cache-control

1. expires：出现在http1.0中，是设置一个过期时间的，当浏览器再次加载的时候如过时间大于设置的时间就要去看协商缓存了，如果没有过期就会命中强缓存。它是绝对时间所以有一个缺点是，失效时间是一个绝对时间，如果服务器时间与客户端时间偏差较大时，就会导致缓存混乱。而服务器的时间跟用户的实际时间是不一样是很正常的，所以 Expires 在实际使用中会带来一些麻烦。
2. cache-control：是http1.1的规范是相对时间它通过使用cache-control：max-age=多少秒 和一个data表示发送时间来进行的判断
   • no-store直接禁止浏览器缓存数据，每次请求资源都会向服 务器要完整的资源， 类似于 network 中的 disabled cache。
   • public 可以被所有用户缓存，包括终端用户和 cdn 等中间件代理服务器。
   • private 只能被终端用户的浏览器缓存。

2. 协商缓存

协商缓存的四个属性 ETag 和 If-None-Match 以及Last-Modified和If-Modified-Since

• etag是对资源的一个类似于版本表示的一个属性。是上次加载资源是给的存放在response header 只有资源改变的时候Etag才会改变。浏览器在下一次加载资源向服务器发送请求时，会将上一次返回的Etag值放到request header里的If-None-Match里，服务器接受到If-None-Match的值后，会拿来跟该资源文件的Etag值做比较，如果相同，则表示资源文件没有发生改变，命中协商缓存。
• Last-Modified是该资源文件最后一次更改时间，服务器会在response header里返回，同时浏览器会将这个值保存起来，在下一次发送请求时，放到request header里的If-Modified-Since里，服务器在接收到后也会做比对，如果相同则命中协商缓存。

为何既有last-modified又有Etag
考虑以下情况：

1. 一些文件也许会周期性的更改,但是他的内容并不改变(仅仅改变的修改时间),这个时候,我们并不希望客户端认为这个文件被修改了,而重新 get
2. 某些文件修改非常频繁,比如在秒以下的时间内进行修改(比方说 1s 内修改了 N 次),If-Modified-Since能检查到的粒度时 s 级的,这种修改无法判断(或者说 UNIX 记录 MTIME只能精确到秒)
3. 某些服务器不能精确得到的文件的最后修改时间

二、网络问题

1. 请求方式

• get : GET会方法请求指定的页面信息，并返回响应主体，GET被认为是不安全的方法，因为GET方法会被网络蜘蛛等任意的访问。
• post : 向指定资源提交数据，请求服务器进行处理，如：表单数据提交、文件上传等，请求数据会被包含在请求体中。POST方法是非幂等的方法，因为这个请求可能会创建新的资源或/和修改现有资源。
• head : GET方法一样，都是向服务器发出指定资源的请求。但是，服务器在响应HEAD请求时不会回传资源的内容部分,即：响应主体。这样，我们可以不传输全部内容的情况下，就可以获取服务器的响应头信息。HEAD方法常被用于客户端查看服务器的性能。
• options : 请求与HEAD类似，一般也是用于客户端查看服务器的性能。这个方法会请求服务器返回该资源所支持的所有HTTP请求方法，该方法会用’*'来代替资源名称，向服务器发送OPTIONS请求，可以测试服务器功能是否正常。JavaScript的XMLHttpRequest对象进行CORS跨域资源共享时，就是使用OPTIONS方法发送嗅探请求，以判断是否有对指定资源的访问权限。
• trace : 请求服务器回显其收到的请求信息，该方法主要用于HTTP请求的测试或诊断。
• put : 请求会伸向指定资源位置上传其最新内容，PUT方法是幂等的方法。通过该方法客户端可以将指定资源的最新数据传送给服务器取代指定的资源的内容。
• delete : 请求用于请求服务器删除所请求URI（统一资源标识符，Uniform Resource Identifier）所标识的资源。DELETE请求后指定资源会被删除，DELETE方法也是幂等的。
• connect : ONNECT方法是HTTP/1.1协议预留的，能够将连接改为管道方式的代理服务器。通常用于SSL加密服务器的链接与非加密的HTTP代理服务器的通信。
  

2. https的数据加密传输过程

1. 客户端请求服务器获取证书公钥
2. 客户端(SSL/TLS)解析证书（无效会弹出警告）
3. 生成随机值
4. 用公钥加密随机值生成密钥
5. 客户端将秘钥发送给服务器
6. 服务端用私钥解密秘钥得到随机值
7. 将信息和随机值混合在一起进行对称加密
8. 将加密的内容发送给客户端
9. 客户端用秘钥解密信息
   

3. 状态码

分类	描述	状态码
2xx	成功，表示请求已被成功接收、理解、接受	200：OK请求正常处理 204：请求处理成功，但是没有资源可返回 206：对资源的某一部分的请求
3xx	重定向，要完成请求必须进行更进一步的操作	301：永久重定向，请求的资源已经被永久的移动到新URI，今后任何新的请求都应使用新的URI代替。 302：临时性重定向，资源只是临时被移动，客户端应继续使用原有URI。 304：缓存中读取，未修改。所请求的资源未修改，服务器返回状态码时，不返回任何资源，客户端通常会缓存访问过的资源。
4xx	客户端错误，请求有语法错误或请求无法实现	400：请求报文中存在语法错误 401：请求未经授权，需要有同感HTTP认证的认证信息 403：服务器收到请求，但是拒绝提供服务 404：无法找到请求资源
5xx	服务器端错误，服务器未能实现合法的请求	500：服务器在执行时发生错误 503：服务器处于超负荷或者正在进行停机维护

4. http不同版本

1. 二进制协议

• HTTP/1.1 版的头信息肯定是文本（ASCII编码），数据体可以是文本，也可以是二进制。HTTP/2 则是一个彻底的二进制协议，头信息和数据体都是二进制，并且统称为”帧”：头信息帧和数据帧。
• 二进制协议解析起来更高效、“线上”更紧凑，更重要的是错误更少。

2. 完全多路复用

• HTTP/2 复用TCP连接，在一个连接里，客户端和浏览器都可以同时发送多个请求或回应，而且不用按照顺序一一对应，这样就避免了”队头堵塞”。

3. 报头压缩

• HTTP 协议是没有状态，导致每次请求都必须附上所有信息。所以，请求的很多头字段都是重复的，比如Cookie，一样的内容每次请求都必须附带，这会浪费很多带宽，也影响速度。
• 对于相同的头部，不必再通过请求发送，只需发送一次；
• HTTP/2 对这一点做了优化，引入了头信息压缩机制；
• 一方面，头信息使用gzip或compress压缩后再发送；
• 另一方面，客户端和服务器同时维护一张头信息表，所有字段都会存入这个表，产生一个索引号，之后就不发送同样字段了，只需发送索引号。

4. 服务器推送

• HTTP/2 允许服务器未经请求，主动向客户端发送资源；
• 通过推送那些服务器任务客户端将会需要的内容到客户端的缓存中，避免往返的延迟

5. ajax原理

Ajax相当于在用户和服务器之间加了一个中间层,使用户操作与服务器响应异步化。并不是所有的用户请求都提交给服务器，像一些数据验证和数据处理等都交给Ajax引擎自己来做，只有确定需要从服务器读取新数据时再由Ajax引擎代为向服务器提交请求。

Ajax的原理简单来说通过XmlHttpRequest对象来向服务器发送异步请求，从服务器获得数据，然后用JavaScript来操作DOM而更新页面。这其中最关键的一步就是从服务器获得请求数据。要清楚这个过程和原理，我们必须对 XMLHttpRequest有所了解。

XMLHttpRequest是ajax的核心机制，它是在IE5中首先引入的，是一种支持异步请求的技术。简单的说，也就是JavaScript可以及时向服务器提出请求和处理响应，而不阻塞用户。达到无刷新的效果。

6. 跨域

同源策略：协议+端口号+域名

1. JSONP 只能解决GET跨域(问的最多)
   原理：动态创建一个script标签。利用script标签的src属性不受同源策略限制。因为所有的src属性和href属性都不受同源策略限制。可以请求第三方服务器数据内容。
   步骤：
   (1) 创建一个script标签 2. script的src属性设置接口地址 3. 接口参数,必须要带一个自定义函数名 要不然后台无法返回数据。 4. 通过定义函数名去接收后台返回数据

2. CORS：跨域资源共享
   原理：服务器设置Access-Control-Allow-OriginHTTP响应头之后，浏览器将会允许跨域请求
   限制：浏览器需要支持HTML5，可以支持POST，PUT等方法兼容ie9以上
   需要后台设置
   Access-Control-Allow-Origin: * //允许所有域名访问，或者 Access-Control-Allow-Origin: http://a.com //只允许所有域名访问

3. 设置 document.domain
   原理：相同主域名不同子域名下的页面，可以设置document.domain让它们同域
   限制：同域document提供的是页面间的互操作，需要载入iframe页面

4. ES5 postMessage
   ES5新增的 postMessage() 方法允许来自不同源的脚本采用异步方式进行有限的通信，可以实现跨文本档、多窗口、跨域消息传递.
   语法:postMessage(data,origin)

5. 用Apache做转发（逆向代理），让跨域变成同域

原文参考：https://www.cnblogs.com/suihang/p/12855345.html