360前端星计划-前端常用的HTTP知识

1、HTTP在网络中的位置

HTTP是应用层协议。

2、请求和响应报文

<method> <request-URL> <version>
<headers>

<entity-body>

<version> <status> <respon-phrase>
<headers>

<entity-body>

3、请求类型

请求类型	描述
GET	获取一个资源内容
POST	新增一个资源
PUT	更新资源内容
DELETE	删除资源
OPTIONS	根据返回判断是否有对其请求的权限
HEAD	只返回 head，不返回实体内容
PATCH	更新部分内容

4、状态码

状态码	描述
1xx	请求已接受，需要继续处理
2xx	请求已经正确处理
3xx	重定向
4xx	客户端错误
5xx	服务端错误

5、常见状态码

状态码	描述
101	切换协议，如：将 HTTP 协议切换为 WebSocket 协议
200	成功
206	返回部分内容，如：大文件下载
301	永久重定向，如：资源更换路径或改名
302	临时重定向，如：当前请求需要登录，临时跳转到登录页
304	资源未修改，不返回实体内容，客户端可直接读取本地缓存内容
400	错误请求
403	拒绝执行，如：无对应的访问权限
404	资源找不到，如：服务器已经删除该资源
413	请求实体过大，如：服务端限制了上传的文件大小
500	服务端内部错误，如：数据处理异常导致报错
502	作为网关或代理服务器时，上游服务器异常
504	作为网关或代理服务器时，上游服务器处理超时

6、url

<scheme>://<user>:<password>@<host>:<port>/<path>;<params>?<query>#<frag>

http://<host>:<port>/<path>?<query>#<frag>

ftp://<user>:<password>@<host>:<port>/<path>;<params>

受限字符：%/.#?;:$+@&= 以及非US-ASCⅡ字符集字符

7、header分类

通用

Date: Tue, 3 Oct 2019 02:16:00 GMT
Connection: close

请求

User-Agent: Mozilla/5.0 (Linux; U; Android 4.0.2; en-us; Galaxy Nexus Build/ICL53F) AppleWebKit/534.30 (KHTML, like Gecko) Version/4.0 Mobile Safari/534.30
Accept: */*

响应

Server: Nginx
Last-Modified: Thu, 16 Oct 2019 10:15:16 GMT

实体

Content-Type: text/html; charset=utf-8
Content-Length: 100

扩展（自定义）

X-Powered-By: thinkjs-3.0.4
X-Cache: hit

8、cookie

GET / HTTP/1.1
Host: m.so.com
Connection: keep-alive
Cookie: __guid=34870781.3073803881376862000

HTTP/1.1 200 OK
Server: nginx/1.2.9
Date: Wed, 08 Oct 2014 05:59:59 GMT
Connection: keep-alive
Set-Cookie: thinkjs=s4mhqotbdbg9uh917lu8d5bub5; path=/
Content-Encoding: gzip

Set-Cookie: <name>=<value>[; <name>=<value>]... [; expires=<date>][; domain=<domain_name>] [; path=<some_path>][; secure][; httponly][; samesite=<samesite_value>Set-Cookie: <name>=<value>[; <name>=<value>]... [; expires=<date>][; domain=<domain_name>] [; path=<some_path>][; secure][; httponly][; samesite=<samesite_value>]

响应头里也可以有多个 Set-Cookie

9、cookie安全策略

• path
• domain (hostonly*)
• expires (max-age)
• secure
• httponly
  XSS 漏洞盗取 Cookie，设置 httponly
• SameSite
  CSRF 漏洞，设置 token/samesite

10、session

• 服务器侧对应为 Session，基于 Cookie 存放用户信息
• Cookie 有效期为 Session（随浏览器进程退出而失效）

11、content type

• application/x-www-form-urlencoded
• multipart/form-data
• application/json
• text/xml

12、性能优化

• keep-alive
  • HTTP 1.0 原本不支持 Keep-Alive，后来扩充了 Connection: Keep-Alive
  • HTTP 1.1 默认支持 Keep-Alive，除非显式指明 Connection: close
• 减少网络传输大小
  • 主要是文本资源
  • 大约减少 60%
  • 文件过小不宜压缩（<1K）
• 缓存
  
  • LocalStorage
  • ServiceWorker
• http2/http3
  • HTTP2
    • 二进制传输
    • 多路复用
    • 头部压缩
    • server push
  • HTTP3
    • 基于 QUIC 协议（UDP）

13、HTTP抓包工具

• Wireshark
• Fiddler
• Firebug for Firefox
• Chrome 开发者工具
• IE8+ 自带的开发者工具

14、HTTP发包工具

• telnet / curl
• Fiddler *
• Tamper for Firefox
• Postman for Chrome *
• Paw for OSX

参考书籍

• 《图解HTTP》
  • 作者：上野宣
  • 译者：于均良
• 《HTTP权威指南》
  • 作者：David Gourley等
  • 译者：陈娟、赵振平
• 《web性能权威指南》
  • 作者：Ilay Grigorik
  • 译者：李松峰