前端开发的核心知识，我们一般首先想到的就是HTML、CSS、JS。其实还有一个重要的核心知识就是HTTP，也是面试必问的一个知识点。这里只是简单的跟大家介绍跟HTTP有关的内容，如果想更深入的学习HTTP，推荐一本书叫《图解HTTP》。
一、HTTP概述
中文翻译是超文本传输协议（英文：HyperText Transfer Protocol,简称：HTTP）。是一种用于分布式、协作式和超媒体信息系统的应用层协议，HTTP是万维网的数据通信的基础。是一个客户端终端(用户)和服务器端(网站)请求和应答的标准。通过使用网页浏览器、网络爬虫或者其它的工具，客户端发起一个HTTP请求到服务器上指定端口(默认端口为80)。我们称这个客户端为用户代理程序(user agent)。应答的服务器上存储着一些资源，比如HTML文件和图像。我们称这个应答服务器为源服务器(origin server)。在用户代理和源服务器中间可能存在多个"中间层"，比如代理服务器、网关或者隧道。
二、HTTP的请求与响应
Server + Client + HTTP
服务器与浏览器的交互
基本过程：(1)浏览器负责发起请求。(2)服务器在 80 端口接收请求(3)服务器负责返回内容（响应）。(4)浏览器负责下载响应内容。
命令行请求和响应示例
(1) curl -s -v -H "MyHeader: helloworld" -- "https://www.baidu.com"
用 curl 创造一个GET请求，并得到响应
用 curl 创造一个GET请求，并得到响应
上面是用curl创造一个GET请求，请求的内容为:
> GET / HTTP/1.1
> Host: www.baidu.com
> User-Agent: curl/7.55.0
> Accept: */*
> MyHeader: helloworld
(2) curl -X POST -s -v -H "Frank: xxx" -- "https://www.baidu.com"
用 curl 创造一个POST请求，并得到响应
用 curl 创造一个POST请求，并得到响应
上面是用curl创造一个POST请求，请求的内容为:
> POST / HTTP/1.1
> Host: www.baidu.com
> User-Agent: curl/7.55.0
> Accept: */*
> MyHeader: helloworld
(3) curl -X POST -d "1234567890" -s -v -H "Frank: xxx" -- "https://www.baidu.com"
用curl创造另一个POST请求
用curl创造另一个POST请求2
上面是用curl创造另一个POST请求，请求的内容为:
POST / HTTP/1.1
Host: www.baidu.com
User-Agent: curl/7.54.0
Accept: */*
Frank: xxx
Content-Length: 10
Content-Type: application/x-www-form-urlencoded
1234567890
Chrome查看请求和响应
用 Chrome 发请求：
1、打开 Network
2、地址栏输入网址
3、在 Network 点击，查看 request，点击「view source」
4、点击「view source」、点击「view source」、点击「view source」，终于点了？可以看到请求的前三部分了。如果有请求的第四部分，那么在 FormData 或 Payload 里面可以看到。
用 Chrome 查看响应：
1、打开 Network
2、输入网址
3、选中第一个响应
4、查看 Response Headers，点击「view source」，点击「view source」，点击「view source」
你会看到响应的前两部分，查看 Response 或者 Preview，你会看到响应的第 4 部分。
三、请求和响应总结
请求的格式：
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 要上传的数据
请求最多包含四部分，最少包含三部分。（也就是说第四部分可以为空）
第三部分永远都是一个回车（\n）
动词有 GET POST PUT PATCH DELETE HEAD OPTIONS 等
这里的路径包括「查询参数」，但不包括「锚点」
如果你没有写路径，那么路径默认为 /
第 2 部分中的 Content-Type 标注了第 4 部分的格式
响应的格式：
1 协议/版本号 状态码 状态解释
2 Key1: value1
2 Key2: value2
2 Content-Length: 17931
2 Content-Type: text/html
3
4 要下载的内容
状态码要背，是服务器对浏览器说的话
1xx 不常用
2xx 表示成功
3xx 表示滚吧
4xx 表示你丫错了
5xx 表示好吧，我错了
状态解释没什么用
第 2 部分中的 Content-Type 标注了第 4 部分的格式
第 2 部分中的 Content-Type 遵循 MIME 规范
四、HTTP 的作用
HTTP 的作用：就是指导浏览器和服务器如何进行沟通。
网友评论