首页  思维导图  详情

HTTP 协议

2021-03-24 15:02:50   0  举报





仅支持查看

AI智能生成

前端面试_HTTP协议

HTTP

前端面试

作者其他创作

大纲/内容

HTTP 状态码

状态码分类

1xx 服务器收到请求
2xx 请求成功，如 200
3xx 重定向，如 302
4xx 客户端错误，如 404
5xx 服务端错误，如 500

常见状态码

200 请求成功
301 永久重定向（配合 locaiton，浏览器自动处理）
302 临时重定向（配合 location，浏览器自动处理）
304 资源未被修改
404 资源未找到
403 没有权限
500 服务器错误
504 网关超时

Restful-API

methods

传统的 methods：

get 获取服务器数据
post 向服务器提交数据

现在的 methods：

get 获取数据
post 新建数据
patch/put 更新数据
delete 删除数据

一种新的 API 设计方法
与传统 API 的区别

传统 API 设计：把每个 url 当做一个功能
Restful API 设计: 把每个 url 当做一个唯一的资源

如何把 url 设计成一个资源？

尽量不用 url 参数

传统 API 设计： /api/list?pageIndex=2
Restful API 设计： /api/list/2

用 method 表示操作类型

传统 API 设计：

post /api/create-blog
post /api/update-blog?id=100
get /api/get-blog?id=100

Restful API 设计：

post /api/blog（创建）
patch /api/blog/100（更新）
get /api/blog/100（获取）

HTTP Headers

常见的 Request Headers

Accept 浏览器可接受的数据格式
Accept-Encoding 浏览器可接收的压缩算法，如gzip
Accept-Language 浏览器可接收的语言，如zh-CN
Connection: keep-alive 一次 TCP 连接重复使用
Cookie 每次 http 请求时都会带上
Host 域名
User-Agent 简称 UA，浏览器信息
Content-type 发送数据的格式，如 application/json

常见的 Response Headers

Content-type 返回数据的格式，如 application/json
Content-length 返回数据的大小，多少字节
Content-Encoding 返回数据的压缩算法，如 gzip
Set-Cookie 服务端需要通过该字段来修改浏览器中的 cookie

自定义 header

应用场景：有些 API 需要在 headers 里面加他们的秘钥

缓存相关的 headers

Cache-Control
Expires
Last Modified
If-Modified-Since
Etag
If-None-Match

HTTP 缓存

什么是缓存？

把一些没有必要重新获取的资源暂存在客户端

为什么需要缓存？

减少不必要的网络请求,使得页面加载更快；
网络请求是不稳定，加大了页面加载的不稳定性；

哪些资源可以被缓存？

静态资源（js css img）

webpack 打包时为静态资源加上 hash，hash 是通过资源内容计算的，文件内容修改后会生成新的 hash（新的文件名）

强制缓存（Cache-Control）

在 Response Headers 中，由服务端决定要不要添加
控制强制缓存的逻辑

Cache-Control 的值

max-age : 最长过期时间（秒）
no-cache : 不用本地强制缓存，正常向服务端请求资源，由服务端决定缓存措施
no-store （不常见）: 不用本地强制缓存，也不用服务端的缓存措施（协商缓存），直接由服务端返回新资源
private : 只允许最终用户缓存
pubilc : 用户和中间的代理都能缓存资源

Expires

在 Response Headers 中，同为控制缓存过期，已被 Cache-Control 替代

协商缓存（对比缓存）