前言
🌟🌟本期讲解关于HTTP协议的重要的机制~~~
🌈感兴趣的小伙伴看一看小编主页:GGBondlctrl-CSDN博客
🔥 你的点赞就是小编不断更新的最大动力
🎆那么废话不多说直接开整吧~~
目录
编辑
1.HTTP协议
1.1HTTP介绍
1.2HTTP的工作
1.3HTTP的抓包
1.4HTTP的报文
2.HTTP 请求
2.1认识URL
2.2认识URL encode
2.3认识方法(method)
2.4认识请求 "报头" (header)
1.HOST
2.Content-Length
3.Content-type
4.User-Agent (简称 UA)
5.Referer
3.总结
1.HTTP协议
1.1HTTP介绍
http:全称超文本传输协议,是在应用层使用广泛的一种协议;
具体的关于http的发展时间如下:
http最早出现是在1991年,⽬前已经发展为最主流使⽤的⼀种应⽤层协议;
最近版本的HTTP:后面出现的HTTP2.0与HTTP3.0引入了更多的特性:
1.提高了传输的效率
2.提高了传输的安全性
并且在HTTP3.0之前都是使用的传输层协议就是TCP,我们知道TCP具有可靠性,但是效率比较低,所以在HTTP3.0时传输层使用就是UDP,并实现了一些列复杂的机制,实现可靠性~~~
问题1:什么是超文本传输协议?
我们知道文本就是字符串,就是能在utf8码表上找到合法的字符,但是超文本不仅仅是字符串而且还包括了图片,特殊的格式;
1.2HTTP的工作
用处:HTTP主要的使用场景就是浏览器网站对于服务器之间的数据传输;
补充:这里的网页是由HTML来进行构建的,但是一个好的网页还需要CSS与Javascript来进行公共的实现(前段的三剑客)
解释:当我们使用浏览器对一个网页进行访问的时候,浏览器就会给服务器发起一个http请求,然后服务器进行计算后通过http响应返回~~~
注意: HTTP的交互过程中,是非常典型的“一问一答”过程,但是在网站的开发中这也是够用了,并且在服务器自动给浏览器发送消息,应用层还提供了websocket搭配http来进行使用
1.3HTTP的抓包
抓包工具:这里就涉及到一个重要的工具“抓包工具”,这里抓http的报文所以使用的就是fiddler
问题2:什么是抓包工具?
抓包工具本质上是一个代理程序,能够获取到网络上传输的数据,他是工作在应用层上面的,这里可以理解为一个中间商,对于浏览器对于服务器数据的传输,他是十分清楚的;
大概的流程就是如下:
问题3:如何下载fiddler?
具体步骤如下:
1.先搜索fiddler的官网,注意不要点击到盗版的了:
2.然后再点击进入页面后,然后点击经典版本的fiddler:
3.点击尝试下载按键:
4.安装完成后,进入页面点击tool的option:
5.最后点击http中所有的选项进行勾选:
最后如果跳出安全许可,这个一定要点击yes,一定一定要点击yes~~~
1.4HTTP的报文
打开一个网站,浏览器和这个服务器之间的http交互不是只有一次的,是很多次的第一次交互就是拿到这个页面的html,还有css与js,并且html被加载后还会触发http的请求,然后又是js等又触发http~~~
所以我们直接进行一次抓包,我们进行百度的抓包进行举例:
可以看到此时蓝色部分就是html,他往往是一个网站的入口;
接下来我们点击raw然后点击用记事本打开即可看到其内部http的报文结构:
在右下角点击用记事本打开:
最后可以看到此时的报文结构就是如下所示的:
那么这个只是一小部分,所以接下来的将进行具体的讲解;
1.HTTP的请求结构
1.首行:这里包含了三个部分,如下图示所示:
GET https://www.baidu.com/ HTTP/1.1
GET:这里表示就是方法;
中间部分:这里即是URL;
HTTP/1.1:这里就是HTTP的版本号
2.请求头:请求的属性, 冒号分割的键值对;每组属性之间使⽤\n分隔;遇到空⾏表⽰Header部分结束
Host: www.baidu.com
Connection: keep-alive
sec-ch-ua: "Chromium";v="130", "Microsoft Edge";v="130", "Not?A_Brand";v="99"
sec-ch-ua-mobile: ?0
sec-ch-ua-platform: "Windows"
这里只截取了一小部分
3.空行:这里表示的就是请求头的结束,最为一个标记
4.正文(body):http的载荷部分 Body允许为空字符串. 如果Body存在, 则在Header中会有⼀个 Content-Length属性来标识Body的⻓度;
2.HTTP的响应结构
1.首行 :这里也是包含了三个部分,如下:
HTTP/1.1 200 OK
HTTP/1.1:代表的就是版本号
200:状态码
OK:状态码的描述
2.响应头:响应的属性,这里和上面的请求是一致的
Connection: keep-alive
Content-Security-Policy: frame-ancestors 'self' https://chat.baidu.com http://mirror-chat.baidu.com https://fj-chat.baidu.com https://hba-chat.baidu.com https://hbe-chat.baidu.com https://njjs-chat.baidu.com https://nj-chat.baidu.com https://hna-chat.baidu.com https://hnb-chat.baidu.com http://debug.baidu-int.com;
Content-Type: text/html; charset=utf-8
Date: Fri, 01 Nov 2024 13:29:43 GMT
这里小编只截取了一小部分;
3.空行:这里也是进行响应头的结束标记
4.响应正文: 这里就是载荷,并且这里的响应载荷就是html
具体如下:
<!DOCTYPE html><!--STATUS OK--><html><head><meta http-equiv="Content-Type" content="text/html;charset=utf-8"><meta http-equiv="X-UA-Compatible"
问题4:为啥http报文存在空格这种结构?
1.HTTP 协议并没有规定报头部分的键值对有多少个. 空⾏就相当于是 "报头的结束标记"
2.HTTP 在传输层依赖 TCP 协议, TCP 是⾯向字节流的. 如果没有这个空⾏, 就会出现 "粘包问题"
这里的使用TCP协议是在HTTP3.0之前哦,现在主流不是这个~~~
2.HTTP 请求
2.1认识URL
URL基本格式:平时我们俗称的 "⽹址" 其实就是说的 URL (Uniform Resource Locator 统⼀资源定位符)(即描述一个网络上的资源的位置)
1.简单URL
我们最常见的最简单的URL就是:https://www.baidu.com;分解一下就是:协议名称+域名
2.基本的URL
就拿我们一个csdn的网址为例:
https://mp.csdn.net/mp_blog/creation/editor?spm=1010.2135.3001.4503
内容解释:
此时就明显多了很多的内容,问号之前就是一个路径(带有层次结构的路径),后面的就是查询字符串,这里的意思是编写的程序员知道的,我们不知道~~
3.完整的URL
具体样式如下:
小编就讲解几个比较重要的;
1.服务器地址与服务器端口号:
这里代表就是域名或者IP地址,后面带有的端口号表示访问服务器那个端口
2.查询字符串:
就是代表的是对于请求进行补充,键值对的格式,键和值用“=”,键值对用&符号进行分割;
3.登录信息:
现在都是通过单独的登录页面进行身份的验证
4.片段标识符:
表示当前某页的某个部分,不同片段标识可以完成页面内的跳转
总结:这个URL就是代表的一个在网络上的资源位置,通过IP地址知道服务器在哪里,端口号就知道是哪一个程序,文件路径就知道访问的那个资源;
2.2认识URL encode
1.问题的提出
我们在上面的介绍中了解到查询字符串(query string)是自定义的键值对,那么在URL本身中有些特殊符号具有特定的意义,如果当query string包含了与URL特殊的符号,此时就会导致浏览器或者服务器解析失败
那么此时对这个特殊符号进行转义,这个过程就叫做URL encode
2.解析过程
这里的解析过程就是将特殊符号的ascii码值拿出来,进行十六进制的转化,最后在前面加上“%”;
例如:这里的++就是解析后16进制为2B,2B然后再这两个字符之前加上“%”就实现了转义~~~
2.3认识方法(method)
且看下面的一张图:
这里主要使用的就是前面两个就是我们经常使用的,但是这里的GET与POST的方法是可以相互替换使用的,这上面的表只是一厢情愿,我们一般不会按照这里说明进行编写;
我们可以看到此时就是一个GET;
当此时还有POST的一个方法:
一般来说:GET是没有body的,然后POST是存在body的,GET通常会把补充信息存在查询字符串里,然后POST是存在body里,当然这只是常见的情况;
在POST的body中我们常使用就是base64进行编码,通过四个字节来表示三个字节,主要是为了去掉原始是数据的二进制数据;(有些场合只适用于文本)
可以看到这里body的base64编码:
{"username":"18582914619","password":"QTQ0s88XKlMuE7C0/s30OQ==","uuid":"a142cb0d852f4d53ba570922b34e7dc3","status":0}
GET与POST的区别:
在本质上,这两个其实并没有区别,但是在习惯上这里还是存在区别的
1、GET通常把数据放在URL的查询字符串里,POST主要把数据放在body里;
2、GET通常表示的是拿到数据,而POST主要表示的是传输数据给服务器;
3、在标准文档中GET是被要求设计成幂等的,而POST无这个要求;
4、GET可以被浏览器收藏但是POST不可以
所谓的幂等:就是输入的内容是一定的,多次输出的结果不是一定的,那么就叫做不是幂等的相反多次输出的结果是一定的,那么就叫做幂等的;
2.4认识请求 "报头" (header)
1.HOST
表示服务器的IP地址以及端口;
2.Content-Length
表示body中的数据的长度
由于HTTP底层也是基于tcp进行,连续传输多个http数据报,应用程序读这些数据的时候就要明确包与包之间的分界;
3.Content-type
表示body中数据的格式;
可以看到此时这里的格式就是json的格式,即描述body中数据的格式;
除此之外还有xml的格式,当然这里还有x-www-form-urlencoded,即from表单,表示的就是通过HTML中的from标签表示出来一种格式;
补充:由于服务器与浏览器之间的交互是非常低效的,所以会把固定不变的内容缓存到硬盘上,那后序的读取直接从硬盘上读取,提升效率;所以这里抓包的时候有些就是灰色的;
4.User-Agent (简称 UA)
User-Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/130.0.0.0 Safari/537.36 Edg/130.0.0.0
可以看到这里主要描述了,操作系统的信息,以及浏览器的信息;
所以UA:主要描述了用户使用的设备信息;
解决问题:
若存在开发中的新特性,存在新老设备的兼容问题,那么使用UA就可以根据这里的用户使用的设备信息,来决定设否使用新的特性;例如我们现在的pc端和手机端,这里的UA就保存这里的信息,来判断用户设备是什么来决定这里的展示页面是横屏还是竖屏的;
后来有了响应式的布局,那么此时就是通过css3的媒体查询来进行当前用户的屏幕尺寸,来进行应用对应的样式;
5.Referer
所谓的referer主要是描述了当前的页面是从哪里来的;
Referer: https://cn.bing.com/search?q=%E6%AF%94%E7%89%B9%E6%95%99%E5%8A%A1%E7%B3%BB%E7%BB%9F&gs_lcrp=EgRlZGdlKgcIARBFGMIDMgcIABBFGMIDMgcIARBFGMIDMgcIAhBFGMIDMgcIAxBFGMIDMgcIBBBFGMIDMgcIBRBFGMIDMgcIBhBFGMIDMgcIBxBFGMID0gEKNTk2NTM0ajBqMagCCLACAQ&FORM=ANNTA1&PC=CNNDDB
6.cookie
本质上就是:在浏览器上本地持久化存储数据的机制,一般用于访问服务的身份标识;
来源:我们浏览器是可以访问我们硬盘文件,但是网页不行,所以浏览器给网页提供了API来有限度的存储一定的数据,不能随意访问文件系统;
所以就有cookie这样的存储系统,还有Lockstorage和indexDB,但是cookie仍然是主流;
过程:HTTP中的cookie字段就会把本地存储的信息发送给服务器1,然后服务器就会就会通过HTTP中set-cookie字段给浏览器反馈保存哪些数据;
重要的结论:
cookie从哪里来:即服务器返回给浏览器的,每次登录成功后
cookie去哪里:cookie会存储在浏览器本地的磁盘上,每次访问服务器都会带上cookie
cookie的存储格式:这里的数据是以键值对的形式进行存储的,具体内容是程序员自定义的
cookie的作用:作为身份标识,每次访问服务器带上cookie就是告诉服务器自己是谁
cookie浏览器中如何进行存储:即通过访问的不同域名的维度进行存储,并且是硬盘本地保存
3.总结
本期由于篇幅太长,http的相关的内容还没有完全介绍,主要是讲解了HTTP的报文简单介绍,以及UPL的认识,URL encode,以及比较常见的方法和比较重要的报头结构中的一些重要的概念;小编会在下期进行剩下的HTTP的知识讲解,以及HTTPS的开头;
🌅🌅🌅~~~~最后希望与诸君共勉,共同进步!!
💪💪💪以上就是本期内容了, 感兴趣的话,就关注小编吧。
😊😊 期待你的关注~~~