news 2026/8/31 15:50:02

HTTP——服务端、客户端格式,浏览器解析

作者头像

张小明

前端开发工程师

1.2k 24
文章封面图
HTTP——服务端、客户端格式,浏览器解析
@bit::Shadow
✧(≖ ◡ ≖✿

目录

浏览器作为客户端,我的代码作为服务端。

抓取浏览器的HTTP格式的请求

请求行格式

请求行

请求头

空行

正文

请求方(Request)

POST举例Login.html

见资源绑定(测试)

服务端应答

状态行:

响应报头

响应正文(最重要、最核心)

本质

最基本的浏览器响应

浏览器的强大解析能力[了解]


🔗html及图片显示gitee

浏览器作为客户端,我的代码作为服务端。

链接过程如下

我的浏览器(Win) |发送HTTP请求到 122.152.208.179:8080(公网IP+服务端开放端口号) | 互联网路由 |路由转发 云服务商网络 |防火墙允许8080端口 云服务器(122.152.208.179) |操作系统将数据交给监听8080的进程 | 你的serverTCP程序 |解析HTTP请求 返回HTTP响应 |原路返回 浏览器显示内容

抓取浏览器的HTTP格式的请求

GET /favicon.ico HTTP/1.1 Host: 122.152.208.179:8080 Connection: keep-alive User-Agent: Mozilla/5.0 (Linux; Android 15; Pixel 9) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/151.0.0.0 Mobile Safari/537.36 Accept: image/avif,image/webp,image/apng,image/svg+xml,image/*,*/*;q=0.8 Referer: http://122.152.208.179:8080/wwwroot/ Accept-Encoding: gzip, deflate Accept-Language: zh-CN,zh;q=0.9,en-US;q=0.8,en;q=0.7 [空行] [正文](选择性)

请求格式必然满足下图(本质是字符数组)

请求行格式

注意请求行格式顺序:

请求方法-[空格]-[URI]-[空格]-HTTP版本-换行符

将请求内容通过read()读取后输出

void Start(std::unique_ptr<SocketClass>& clientfd) { _clfd = clientfd->sockfdGet (); // 回显浏览器请求至于显示器 char buf[8096] = { 0 }; int n = read (_clfd, buf, 8095); if(n > 0) { //也可能读不全!!!尝试直接输出 LOG (LogLevel::DEBUG) << "&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&"; std::cout << buf; LOG (LogLevel::DEBUG) << "&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&"; } else if(n == 0) { LOG (LogLevel::INFO) << "客户端已退出"; exit (0); } else RETFATAL ("read"); }

得到

GET / HTTP/1.1 Host: 122.152.208.179:8082 Connection: keep-alive Upgrade-Insecure-Requests: 1 User-Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/151.0.0.0 Safari/537.36 Accept: text/html,application/xhtml+xml,application/xml;q=0.9,image/avif,image/webp,image/apng,*/*;q=0.8,application/signed-exchange;v=b3;q=0.7 Accept-Encoding: gzip, deflate Accept-Language: zh-CN,zh;q=0.9,en-US;q=0.8,en;q=0.7 ubuntu@VM-0-11-ubuntu:~/e2026/Ubuntu_learning/Auguest/HTTP$

表示:

"我是Chrome浏览器用户,使用Windows 10系统,想要访问http://122.152.208.179:8082/,我接受HTML页面和中文内容,如果支持压缩更好。如果服务器支持HTTPS升级,我也可以接受。"

请求行

GET / HTTP/1.1

GET:请求方法表示客户端希望获取资源。

/ : 请求的URI(统一资源标识符),“表示根路径”。

HTTP/1.1:使用的HTTP版本。

请求头

Host: 122.152.208.179:8082 Connection: keep-alive Upgrade-Insecure-Requests: 1 User-Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/151.0.0.0 Safari/537.36 Accept: text/html,application/xhtml+xml,application/xml;q=0.9,image/avif,image/webp,image/apng,*/*;q=0.8,application/signed-exchange;v=b3;q=0.7 Accept-Encoding: gzip, deflate Accept-Language: zh-CN,zh;q=0.9,en-US;q=0.8,en;q=0.7
字段含义
Host122.152.208.179:8082必填。指定目标服务器地址和端口,支持虚拟主机
Connectionkeep-alive保持TCP连接复用,避免每次请求重新建立连接
Upgrade-Insecure-Requests1告诉服务器客户端支持升级到HTTPS(如果服务器支持)
User-AgentMozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36...客户端标识:Windows 10系统,Chrome 151版本,基于WebKit内核
Accepttext/html,application/xhtml+xml,application/xml;q=0.9,...告诉服务器客户端可接受的响应内容类型,按优先级排序(q值表示权重,q=0.9优先)
Accept-Encodinggzip, deflate客户端支持的压缩算法,服务器可用这些算法压缩响应体
Accept-Languagezh-CN,zh;q=0.9,en-US;q=0.8,en;q=0.7客户端偏好的语言:中文优先,英文其次

空行

[空行]

请求头之后必定有一个空行,表示请求头结束。之后若存在请求体(正文)(如POST表单的请求数据),则放在空行之后。(由于此处是GET方法,所以一定无正文)

正文

请求方(Request)
情况是否有正文说明示例
GET获取资源访问网页
POST传输实体提交表单、上传文件
HEAD获得报文首部只获取响应头
DELETE删除文件删除资源
PUT传输文件更新资源
PATCH部分更新

70%为GET20%为POST10%为其他。

POST举例Login.html

POST常用于像服务端提交数据:提交表单、文件上传、API调用等。

见资源绑定(测试)

效果图演示:

当我们输入登录信息(即传输数据)浏览器请求如下

POST /login HTTP/1.1 Host: 122.152.208.179:8085 Content-Type: application/x-www-form-urlencoded Content-Length: 43 User-Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/151.0.0.0 Safari/537.36 Accept: text/html,application/xhtml+xml,application/xml;q=0.9,*/*;q=0.8 Accept-Language: zh-CN,zh;q=0.9 Accept-Encoding: gzip, deflate, br Connection: keep-alive Upgrade-Insecure-Requests: 1 username=Salad&password=2024019&remember=no

最后一行即请求正文:

username=Salad&password=2024019&remember=no

即请求正文(未加密,因为使用的是http)

在html内即

注意:GET与POST均不安全均可以被抓包获取,因此常使用https来加密处理。


服务端应答

基本应答内容块

状态行:

HTTP版本-[空格]-[状态码]-[空格]-状态码描述-换行符

响应报头

描述客户端、服务端、响应正文、甚至时间等等信息。

响应正文(最重要、最核心)

是传输到客户端(浏览器),供给解析的内容。

因此为兼容多种格式像:html、cs、js等我们使用二进制读取的方法。

#include<fstream> bool ReadFile1(const std::string filename, std::string& out) { std::ifstream file(filename, std::ios::in | std::ios::binary); if (!file.is_open()) { return false; } out.clear(); std::ostringstream buffer; buffer << file.rdbuf(); if (file.fail() && !file.eof()) { return false; } out = buffer.str(); return true; }

在四大模块中无疑正文是最重要的部分,它决定了响应什么。其次就是状态行的解释,供浏览器识别版本协议等信息。(自然最本质的底层信息的发送是基于网络的TCP/UDP协议实现的,ta提供send与accept等接口联系了服务端与客户端)

本质

由此可见http不过在TCP/UDP之上的封装而已,而 js css html则称为“解释性语言”、“应用层开发语言”,而C/C++本质是“底层开发”。

最基本的浏览器响应

浏览器的响应解析必须是基于上图的特定格式,因此有以下最简单格式

// 最基本的 HTTP 响应 const char* minimalResponse = "HTTP/1.1 200 OK\r\n" "\r\n" "Hello World!";

即:响应行+空行+正文

浏览器的强大解析能力[了解]

由于浏览器的强大解析能力我们甚至在响应行可以删除部分元素:

状态行甚至可以变成这个样子,都可以正常解析。

HTTP/1 0 O

感谢支持,长期连载
欢迎关注

版权声明: 本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若内容造成侵权/违法违规/事实不符,请联系邮箱:809451989@qq.com进行投诉反馈,一经查实,立即删除!
网站建设 2026/8/31 15:49:01

嵌入式电路设计必学:二极管原理、选型与实战应用全解析

兄弟们&#xff0c;搞嵌入式的&#xff0c;迟早要跟模电打交道。很多同学学模电觉得抽象&#xff0c;特别是二极管&#xff0c;课本上讲PN结、耗尽层&#xff0c;听起来像天书。但等你真正做项目&#xff0c;发现电机驱动板、电源电路、IO口保护、通信接口防浪涌&#xff0c;到…

作者头像 李华
网站建设 2026/8/31 15:48:18

全开源源码解析:骆驼IPTV小肥米管理系统架构与部署实战

简介&#xff1a;新版骆驼IPTV小肥米管理系统是一套面向开发者与技术研究者的全开源IPTV直播管理平台&#xff0c;聚焦频道调度、用户权限、播放控制与EZtv系统对接等核心场景&#xff0c;适用于IPTV原理学习、二次开发实践及私有化部署验证。资源包共297个文件&#xff0c;含7…

作者头像 李华
网站建设 2026/8/31 15:47:53

实况足球2018 Mobile离线版安装教程:APK下载、数据包与闪退排查

1. 这篇文章真正要解决的问题 如果你是一名从实况足球端游转战手游的老玩家&#xff0c;应该对科乐美的手游系列有印象。实况足球2018 Mobile 是移动端足球游戏里口碑很稳的一代&#xff1a;操作手感、球员动作、球物理反馈&#xff0c;比很多后来的“氪金抽卡版”更纯粹。但问…

作者头像 李华
网站建设 2026/8/31 15:47:36

2026开源代码大模型本地部署指南:从Qwen2.5-Coder到DeepSeek Coder,一条命令跑起你的AI编程助手

2026年&#xff0c;90%的开发者已在使用AI编程工具&#xff0c;但大部分人仍然依赖云端API。数据隐私、离线可用、成本控制——这三个问题让越来越多的开发者开始关注本地部署方案。本文深入对比主流开源代码模型&#xff0c;手把手带你用Ollama部署本地AI编程助手。 目录 一、…

作者头像 李华
网站建设 2026/8/31 15:47:12

Labelme JSON转YoloV8分割标签:完整转换脚本与实战指南

简介&#xff1a;本资源是一套面向计算机视觉初学者与YOLO模型实践者的自动化工具集&#xff0c;专为解决labelme标注数据向YOLOv8语义分割格式转换及数据集划分的痛点而设计。资源包含14个文件&#xff08;5个labelme生成的JSON标注文件、4张JPEG/JPG图像样本、2个核心Python脚…

作者头像 李华
网站建设 2026/8/31 15:45:39

Python+Tkinter五子棋开发实战:GUI编程与算法核心解析

简介&#xff1a;这是一份基于Python实现的五子棋小游戏完整项目资源&#xff0c;面向Python初学者与游戏开发入门者&#xff0c;帮助学习者掌握图形界面编程、事件响应、棋盘逻辑判断及音效/字体等多媒体资源集成方法。压缩包共19个文件&#xff0c;包含9个核心Python源码&…

作者头像 李华