一起养成写作习惯！这是我参与「掘金日新计划 · 4 月更文挑战」的第N天，点击查看活动详情。

get与post区别

- 传参方式不同
get请求直接在url传参 'url?key=value'
post在请求体传参 xhr.send('key=value')
- 数据大小不同
get有大小限制
post没有大小限制 (一般有文件上传的都是post)
- 传输速度不同
get传输速度快
post传输速度慢
- 安全性不同
get安全性低
post安全性高 (登录、注册必须是post请求)

axios推荐用法

HTTP原理 : 网络传输协议

发送请求：请求报文

请求行请求地址 + 请求方法
请求头浏览器告诉服务器，发给你的数据是什么格式
Content-type: application/x-www-form-urlencoded
请求体请求参数

响应请求：响应报文

响应行响应状态码:
2xx:成功 200成功
3xx:重定向 302 重定向
4xx:前端问题 400参数错误 403没有权限 404 路径错误 413文件超过最大限制
5xx:服务器问题 500服务器内部错误
响应头服务器告诉浏览器，发给你的数据是什么格式
Content-Type: application/json; charset=utf-8
响应体响应数据

发送ajax原理：：发送请求报文

网页从输入url到渲染的流程

DNS解析 域名解析成ip

TCP三次握手

保证数据传输的安全 + 可靠
(1)：TCP：一种传输控制协议
(2)：TCP作用：保证HTTP网络传输是安全 + 可靠的（检测客户端与服务器的网卡是不是互通的）
(3)：TCP三次握手：
第一次: 浏览器 -> 服务器 (你能听到我说话吗?,检测浏览器:发送)
第二次: 服务器 -> 浏览器 (我听到了,你能听到我说话吗。检测浏服务器: 接收 + 发送)
第三次: 浏览器 -> 服务器 (嗯,我听到了. 检测浏览器: 接收)

HTTP请求 : 网络传输协议

浏览器发送请求
服务器处理请求
服务器响应请求

服务器响应数据之后,渲染引擎开始渲染页面

解析html生成：dom树
解析css生成：样式树
dom树与样式树合并得到渲染树
呈现页面

文件上传步骤

（1）创建FormData对象，将文件添加到FormData对象

let fd = new FormData()
fd.append('参数名', 文件 )

（2）ajax发送请求请求体就是 fd
自动设置请求头为文件请求头
自动将文件转为二进制

ajax (HTTP工作原理)