HTTP请求

HTTP协议:是一个使用非常广泛的应用层协议
http就是一个非常典型的应用层协议
在这里插入图片描述
应用层协议,经常是需要进行“自定义协议”的,但是很多时候也不一定非得从零开始设定,也可以基于一些大佬们设计好的协议, 在这个基础上进行定制。

HTTP之所以应用非常广,主要原因就是HTTP的可定制性非常强
在这里插入图片描述
HTTP是一个“一问一答”这种形式的协议
在这里插入图片描述
HTTP协议是一个应用层协议
HTTP请求发送出去,就需要从应用层到物理层,层层封装,接受方在收到之后,在从物理层到应用层 层层分用,最终才能够完成传输

学习HTTP协议,最主要的就是认识HTTP的报文格式
要想认识报文格式,就需要借助一些外部的工具,来吧http协议给显示出来:抓包工具

抓包工具,本质上相当于一个“代理”,借助这样的代理,就可以看到网络上传输的具体数据。
在这里插入图片描述
HTTP协议报文格式:抓包工具
抓包工具有很多:chrome(内置了) wireshark(学校计算机网络课,经常涉及这个)功能全面,使用复杂,IP,tcp,udp,http都能抓
而我使用的是fiddler 专注于http,使用简单

下载fiddler
找到官网
在这里插入图片描述
选择这个经典版 这个纯免费的
选择这个经典版 这个纯免费的
在这里插入图片描述
选择好之后直接下载
在这里插入图片描述
首次使用需要开启https,因为当前网络上主要的协议都是https的,很少直接是http.
在这里插入图片描述
在这里插入图片描述
Fiddler使用
左侧抓到的是包的列表
列表中的内容,是在持续滚动的(非常正常)
因为你的电脑,上面有很多程序,背地里偷偷的发网络请求

如何找到自己发的:
1.先看颜色 , 黑色的包,响应的是普通数据, 蓝色的包,响应的是html, 咱们关注的是搜狗的主页,响应应该是html
2.再看域名 www.sogou.com
3.再看响应的数据长度,一般找长度比较长的

双击要关注的包,右侧就会显示详情
右上是请求,右下是响应
在这里插入图片描述
文本数据(不是二进制)
在这里插入图片描述

这个就是完整的http请求!!
所谓的HTTP请求,其实就是通过代码,构造出一个符合HTTP格式要求的字符串,往tcp的socket中写就行了
一个HTTP请求数据包含了4个部分:

1:首行
在这里插入图片描述

2:Heade
在这里插入图片描述
3.空行:header 的结束标记
4.正文(body)空行后面的内容,有的时候可以没有

响应

在这里插入图片描述
如果看见以上这种情况,响应可能是压缩过的 ,本身http是文本,压缩了就成二进制了,带宽是比较贵(字面),压缩能够减少网络传输的数据量,节省带宽.
把数据压缩,本质上使用cpu资源,换带宽资源,很多网站都会对数据进行压缩
在这里插入图片描述
解压后就会有一个完整的http响应
在这里插入图片描述
响应也分为四个部分:
1.首行
在这里插入图片描述

2.响应报头(header)
在这里插入图片描述

3.空行

在这里插入图片描述

4.正文(此处的正文是个html代码)
在这里插入图片描述

不仅仅是html,包括css,jstup,字体… 浏览器上能显示出来这些内容,都是来自于服务器,都是服务器返回的响应,携带的税局交给浏览器的

HTTP响应,就是这个要显示的html的本体,浏览器拿到这个http响应也就拿到了里面的html就可以显示了

借助上述抓包工具,就看到了HTTP协议请求和响应的详细内容了
进一步的去研究这个格式的细节信息
在这里插入图片描述
http请求

首行:
在这里插入图片描述
GET的语义,是“从服务器这里,拿个啥东西”
POST的语义,”往服务器提交个撒谎东西“

以上两个比较常用

在这里插入图片描述
一般的请求大部分都是GET.
啥时候能看见post请求?
1.登录的时候
2.上传文件的时候
在这里插入图片描述
如果网站密码是明文,同时包被抓了,此时你的密码就泄露了

GET POST,表示的是不同的语言,但是实际上,也并非需要严格遵守
http方法的语言,只是一种“建议”,程序员实际使用也不一定非要遵守
对于body,有没有的问题,也不是绝对的,GET也可能有body,非常少见,POST也可以没有body,也比较少见

重点!!!
如果谈到HET和POST这俩方法,有啥区别,盖棺定论:没有本质区别,使用GET的场景,替换成POST一般也可以,使用POST的场景替换成GET也可以

GET 和POST的区别:
在这里插入图片描述
幂等性,在服务器开发中也是很关键,涉及成幂等之后,这样的请求就可缓存了

HTTP和HTTPS的关系:
https是在http的基础上,加密了一层

HTTP中的URL:
URL 唯一资源定位符,描述了网络上的唯一的一个资源
这个概念严格的说,并非是HTTP里的概念,很多协议都会用到URL
在这里插入图片描述
针对URL来说,结构大概是这几个部分:
在这里插入图片描述

版本号
最常见的是HTTP/1.1
除此之外还有 HTTP/1.0,HTTP/1.1,HTTP2,HTTP3

