网络原理(4)HTTP协议（上）
https://developer.aliyun.com/article/1480753?spm=a2c6h.13148508.setting.14.5f4e4f0ey2EGVf
💕"Echo"💕
作者：Mylvzi
文章主要内容：网络原理(4)HTTP协议
HTTP协议是应用层协议中非常重要的一个协议,诞生于1991年,迄今为止发展出很多的http版本,但是目前仍在大规模使用的诞生于1999年的1.1版本
3.头部(header)
头部中存放着许多键值对,这里介绍几个比较重要的
1.Host
Host中存储是要访问的目标主机的域名或IP地址
一个易错点:Host中其实通常是不包含端口号的,如果端口号是默认的端口号(http80,https443),Host中不含有端口号,如果不是默认端口号,比如:8080,则Host中包含端口号,所以"Host中只包含URL"是不准确的!
2.Referer
用于描述当前网站是由哪一个网站跳转过来的
如果是直接在地址栏中输入地址或者直接在收藏夹中点击,是不会有Referer字段的
Referer字段对于进行流量分析很有用,可以帮助我们分析用户是通过什么渠道进入到网站.同时,Referer字段在商业搜索中也是一个非常重要的机制,通过统计用户有效点击的此处来获取广告利益
3.Content type Content length
Content Length:body中的数据长度
Content type:body中的数据格式
需要说明的是,只有在请求报文中有body,才会在头部有这两个属性.GET请求没有body部分,就不会有这两个属性,POST请求有body部分,存在这两个属性
Content Length可以帮助解决粘包问题:
http协议中的数据也是通过字节流进行传输的,也会存在粘包问题,粘包问题解决的核心是需要找到边界,对于GET请求来说,报文中的空行就是整个报文的结束标志,对于POST请求来说,报文中的空行是body的开始标志,根据Content length来作为body结束的依据
请求报文和响应报文在格式上有所差别,请求报文的格式主要有三种:
- json格式
- form表单格式
- form-data格式
响应报文的格式主要有四种:
- html
- css
- json
- js
- 图片
不同的Content-Type的请求报文,服务器处理的逻辑也是不同的,服务器根据Content-Type返回不同的Content-Type的响应报文,浏览器也会对不同的Content-Type做出不同的处理
4.User-Agent
User-Agent简称UA,描述了用户的主机信息和浏览器信息
可以说UA反映了你使用什么样的设备上网,UA的出现其实也是一个历史发展问题,在早期的浏览器中,可以支持的数据是有限的,只能显示纯文本的数据,但是后来的网页就变的很复杂,新的浏览器也快速的产生,网站新出现的某些特性在旧的浏览器上可能就无法正常的显示,网站的开发者就要考虑网站能否兼容所有的浏览器,就可以通过UA来判断用户使用的浏览器版本,就可以返回不同的版本内容,从而实现对浏览器的兼顾
但是现在,浏览器之间的差距很小,基本上能够支持所有类型的数据,UA在现在通常用来判断是移动端还是PC端,现在就不再是返回不同的界面,而是单纯的统计次数(前端中有"响应式界面"的技术来实现一个html的数据兼容不同的设备)
5.Cookie(重点)
Cookie是http协议中非常重要的一个概念,可以认为是浏览器在本地存储数据的一种机制,用于解决http无状态特点带来的问题, 
浏览器的数据是来自于服务器的,浏览器界面的显示也是需要先向服务器发送一个请求报文,根据服务器返回的数据显示界面,比如当你打开淘宝的界面,就会先向淘宝的服务器发送一个请求登录的报文,如果你想查看淘宝显示的某一个商品,就需要向淘宝的服务器发送一个获取数据的请求,服务器返回响应报文,你才能看到具体的界面信息
但是http协议是一个无状态协议,无状态指的是http并不会保存请求和响应之间的状态,不会对通信双方的数据进行永久化存储.
当通过http协议发送一个新的请求时,就会有一个新的响应返回,协议本身不会保存之前的一切状态,这样做是为了让http协议本身能够传输更多的数据量,增加协议本身的可伸缩性
随着Web的不断发展,无状态的特点也带来了一些问题,比如我们打开淘宝进行购物时,需要先进行登录的请求,登陆成功之后我们进行购物,点击购物之后就会跳转到商品的详情界面,这个操作需要向服务器重新发送一个请求,一旦发送,我们登录的状态就丢失了,从而无法完成购物
我们需要在我们浏览物品时也能保存当前的登录状态,但是http协议本身是无状态的,后来就发展出Cookie这样的机制在浏览器的缓存之中存储通信时产生的一些状态
Cookie中的数据一般都是来自于服务器的响应,当客户端尝试发送新的请求时,就会把Cookie中的数据也一起打包进行发送(当你需要查看商品信息时,就会把你"已登录"的状态一起打包发送给淘宝的服务器)
Cookie中的数据一般是存储到浏览器所在的硬盘文件之中,一个域名是一个维度,网站通过键值对的方式将数据存储到文件之中(现在有的浏览器内置了小型的数据库,可以直接将数据存储到数据库之中,不需要再存储到对应的文件下)
键和值之间通过"=“连接,键值对之间通过”;"区别开来
4.响应状态码
响应报文的首行由HTTP版本,状态码,状态码描述组成,其中状态码是服务器根据请求显示的结果
HTTP中有多种状态码,只需记得一些常见的状态码即可
1xx:信息状态码,表示请求已被接受,继续处理
2xx:成功状态码,表示请求发送成功,服务器接受请求并成功返回响应
3xx:重定向状态码,请求成功发送,但是用户还需要进一步操作,才能得到目标响应
这里最常见的就是浏览器更换域名,当用户尝试访问旧的域名时,服务器就会返回一个状态码为3xx的响应报文,告诉用户新的URL
4xx:客户端错误码,表示客户端发送的请求有误,服务器无法处理(可能是格式有误)
404代表客户端的请求获取的资源在服务器中没有寻找到,服务器就会返回一个状态码为404的响应报文,需要说明的是,这个响应报文中也可以携带数据,所以有的网站的404界面做的就很不错,比如哔哩哔哩
以下是搜狗404界面
补充:http的状态码中418是一个比较特殊的状态码,他不表示任何含义,被认为是一个彩蛋状态码,但是在日常开发中不建议使用
5xx:服务器错误码,服务器在处理请求时发生错误
状态码描述:就是对状态码性质的描述,比如状态码200 状态码描述 ok 表示此次请求成功
用一张图表示各个种类的状态码
四.如何让客户端构造一个HTTP请求
1.在地址栏输入
最常见的构造请求的方式就是直接在地址栏中输入对应的域名,按下回车键,就成功构造出了一个HTTP请求
2.通过html标签触发
第二种方法是,有的特殊的html标签可能触发GET请求(如img/script等)
3.form表单
第三种方法是通过构造form表单来构造一个HTTP请求,也就是通过写代码的方式来实现(form表单本质上还是一个html标签,所以要编写html代码)
form表单的编写
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>form表单</title> </head> <body> <!--先构造一个form表单 第一个属性是要访问的URL 第二个属性是http的方法 form表单中只支持get和post--> <form action="https://www.sogou.com/abc.html" method="get"> <input type="text" name="key1"> <input type="text" name="key2"> <input type="text" name="key3"> <input type="submit" value="提交"> </form> </body> </html>
在浏览器中打开,并进行抓包
4.ajax
form表单的方式有一个缺陷,只能使用GET和POST两种方法,比较局限.ajax通过使用js的api来构造出一个http请求,可以使用任何方法,同样可以使用js对服务器返回的响应进行灵活处理
其实浏览器中有Ajax的原生api,但是使用起来过于繁琐,js对原生的代码进行了封装,使用起来更加的方便
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> </head> <body> <!--1. 引入第三方库 jquery--> <script src="https://cdn.bootcss.com/jquery/3.4.1/jquery.js"></script> <script> // $是一个全部变量 可以使用全局变量内部的方法ajax 在{}内部构造一个http请求的表单 内部其实就是一个json格式的数据 存放的是键值对 let value1 = '1' $.ajax({ type: 'get',// http方法 url: 'https://www.sogou.com/abcd.html?' + 'key1=' + value1,// 具体的地址 // 此处表示一个回调函数 执行时机是服务器收到请求之后 成功返回一个响应(状态码是2xx) success: function(body){ console.log(body) } }) </script> </body> </html>
在浏览器中打开,同样也可以实现HTTP请求的发送
5.使用Postman(常用)
form表单和ajax的实现都是需要进行代码编写,实际上我们可以使用第三方的图形化界面的软件实现,Postman就是其中一个很不错的构造http请求的软件(关于Postman的具体使用大家可以自行查阅,安装和使用很简单)
打开Postman
Post还有一个好处就是可以显示请求的代码形式,如果你想要使用代码,可以直接在这里进行复制 
以上就是网络原理(4)HTTP协议的所有内容,下期博客预告<网络原理(5)HTTPS是如何加密的>
