Ajax学习（5）HTTP协议

最新推荐文章于 2023-02-07 18:29:07 发布

GDUF-LZ

最新推荐文章于 2023-02-07 18:29:07 发布

阅读量225

点赞数

分类专栏： Ajax学习文章标签： http ajax 学习前端

本文链接：https://blog.youkuaiyun.com/weixin_47758346/article/details/124539545

版权

Ajax学习专栏收录该内容

5 篇文章

订阅专栏

HTTP协议简介

通信协议：

Communication Protocol，是指通信双方采用约定好的格式来发送和接收消息，这种事先约定好的通信格式，就叫做通信协议。

互联网中的通信协议：

客户端与服务器之间要实现网页内容的传输，双方必须遵守网页内容的传输协议。

网页内容又称超文本，因此网页内容的传输协议也叫做超文本传输协议（HyperText Transfer Protocol），也就是 HTTP 议协议。

HTTP协议规定了客户端与服务器之间进行网页内容传输必须遵守的传输格式。它采用可请求/响应的交互模型：

（图片来自网络）
在这里插入图片描述

HTTP请求消息

客户端发起的请求叫HTTP请求，发送到服务器的消息叫做HTTP请求消息。（HTTP请求消息又称请求报文）

HTTP请求信息的组成部分

请求行(request line)、请求头部(header)、空行和请求体
在这里插入图片描述

请求行

请求行由请求方式，URL和HTTP协议版本组成

在这里插入图片描述

查看不同请求方式的请求行：

<head>
    ...
  <script src="jquery.js"></script>
</head>

<body>
    
  <button id="btnGET">GET请求</button>
  <button id="btnPOST">POST请求</button>

  <script>
      //请求地址从网上得到，测试可用
    $(function () {
      // 发起 GET 请求
      $('#btnGET').on('click', function () {
        $.ajax({
          method: 'GET',
          url: 'http://www.liulongbin.top:3006/api/get',
          data: {
            name: 'zs',
            age: 20
          },
          success: function (res) {
            console.log(res)
          }
        })
      })

      // 发起 POST 请求
      $('#btnPOST').on('click', function () {
        $.ajax({
          method: 'POST',
          url: 'http://www.liulongbin.top:3006/api/post',
          data: {
            name: 'lizhi',
            age: 20
          },
          success: function (res) {
            console.log(res)
          }
        })
      })
    })
  </script>
</body>

</html>

在网页”检查“中查看”网络“这一栏，查看请求标头的解析：

$[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-5u4F9ebu-1651467135952)(C:\Users\mi\AppData\Roaming\Typora\typora-user-images\image-20220412115858496.png)]$
在这里插入图片描述

（请求方式+URL+HTTP协议版本）

请求头部

请求头部用来描述客户端的基本信息，把客户端相关的信息告知服务器。请求头部由多行键/值对组成，每行的键和值之间用英文的冒号分隔。常见的头字段：
在这里插入图片描述
（同样使用前面的代码，在网页查看请求头部信息：）
$[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-k71nkbFa-1651467135956)(C:\Users\mi\AppData\Roaming\Typora\typora-user-images\image-20220412125305392.png)]$

空行

最后一个请求头字段的后面是一个空行，通知服务器请求头部到这结束。请求消息中的空行，用来分隔请求头部与请求体。 $[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-IeUkUUa5-1651467135960)(C:\Users\mi\AppData\Roaming\Typora\typora-user-images\image-20220412125439164.png)]$

请求体

请求体中存放的，是要通过 POST 方式提交到服务器的数据。

（只有 POST 请求才有请求体，GET 请求没有请求体） $[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-bl0dafOL-1651467135961)(C:\Users\mi\AppData\Roaming\Typora\typora-user-images\image-20220412125543463.png)]$

HTTP响应消息

响应消息就是服务器响应给客户端的消息内容，也叫作响应报文。

HTTP响应消息的组成部分

状态行、响应头部、空行和响应体 $[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-iN8lbKF0-1651467135963)(C:\Users\mi\AppData\Roaming\Typora\typora-user-images\image-20220412130050401.png)]$

状态行

由 HTTP 协议版本、状态码和状态码的描述文本 3 个部分组成
$[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-vJQPIJ1P-1651467135963)(C:\Users\mi\AppData\Roaming\Typora\typora-user-images\image-20220412130456106.png)]$

