入坑前端03：关于HTTP
1.什么是http:
http全称（HyperText Transfer Protocol），中文译为超文本传输协议，他是浏览器与服务器进行交互的一种网络协议。
2.关于请求与响应
打开浏览器访问一个网页
我们在网站上打开了一个网站，浏览器负责向服务器发送请求，此时服务器在80端口负责接收请求，服务器在负责返回内容（响应），浏览器在负责下载响应的内容。所以http就是指导浏览器和服务器如何进行沟通。
3.请求
●请求示例
curl -s -v -H "Frank: xxx" -- "https://www.baidu.com"
这个命令我们通过https://www.explainshell.com/explain?cmd=curl+-s+-v+-H+%22Frank%3A+xxx%22+--+%22https%3A%2F%2Fwww.baidu.com%22解释一下。
-s 就是silent，不要显示进度条
-v就是要显示请求和响应，如果你没有-v就显示响应
-H "Frank: xxx"就是添加一个请求头
-- "https://www.baidu.com"就是把你要写的网址写在两根横线后边，（注意--后边要加一个空格）
image.png
●请求的内容为
GET / HTTP/1.1
Host: www.baidu.com
User-Agent: curl/7.54.0
Accept: */*
Frank: xxx
POST / HTTP/1.1
Host: www.baidu.com
User-Agent: curl/7.54.0
Accept: */*
Frank: xxx
●所有请求的格式：
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 要上传的数据
-动词有 GET POST PUT PATCH DELETE HEAD OPTIONS
-路径包括【查询参数】，但不包括【锚点】，如果没有写路径，那么路径默认为/
-User-Agent: curl/7.54.0（表示我用什么软件发起的响应）
Frank: xxx 我接受你返回的任何内容
●如何用chrom开发者工具查看HTTP请求内容
1.打开 Network
2.地址栏输入网址
部分红色区域请求头
4.响应
请求了之后，应该都能得到一个响应，除非断网了，或者服务器宕机了。
响应的示例
HTTP/1.1 200 OK
Accept-Ranges: bytes
Cache-Control: private, no-cache, no-store, proxy-revalidate, no-transform
Connection: Keep-Alive
Content-Length: 2443
Content-Type: text/html
Date: Tue, 10 Oct 2017 09:14:05 GMT
Etag: "5886041d-98b"
Last-Modified: Mon, 23 Jan 2017 13:24:45 GMT
Pragma: no-cache
Server: bfe/1.0.8.18
Set-Cookie: BDORZ=27315; max-age=86400; domain=.baidu.com; path=/
<!DOCTYPE html>
<!--STATUS OK--><html> <head> 后面太长，省略了……
HTTP/1.1 302 Found
Connection: Keep-Alive
Content-Length: 17931
Content-Type: text/html
Date: Tue, 10 Oct 2017 09:19:47 GMT
Etag: "54d9749e-460b"
Server: bfe/1.0.8.18
<html>
<head>
<meta http-equiv="content-type" content="text/html;charset=utf-8"> 后面太长，省略了……
●响应的格式
1 协议/版本号 状态码 状态解释
2 Key1: value1
2 Key2: value2
2 Content-Length: 17931
2 Content-Type: text/html
3
4 要下载的内容
●解释
状态码：
200：成功
301：永久的搬走
302：临时不存在
403：禁止访问
404：网页不存在
500：内部服务器错误
502：网关错误
Content-Type：表示响应过来文件的格式（html,css,js）
●用chrom查看响应
1.打开 Network
2.输入网址
3.选中第一个响应
4.查看 Response Headers，点击「view source」
image.png
点击「view source」，点击「view source」
你会看到响应的前两部分
5.查看 Response 或者 Preview，你会看到响应的第 4 部分
image.png
