【网络协议大花园】应用层 http协议的使用小技巧，用好了都不用加班，效率翻两倍（上篇）

本篇会加入个人的所谓鱼式疯言

❤️❤️❤️鱼式疯言:❤️❤️❤️此疯言非彼疯言

而是理解过并总结出来通俗易懂的大白话,

小编会尽可能的在每个概念后插入鱼式疯言,帮助大家理解的.

🤭🤭🤭可能说的不是那么严谨.但小编初心是能让更多人能接受我们这个概念 ！！！

引言

HTTP 协议（超文本传输协议）是万维网中数据通信的基础。它定义了客户端与服务器之间如何进行交互，确保信息能够准确、高效地在网络中传输。从简单的网页浏览到复杂的网络应用，HTTP 协议都发挥着至关重要的作用，是互联网世界不可或缺的一部分。

目录

1. http的初识

2. http的抓包工具

3. http的报文格式

一. http的初识

1. http协议是什么？

http： 叫超文本传输协议， 用于服务器和客户端互相通信的应用层协议。

http主要负责规定 客户端与服务器 之间的通信， 包括 传输的方式 和 数据格式 。

关于传输的方式和数据格式在下篇文章中， 小编会重点细细道来。

简单来说吧 ！ 它是 互联网上运用最广泛的协议 （没有之一）， 我们平常的日常生活中离不开 http 协议， 像 打开浏览器， 使用手机app， 后端开发使用分布式结构都离不开http协议 。

鱼式疯言

如果是作为一名Java程序猿， 作为 web开发 是经常和应用层协议打交道的， 所以日常开发中是离不开http的， 小伙伴要学好哦~

2. http 的特点

如上图：

在 http3.0 的版本之前是基于Tcp 实现的 ， 而 http 3.0 版本是基于 Udp实现的 。

而目前大规模互联网 见到最多使用的最多 的也就是 http1.1 版本。

http 协议是 一问一答模型 的协议

一问一答就是：

客户端——服务器

客户端发送一个请求， 服务器响应一个回复。

打开网页的过程， 就是一问一答的场景。

鱼式疯言

补充说明：

• 像其网络通信过程中有：

一问多答 ：文件下载

多问一答： 大文件传送

多问多答 ： 远程桌面（远程控制）

二. http的抓包工具

1. 抓包是什么？

要想学习好http 协议， 抓包 是每个程序猿必不可少的技能。

抓包： 把通过 网卡上的数据获取到， 并解析出来。

平常开发人员很少抓Tcp的包， 而是进行抓http的包。

我们可以通过抓包工具来获取到 http 请求和响应的详细情况 。

2. 抓包工具

在这里小编推荐使用 Fiddler 的抓包工具， 这个抓包工具简单操作， 门槛较低， 特别适合我们刚接触http的初学者。

下面我们来看看下载流程吧：

. 下载流程

小伙伴先点开下方链接

Fidder 下载链接

使用经典版下载（最近版是收费的）

直接下载即可。

. 下载完毕后的操作

点击打开 Fiddler 软件

安装配置， 注意点击的方位

下面必须勾选Yes， 否则是无法进行抓包的， 这点后面的文章详讲， 小伙伴们一定要记得勾选， 如果勾选到No 了， 就只能卸载重装了 。

然后就是操作了

如下图， 就是 Fiddler 可以正常使用了

像平常要查看一个自己包时

首先是 ctrl + A + delete

然后进行一个网站

就会得到 请求和响应的包 ， 我们 随机点击一个 ， 就可以接收到


如上图就可以得到一个 http请求报文

如上面的过程就是 查看自己 http 报文的基本抓包过程 ， 小伙伴多多抓包， 定能熟悉http 。

鱼式疯言

RAW标签页 是 http的原始数据

1. 当发送一段请求时， 是往 Tcp Socket 包中写入一段 字符串。

2. 当返回一段响应时， 是从 Tcp Socket 包中 读出一段字符串并解析 。

3. 注意抓包是 抓自己的包是允许的 ， 如果是 抓别人网站的包 就很 刑 的 。

三. http的报文格式

下面以百度服务器的请求和响应报文为例：

1. 请求报文

. 首行

GET https://img-s.msn.cn/tenant/amp/entityid/BB1hxbpr?w=16&h=16&q=100&m=6&f=png&u=t HTTP/1.1

GET 是方法名 : 表示请求的动作 ， 其中GET 就是客户端要向服务器拿数据。

https://img-s.msn.cn/tenant/amp/entityid/BB1hxbpr?w=16&h=16&q=100&m=6&f=png&u=t : 称之为 URL ，涉及内容比较多也重要， 下面小编细细讲解

HTTP/1.1： 这个标志当下使用的 http 是1.1 版本的。

. 请求头（header）

Host: img-s.msn.cnConnection: keep-alivesec-ch-ua-platform: \"Windows\"User-Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/129.0.0.0 Safari/537.36 Edg/129.0.0.0sec-ch-ua: \"Microsoft Edge\";v=\"129\", \"Not=A?Brand\";v=\"8\", \"Chromium\";v=\"129\"sec-ch-ua-mobile: ?0Accept: image/avif,image/webp,image/apng,image/svg+xml,image/*,*/*;q=0.8X-Edge-Shopping-Flag: 1Sec-MS-GEC: 18AE840C02E7BB0CBC4B5CD23B77A887FC776399E6AF2BC73D86108F8080A847Sec-MS-GEC-Version: 1-129.0.2792.65Sec-Fetch-Site: same-siteSec-Fetch-Mode: no-corsSec-Fetch-Dest: imageReferer: https://ntp.msn.cn/Accept-Encoding: gzip, deflate, br, zstd...