如果想看HTTP版本可以借助抓包工具查看里面的GET请求
在这里插入图片描述
请求头header
键值对结构的,每个键值对,占一行,键和值之间,使用冒号和空格分割
这里的键值对,可以有N行,会用空行作为结束标记(空行就类似于链表的NULL)
在这里插入图片描述
Header中的键值对,大部分都是HTTP协议规定的,当然这里也是可以添加自定义的键值对
在这里插入图片描述
在这里插入图片描述
Content-Type 描述了body的数据格式
Content-Length 描述了body的长度(字节)
以上两个属性,跟着body走的,如果是一个没有body的get请求,自然header中没有这俩属性
在这里插入图片描述
在这里插入图片描述
在进行前后端交互(浏览器和HTTP服务器),JSON是一种常见的数据格式

Content-Type还会有一些其他的写法
在这里插入图片描述
作为请求,Content-Type就是上面两种写法最多
作为响应,Content-Type还有几种写法:
在这里插入图片描述
在这里插入图片描述
有了上述格式的描述,浏览器/http服务器,才能够认识到当前的body,并正确的进行解析

User-Agent(简称UA):用户代理(用户使用的客户端是啥样的)
在这里插入图片描述
UA主要就是描述了,浏览器是啥版本,系统是啥版本

Referer描述了当前这个网页从哪个页面跳转来的
如果直接在地址栏输入url,此时请求中没有referer(如果点收藏夹,效果一样)
在这里插入图片描述

说明是搜狗主页跳转来的

Cookie(小甜饼干)
在这里插入图片描述
Cookie的本质是浏览器在本地存储 用户自定义数据的一种关键机制!!!
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
1.Cookie从哪里来?
从服务器来的,当我们的浏览器访问服务器的时候,服务器就会在HTTP响应中通过Set-Cookie字段,把Cookit的键值对,返回给浏览器,浏览器收到这个数据,就会在本地存储
在这里插入图片描述
2.Cookie到那里去?
会在下次请求的时候,把cookie带给服务器
Cookie在浏览器这边,只能算是,“暂存”,真正要让这个数据发挥作用,还是得有服务器来使用

3.Cookie有啥用?
是浏览器本地存储数据的机制
存储的数据不一定非得的是角色,任何想存的数据都行(前提是字符串)
由于cookie存储空间有限,一般也不会有cookie存太大

Cookie这里最典型的应用,就是存储用户的身份信息(用户登录之后的身份)

在这里插入图片描述
上述这些键值对,都是允许用户自定义的
这些自定义的键值对,都是HTTP留给程序员进行扩展的地方

HTTP响应,首行
版本号(和请求相同)
状态码 数字,数字表示这次请求执行成功还是识别,失败的原因
状态码描述 通过一个或者一组单词,描述这个状态码的含义
状态码
在这里插入图片描述
常见的状态码:
200 ok 表示的是请求成功!!!
404 Not Found 表示的是要访问的资源不存在
在这里插入图片描述
403 Forbidden访问被拒绝(没有权限)

500 Internal Server Error 服务器内部错误(自己写代码的过程中很常见,互联网不容易见到)
一般你的服务器出bug了,抛异常没有catch到,就会500

504 Gateway Timeout 服务器访问超时了
浏览器给服务器发请求,服务器要返回响应,结果服务器迟迟没有响应

302 Movet emporaroly 临时重定向
下次要不要重定向不一定

301 Moved Permanently 永久重定向
以后都重定向

重定向就是,访问旧的地址,被自动引导到新的地址上
重点!!!
状态码可以分为几个类别:
在这里插入图片描述
HTTP协议的标准文档中有一个特殊的状态码
418 I‘m a teapot (彩蛋)

如何构造HTTP请求?
1.直接通过浏览器地址栏,输入url =>构造出一个GET请求
2.Html中,一些特殊标签,也会触发GET请求
比如:
Link script img a 都能触发GET请求
比如有一个页面中,有一个img标签,此时当页面被加载好之后,浏览器就会根据img标签的src属性给服务器发起一个GET请求,来获取到图片的内容(得是访问的资源是个网络资源)
3.Form表单,可以触发GET和POST请求
Get请求:
在这里插入图片描述
Post请求:
在这里插入图片描述
Form只支持get和post ,put delete options 等其他的http方法,form都无能为力了

4.ajax(重要)
现在最主流的前后端交互方式之一
以前,form更主流,后来有了ajax之后,后来居上了
在这里插入图片描述
4.ajax(重要)
现在最主流的前后端交互方式之一
以前,form更主流,后来有了ajax之后,后来居上了
在这里插入图片描述
ajax是前端和后端,异步交互的一种方式
我们使用jquery里面提供的Ajax.api
在 j q u e r y 中是一个特殊的全局变量 J q u e r y 中的各种 a p i 都是 在jquery中是一个特殊的全局变量 Jquery中的各种api都是 jquery中是一个特殊的全局变量Jquery中的各种api都是的方法
$ 也是变量名的一部分
在这里插入图片描述
在这里插入图片描述
ajax虽然有很多优势,但是有一个非常重要的问题!!
在这里插入图片描述
构造http请求
不仅仅是js可以构造
Java c++都可以直接构造出HTTP请求
在这里插入图片描述
1.注册账号并登录
2.切入到workspace,并且创建一个新的workspase
3.点击+ 创建一个标签页
在这里插入图片描述
在这里插入图片描述

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值