请求与响应

HTTP 请求与响应

HTTP 请求的组成的四部分：

1 动词 路径 协议/版本
2 Key1: value1
2 Key2: value2
2 Key3: value3
2 Content-Type: application/x-www-form-urlencoded
2 Host: www.baidu.com
2 User-Agent: curl/7.54.0
3
4 要上传的数据

• 关于以上各部份内容的碎碎念：

1.请求最多包含四部分，最少包含三部分。（也就是说第四部分能够为空）
2.第三部分永远都是一个回车（n），用于分开第二部分和第四部分，必不可少
3.经常使用动词有 GET获取 POST获取时还传数据 PUT替换全部 PATCH部分替换 DELETE删除等，通常只获取数据不上传就用GET，当要上传数据时就用POST，除此以外还有HEAD、OPTIONS等
4.这里的路径包括「查询参数」，但不包括「锚点」，若是你没有写路径，那么路径默认为 /
5.第 2 部分中的 Content-Type 标注了第 4 部分的格式，二者是一致的

• 用 Chrome 发请求

1.打开 Network
2.地址栏输入网址
3.在 Network 点击，查看 request，点击「view source」，必定要点不然看不到，这里只会显示请求的前三部分。
4.若是有请求的第四部分，那么在 FormData 或 Payload 里面能够看到

HTTP 响应的组成的四部分：

1 协议/版本号 状态码 状态解释
2 Key1: value1
2 Key2: value2
2 Content-Length: 17931
2 Content-Type: text/html
3
4 要下载的内容

• 关于以上各部份内容的碎碎念：

1.状态码要背，详情请点击这
2.第 2 部分中的 Content-Type 遵循 MIME 规范，并且还标注了第 4 部分的格式，二者是一致的。

• 用 Chrome 查看响应

1.打开 Network
2.输入网址
3.选中第一个响应
4.查看 Response Headers，点击「view source」，必定要点不然看不到，点击后你能看到响应的前两部分
5.查看 Response 或者 Preview，你会看到响应的第 4 部分

---

关于JS操做请求与响应的一些小笔记

用JS发请求

//获取登陆页面
//建立AJAX对象
var r = new XMLHttpRequest()
//设置请求方法和请求地址
r.open('GET','/login',true)
//注册响应函数
r.onreadystatechange = function(){
    console.log('state change',r)
}
//发送请求
r.send()

JS能够设置任意请求 header 吗？

第一部分 request.open('get','/xxx')
第二部分 request.setHeader('content-type','x-www-form-urlencoded')
第四部分 request.send('a=1&b=2')

JS能够设置任意响应 header 吗？

第一部分 request.status/request.statusText
第二部分 request.getResponseHeader()/request.getAllResponseHeaders()
第四部分 request.responseText