类似以上这些 首行以下到空行结束 都是 报头内容 ， 并且每一行的报头都是 键值对 的形式， 由 ：和 空格 分割开。

鱼式疯言

http的报文是键值对 是很多的， 不同的键值对是http自身规定的 ， 但 人为也可以规定的

关于 面试常考， 工作常用 的 报头的键值对， 小编在下篇中会重点讲解~

. 空行

空行唯一的作用就是 分隔报头和正文 ， 是作为 报头的结束标志。

. 正文（body）

有些 请求报文有正文 ，有些 请求报文没有正文 ， 正文其实就是提供给服务器的数据 。

{\"adRefreshVariant\":\"\",\"locale\":\"zh-cn\",\"rid\":\"67000138b1ed4560b8ac438861d00965\",\"partnerId\":\"ntp\",\"content\":{\"sourceUrl\":\"https://ntp.msn.cn/edge/ntp\",\"pageType\":\"edgechrntp\",\"previousReservedRiverNativeAdCount\":0,\"previousRiverDualWideNativeAdCount\":0,\"previousRiverHalfNativeAdCount\":0,\"previousRiverNativeAdCount\":0,\"verticalName\":\"edge\",\"anaheimPageLayout\":\"informational\",\"isXfeed\":false,\"audienceMode\":\"adult\"},\"user\":{\"muid\":\"0642785F51D0686B1AEF6B1450936914\",\"browserOptOut\":false,\"isAdblock\":false,\"gdpr\":true},\"placements\":[{\"region\":\"oneriver.main\",\"indices\":[1],\"img\":{\"w\":300,\"h\":157}}],\"extensions\":{\"taboola\":{\"sessionId\":\"init\"},\"impressedCrids\":[\"SU1HOk9BREQyLjczNTMxMzkwMTk1MzBfMUpSUlhXTjNFVUJVUktOTERH\",\"SU1HOk9BREQyLjgyNDY0MzI5MDIxMzlfMVZHM1c4NDZBWkFQVEpLMFA4\"]},\"isCookieWallPresent\":false,\"isPeregrine\":true,\"device\":{\"isMobile\":false}}

如上图： 空行以下为 正文（body） , 正文一般都是程序猿自己去定义的。

鱼式疯言

总结说明：

请求的 http报文格式 ： 首行——》 报头——》 空行——》 正文

一般来说， 使用 GET 方法的报文不含有正文 ， 使用POST 方法的报文含有正文， 因为 POST 方法 一般就是用于给 服务器传输文件数据 。

2. 效应报文

效应报文的结构和请求报文的结构相似，但也有不同的地方。

. 首行

HTTP/1.1 200 OK

HTTP/ 1.1 : HTTP的版本号

200： 表示是 HTTP的状态码（下篇介绍）

OK： 对 状态码的说明

. 响应头

Content-Type: application/json; charset=utf-8Vary: Origin,Accept-EncodingStrict-Transport-Security: max-age=31536000; includeSubDomains; preloadAccess-Control-Allow-Origin: https://ntp.msn.cnAccess-Control-Allow-Credentials: trueX-Content-Type-Options: nosniffX-Cache: CONFIG_NOCACHEAccept-CH: Sec-CH-UA-Arch, Sec-CH-UA-Bitness, Sec-CH-UA-Full-Version, Sec-CH-UA-Full-Version-List, Sec-CH-UA-Mobile, Sec-CH-UA-Model, Sec-CH-UA-Platform, Sec-CH-UA-Platform-VersionX-MSEdge-Ref: Ref A: 877BE17A0D7B4A0A958F80023506182E Ref B: BJ1EDGE0718 Ref C: 2024-10-04T14:57:25ZDate: Fri, 04 Oct 2024 14:57:26 GMTContent-Length: 8441

响应报头和请求报头相似 ，这里小编就不赘述了 。

. 空行

空行唯一的作用就是 分隔报头和正文 ， 是作为 报头的结束标志。

. 正文（body）

define(\"superman-san/app/feed-ad/result_696f230\",[\"san\",\"tslib\",\"@searchfe/inject-js\"],function(e,i,s){return l={0:function(t,a){t.exports=e},1:function(t,a){t.exports=i},10:function(t,a){t.exports=\' <div class=\"from c-font-normal {{footData.layout === \\\'s-news-special-item-tpl-2\\\' ? \\\'from-tpl2\\\' : \\\'\\\'}}\"> <span s-if=\"footData.tag\" class=\"hot-point c-color-red c-gap-right\">{{ footData.tag }} <a s-if=\"footData.source\" class=\"c-gap-right c-color-gray\" href=\"{{footData.src_link ? footData.src_link : footData.link_url}}\" target=\"_blank\" data-src=\"1\" data-click=\"LOG_LINK\">{{ footData.source }}</a> <span s-if=\"footData.src_time\" class=\"src-time c-color-gray2 c-gap-right\">{{ footData.src_time }} <span s-if=\"isAd\" class=\"ad-icon c-color-gray2\">广告 <div s-if=\"showFeedback\" class=\"{{isAd ? \\\'nativead-dustbin\\\' : \\\'dustbin\\\'}}\" data-click=\"LOG_BTN_DUSTBIN\"> <i class=\"c-icon\">