（同样使用前面的代码，查看响应信息：）
$[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-02jzsVbZ-1651467135965)(C:\Users\mi\AppData\Roaming\Typora\typora-user-images\image-20220412130436373.png)]$

响应头部

响应头部用来描述服务器的基本信息。响应头部由多行键/值对组成，每行的键和值之间用英文的冒号分隔。

（同样使用前面的代码，查看响应头部：）

空行

在最后一个响应头部字段后面就是一个空行，用来通知客户端响应头部至此结束。响应消息中的空行，用来分隔响应头部与响应体。

$[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-chp5m20Z-1651467336617)(C:\Users\mi\AppData\Roaming\Typora\typora-user-images\image-20220412130735424.png)]$

响应体

响应体中存放的，是服务器响应给客户端的资源内容。

$[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-wGfwsIwb-1651467135967)(C:\Users\mi\AppData\Roaming\Typora\typora-user-images\image-20220412130753772.png)]$

（同样使用前面的代码，查看响应体：）

$[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-HpuIB1Uc-1651467135968)(C:\Users\mi\AppData\Roaming\Typora\typora-user-images\image-20220412130810274.png)]$

HTTP请求方法

HTTP 请求方法，属于 HTTP 协议中的一部分，请求方法的作用是：用来表明要对服务器上的资源执行的操作。常用的请求方法有GET 和 POST。

序号	方法	描述
1	GET	(查询)发送请求来获得服务器上的资源，请求体中不会包含请求数据，请求数据放在协议头中。
2	POST	(新增)向服务器提交资源（例如提交表单或上传文件）。数据被包含在请求体中提交给服务器。
3	PUT	(修改)向服务器提交资源，并使用提交的新资源，替换掉服务器对应的旧资源。
4	DELETE	(删除)请求服务器删除指定的资源。
5	HEAD	HEAD 方法请求一个与 GET 请求的响应相同的响应，但没有响应体。
6	OPTIONS	获取http服务器支持的http请求方法，允许客户端查看服务器的性能，比如ajax跨域时的预检等。
7	CONNECT	建立一个到由目标资源标识的服务器的隧道。
8	TRACE	沿着到目标资源的路径执行一个消息环回测试，主要用于测试或诊断。
9	PATCH	是对 PUT 方法的补充，用来对已知资源进行局部更新。

HTTP响应状态代码

HTTP 响应状态码（HTTP Status Code），用来标识响应的状态。根据客户端浏览器返回的响应状态码，就能知道这次 HTTP 请求是否成功

HTTP 状态码共分为 5 种类型：

分类	分类描述
1**	信息，服务器收到请求，需要请求者继续执行操作（实际开发中很少遇到 1** 类型的状态码）
2**	成功，操作被成功接收并处理
3**	重定向，需要进一步的操作以完成请求
4**	客户端错误，请求包含语法错误或无法完成请求
5**	服务器错误，服务器在处理请求的过程中发生了错误

2**相关状态码

状态码	状态码英文名称	中文描述
200	OK	请求成功。一般用于 GET 与 POST 请求
201	Created	已创建。成功请求并创建了新的资源，通常用于 POST 或 PUT 请求

3**重定向相关状态码

状态码	状态码英文名称	中文描述
301	Moved Permanently	永久移动。请求的资源已被永久的移动到新URI，返回信息会包括新的URI，浏览器会自动定向到新URI。今后任何新的请求都应使用新的URI代替
302	Found	临时移动。与301类似。但资源只是临时被移动。客户端应继续使用原有URI

4**客户端错误相关状态码

状态码	状态码英文名称	中文描述
400	Bad Request	1、语义有误，当前请求无法被服务器理解。除非进行修改，否则客户端不应该重复提交这个请求。2、请求参数有误。
401	Unauthorized	当前请求需要用户验证。
403	Forbidden	服务器已经理解请求，但是拒绝执行它。
404	Not Found	服务器无法根据客户端的请求找到资源（网页）。
408	Request Timeout	请求超时。服务器等待客户端发送的请求时间过长，超时。

5**服务端错误相关状态码

状态码	状态码英文名称	中文描述
500	Internal Server Error	服务器内部错误，无法完成请求。
501	Not Implemented	服务器不支持该请求方法，无法完成请求。只有 GET 和 HEAD 请求方法是要求每个服务器必须支持的，其它请求方法在不支持的服务器上会返回501
503	Service Unavailable	由于超载或系统维护，服务器暂时的无法处理客户端的请求。