当前位置： 首页 > news >正文

HTTP multipart/form-data 请求

news 2026/2/10 20:13:13

序言

 最近在写项目的过程中有一个需求是利用 HTTP 协议传输图片和视频，经过查询方法相应的方法发现使用 multipart/form-data 的方式，这是最常见处理二进制文件的表单编码类型。
 学习了一下午，现在总结一下使用的方法和相关的知识点，欢迎指正😄！

一、如何使用？

⭐️ 注：我们的开发语言是 C++，主要使用到的库是 httplib，帮助我们快速的搭建HTTP 服务器，以及相应数据的处理

1. 前端逻辑

 首先我们配合使用 httplib 快速的搭建一个网络首页：
在这里插入图片描述

这里界面有些简陋哈哈，但是学习的意义大于外表！

这里需要用户填写昵称和一个图片（分别对应纯文本数据和图片数据稍后形成对比）。前端的代码非常的简洁，如下：

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8"><title>Simple Form</title>
</head>
<body><form action="/submit" method="POST" enctype="multipart/form-data"><label>昵称:</label><input type="text" name="nickname" required><br><label>图片:</label><input type="file" name="image" accept="image/*" required><br><button type="submit">Submit</button></form>
</body>
</html>

我们来逐个介绍每一个关键元素的作用，首先就是 form 元素，用于定义用户可以填写并提交数据的表单。它负责收集用户输入并将数据发送到指定的服务器地址：

  • action：定义表单提交的目标地址，比如这里就表示提交到当前域名下的 /submit 路径（对于处理表单数据的路径）
  • method：提交表单时最常用的就是 POST 方式
  • enctype：定义表单数据的编码类型，影响服务器解析数据的方式。常见值：
    • application/x-www-form-urlencoded（默认）: 适合普通键值对数据（比如账号和密码）
    • multipart/form-data: 必须在表单 包含文件上传 时使用
    • text/plain: 将数据以 纯文本形式 发送，较少使用

现在我们在介绍 input 元素，来控制用户的输入：

  • type：我们这里使用了 text 代表普通文本输入；以及 file 代表传输特定的文件（支持 accept 属性限制文件类型）
  • name：定义该输入框的名称，用于在表单提交时标识字段，在后面可以根据特定的字段提取相应的数据
  • required：代表数据必须填写，不可为空

这就是前端的逻辑，很多时候前端占据多数的都是样式的调整，咋们直接抽丝剥茧来一个最基础版的帮助大家理解。

2. 后端逻辑

 通过前端的逻辑我们得知，用户会提交一个昵称和一个图片以 POST 的方式发送到 /submit 下进行处理。那我们怎么实现呢，我们使用一个 httplib 提供的接口，如下：

Server &Post(const std::string &pattern, Handler handler);
  • Post： 代表处理 Post 方式传输的数据
  • pattern：表示相应的处理路径，这里我们就应该传入 /submit
  • handler：定义为 using handler = std::function<void(const httplib& Requests, httplib::Response&)> 我们定义的处理函数，需要符合他的参数返回值

但是在使用之前，我们还需要学习一个知识点，那就是如何将表单里面的数据以取出来！
 大家记好了，我们表单当中的每一个数据都以 MultipartFormData 的形式存储在 httplib& Requests 中，我们只需要每个数据的 命名 即可提取（咦？命名 怎么来的呀？如果你感到疑惑，请移步到 input 元素的 name 字段）。具体使用方式：

/*部分代码*/
void HandlePost(const httplib::Request &req, httplib::Response &rsp) 
{/*这里是做严谨地检查，是否存在该命名的数据*/if (req.has_file("nickname")) {/*提取表单中单个元素的数据*/httplib::MultipartFormData nickname = req.get_file_value("nickname");

其实这个类型就是一个结构体，存储数据的相关信息：

struct MultipartFormData {std::string name;    /*数据的名称*/std::string content; /*数据的内容*/std::string filename;/*文件的名称（如果他是一个文件，否则空）*/std::string content_type;/*数据类型*/
};

咋们打印看一下上传的图片的文件信息，就不打印内容了是乱码：

image/jpeg
AVL.jpg
image

现在基本的使用咋们理解了，那底层是咋一回事呢？

二、 HTTP 报文传输格式

 提供使用浏览器的网络抓包，我们先来看一下传输的 请求头 是怎么样的：
在这里插入图片描述
发现在数据类型后面多了一个字段 boundary(分界线)，boundary 是客户端（如浏览器）自动生成的，用来分隔 HTTP 请求体中的多个部分（因为表单当中有多个类型的数据需要间隔开）。
 现在我们看一下正文内容的存储格式：
在这里插入图片描述
两个数据一个是文本一个是图片（但是图片的数据没有正常显示）。

总结

 HTML表单 是网页中与用户交互的重要元素，允许用户输入数据并将其发送到服务器进行处理。也许我们可以自己尝试设计一下解析 multipart/form-data 报文请求的方法。纸上得来终觉浅，绝知此事要躬行！

相关文章：

HTTP multipart/form-data 请求

序言 最近在写项目的过程中有一个需求是利用 HTTP 协议传输图片和视频&#xff0c;经过查询方法相应的方法发现使用 multipart/form-data 的方式&#xff0c;这是最常见处理二进制文件的表单编码类型。  学习了一下午&#xff0c;现在总结一下使用的方法和相关的知识点&#x…...

编程日记 2024/12/10 6:56:50

配置服务器的免密登录

在服务器中配置别名和免密登录 如果没有生成过公钥和密钥 ssh-keygen然后就生成了公钥和密钥&#xff0c;下一步进入.ssh文件夹 cd .ssh/可以看到文件夹中会多出来三个文件 id_rsa&#xff1a;密钥id_rsa.pub&#xff1a;公钥known_hosts&#xff1a;A通过ssh首次连接到B&am…...

编程日记 2024/12/10 6:50:43

普通遥控电动遮阳雨棚怎么接入米家并用苹果手机Siri控制

环境&#xff1a; 遥控电动遮阳雨棚 无线射频拷贝器 米家APP 问题描述&#xff1a; 普通遥控电动遮阳雨棚怎么接入米家并用苹果手机Siri控制 解决方案&#xff1a; 1.先看看遥控器射频参数,有些在里面板子上&#xff0c;要拆开才能看到&#xff0c;我这是433的 2.到网店…...

编程日记 2024/12/10 6:49:40

两种不同简缩极化的六个方程

方程1 (3*A*(b - a*1i 1) - A*((c d*1i)*(f1 f2*1i)*1i - (c d*1i)^2))*(a - b*1i)*1i 3*A*(b - a*1i 1) 2*(A*(c f2 d*1i - f1*1i) A*(c d*1i - (a b*1i)*(c d*1i)*1i))*(c - d*1i) (A*(c f2 d*1i - f1*1i) A*(c d*1i - (a b*1i)*(c d*1i)*1i))*(f1 - f2…...

编程日记 2024/12/10 6:44:35

环形缓冲区（Ring Buffer）：概念、功能、使用场景与实现

一、概念 环形缓冲区&#xff08;Ring Buffer&#xff09;&#xff0c;又称循环缓冲区&#xff0c;是一种用于数据缓冲的数据结构。其核心思想是将缓冲区视为一个环形结构&#xff0c;当数据写入到缓冲区的末尾时&#xff0c;会自动回绕到缓冲区的开头继续写入&#xff0c;形成…...

编程日记 2024/12/10 6:43:34

大连理工大学数据结构2003年硕士入学试题

大连理工大学2003年硕士入学试题 数据结构部分(共75分) 一、回答下列问题(20分) 1&#xff0e;循环队列用数组A[0&#xff0e;&#xff0e;m—1)存放其数据元素。设tail指向其实际的队尾&#xff0c;front指向其实际队首的前一个位置&#xff0c;则当前队列中的数据元素有多少个…...

编程日记 2024/12/10 6:42:31

Master EDI 项目需求分析

Master Electronics 通过其全球分销网络&#xff0c;支持多种采购需求&#xff0c;确保能够为客户提供可靠的元件供应链解决方案&#xff0c;同时为快速高效的与全球伙伴建立合作&#xff0c;Master 选择通过EDI来实现与交易伙伴间的数据传输。 EDI为交易伙伴之间建立了一个安…...

编程日记 2024/12/10 6:40:29

图海寻径——图相关算法的奇幻探索之旅

一、图的表示 1. 邻接矩阵 (Adjacency Matrix) #include <iostream> #include <vector> #include <queue> #include <limits>using namespace std;class GraphMatrix { private:int numVertices;vector<vector<int>> adjMatrix;const st…...

编程日记 2024/12/10 6:37:25

亚马逊云科技re:Invent：生成式AI与全球布局

作为全球云计算和人工智能领域一年一度的顶级盛宴&#xff0c;亚马逊云科技2024 re:Invent全球大会吸引了超过6万名现场观众以及40多万名线上参会者。而大会上生成式AI的相关话题和内容&#xff0c;也成为了所有观众关注的焦点。 大会期间&#xff0c;亚马逊云科技全球服务副总…...

编程日记 2024/12/10 6:36:24

Android 因为混淆文件配置,打release包提示running R8问题处理

一、报错信息 Missing classes detected while running R8. Please add the missing classes or apply additional keep rules that are generated in E:\workplace\xxxxxx\app\build\outputs\mapping\release\missing_rules.txt. Missing class org.mediakit.R$layout (refer…...

编程日记 2024/12/10 6:34:22

20241209给Ubuntu20.04系统的的交换分区增加为20GB的步骤

20241209给Ubuntu20.04系统的的交换分区增加为20GB的步骤 2024/12/9 21:10 缘起&#xff0c;编译中科创达的高通CM6125模块的Android10的时候&#xff0c;老报错。 编译环境可以编译荣品的RK3566的Android13/Buildroot。 以前荣品的RK3566的Android13的编译环境是可以编译通CM6…...

编程日记 2024/12/10 6:33:20

Centos7环境下nifi单机部署

Centos7环境下nifi单机部署 前言一、安装Nifi1.1 下载并解压1.2 修改配置文件 二、启动Nifi程序三、Nifi的简单使用3.1 文件移动3.2 本地文件传到HDFS 参考博客 前言 本以为在服务器上部署nifi很简单&#xff0c;跟着教程走就好&#xff0c;但是并没有成功&#xff0c;可能是因…...

编程日记 2024/12/10 6:32:19

如何通过轻易云实现金蝶云星空与旺店通数据集成

案例分享&#xff1a;柏为金蝶退料申请退料开单08.03 在企业的供应链管理中&#xff0c;数据的准确性和实时性至关重要。本文将重点介绍如何通过轻易云数据集成平台&#xff0c;将金蝶云星空的数据高效集成到旺店通旗舰奇门系统中&#xff0c;以实现柏为金蝶退料申请退料开单0…...

编程日记 2024/12/10 6:31:18

OSG开发笔记（三十七）：OSG基于windows平台msvc2017x64编译器官方稳定版本OSG3.4.1搭建环境并移植Demo

​若该文为原创文章&#xff0c;未经允许不得转载 本文章博客地址&#xff1a;https://blog.csdn.net/qq21497936/article/details/144258047 各位读者&#xff0c;知识无穷而人力有穷&#xff0c;要么改需求&#xff0c;要么找专业人士&#xff0c;要么自己研究 长沙红胖子Qt…...

编程日记 2024/12/10 6:30:15

2024最新小猫咪PHP加密系统源码V1.4_本地API接口_带后台

2024最新小猫咪PHP加密系统源码V1.4_本地API接口_带后台 小猫咪PHP加密系统历时半年&#xff0c;它再一次迎来更新&#xff0c;更新加密算法&#xff08;这应该是最后一次更新加密算法了&#xff0c;以后主要更新都在框架功能上面了&#xff09;&#xff0c;适配php56-php74&a…...

编程日记 2024/12/10 6:28:13

K8S OOM killer机制

当kubelet没来得及触发pod驱逐&#xff0c;使得节点内存耗尽时&#xff0c;将触发节点上的OOM killer机制&#xff1b; Linux上有个机制叫OOM killer&#xff08;Out Of Memory killer&#xff09;&#xff0c;这个机制会在系统内存耗尽的情况下发挥作用&#xff0c;即根据一定…...

编程日记 2024/12/10 6:26:11

什么是绩效文化？

绩效文化是一种组织文化&#xff0c;它将绩效视为核心价值观&#xff0c;贯穿于组织的各个层面和活动之中。 一、绩效文化的内涵 目标导向 绩效文化强调组织成员都朝着共同的目标努力。这个目标通常是明确、可衡量的&#xff0c;如企业的年度利润目标、市场份额增长目标等。例…...

编程日记 2024/12/10 6:25:11

【人工智能-CV领域】对抗生成网络（GAN）与扩散模型全面解析与深度融合：实现AI生成能力的新突破

文章目录 了解更多AI内容生成模型概述对抗生成网络&#xff08;GAN&#xff09;的深度解析GAN的基本原理GAN的损失函数GAN的优势与挑战 扩散模型&#xff08;Diffusion Model&#xff09;的深入探讨扩散模型的基本原理扩散模型的损失函数扩散模型的优势与挑战 GAN与扩散模型的全…...

编程日记 2024/12/10 6:24:09

IT系统运维监控指标体系-持续完善中

分类指标名称定义说明指标类型采集频率统计数据频率计量单位数据精度应用注册用户数统计当前注册用户总数量统计类1分钟分钟、小时、日个整数应用在线用户数统计当前在线用户总数量统计类1分钟分钟、小时、日个整数应用日登录人数统计当日登录用户总数量统计类1分钟分钟、小时、…...

编程日记 2024/12/10 6:23:08

RPC设计--TcpAcceptor

TcpAcceptor 其功能较为简单&#xff0c;把套接字通信的一整套流程封装起来。在构造函数中就创建好连接套接字、设置好端口复用&#xff0c;等待accept&#xff0c;即自己封装socket 、 bind等函数调用 传入本地要监听的地址和端口&#xff0c;完成上述流程。 可提供getList…...

编程日记 2024/12/10 6:22:07

HTML 语义化

目录 HTML 语义化HTML5 新特性HTML 语义化的好处语义化标签的使用场景最佳实践 HTML 语义化 HTML5 新特性 标准答案&#xff1a; 语义化标签&#xff1a; <header>&#xff1a;页头<nav>&#xff1a;导航<main>&#xff1a;主要内容<article>&#x…...

编程新知 2026/1/15 21:24:41

Unity3D中Gfx.WaitForPresent优化方案

前言 在Unity中&#xff0c;Gfx.WaitForPresent占用CPU过高通常表示主线程在等待GPU完成渲染&#xff08;即CPU被阻塞&#xff09;&#xff0c;这表明存在GPU瓶颈或垂直同步/帧率设置问题。以下是系统的优化方案&#xff1a; 对惹&#xff0c;这里有一个游戏开发交流小组&…...

编程新知 2026/2/7 17:31:44

MySQL账号权限管理指南：安全创建账户与精细授权技巧

在MySQL数据库管理中&#xff0c;合理创建用户账号并分配精确权限是保障数据安全的核心环节。直接使用root账号进行所有操作不仅危险且难以审计操作行为。今天我们来全面解析MySQL账号创建与权限分配的专业方法。 一、为何需要创建独立账号&#xff1f; 最小权限原则&#xf…...

编程新知 2025/9/5 23:36:27

基于SpringBoot在线拍卖系统的设计和实现

摘 要 随着社会的发展&#xff0c;社会的各行各业都在利用信息化时代的优势。计算机的优势和普及使得各种信息系统的开发成为必需。 在线拍卖系统&#xff0c;主要的模块包括管理员&#xff1b;首页、个人中心、用户管理、商品类型管理、拍卖商品管理、历史竞拍管理、竞拍订单…...

编程新知 2026/1/26 13:25:02

NPOI操作EXCEL文件 ——CAD C# 二次开发

缺点:dll.版本容易加载错误。CAD加载插件时&#xff0c;没有加载所有类库。插件运行过程中用到某个类库&#xff0c;会从CAD的安装目录找&#xff0c;找不到就报错了。 【方案2】让CAD在加载过程中把类库加载到内存 【方案3】是发现缺少了哪个库&#xff0c;就用插件程序加载进…...

编程新知 2026/1/26 13:35:42

在鸿蒙HarmonyOS 5中使用DevEco Studio实现企业微信功能

1. 开发环境准备 ​​安装DevEco Studio 3.1​​&#xff1a; 从华为开发者官网下载最新版DevEco Studio安装HarmonyOS 5.0 SDK ​​项目配置​​&#xff1a; // module.json5 {"module": {"requestPermissions": [{"name": "ohos.permis…...

编程新知 2025/12/29 15:43:26

TJCTF 2025

还以为是天津的。这个比较容易&#xff0c;虽然绕了点弯&#xff0c;可还是把CP AK了&#xff0c;不过我会的别人也会&#xff0c;还是没啥名次。记录一下吧。 Crypto bacon-bits with open(flag.txt) as f: flag f.read().strip() with open(text.txt) as t: text t.read…...

编程新知 2025/12/2 12:05:07

6.计算机网络核心知识点精要手册

计算机网络核心知识点精要手册 1.协议基础篇 网络协议三要素 语法&#xff1a;数据与控制信息的结构或格式&#xff0c;如同语言中的语法规则语义&#xff1a;控制信息的具体含义和响应方式&#xff0c;规定通信双方"说什么"同步&#xff1a;事件执行的顺序与时序…...

编程新知 2025/9/26 21:47:06

python读取SQLite表个并生成pdf文件

代码用于创建含50列的SQLite数据库并插入500行随机浮点数据&#xff0c;随后读取数据&#xff0c;通过ReportLab生成横向PDF表格&#xff0c;包含格式化&#xff08;两位小数&#xff09;及表头、网格线等美观样式。 # 导入所需库 import sqlite3 # 用于操作…...

编程新知 2025/12/15 21:48:04

生信服务器 | 做生信为什么推荐使用Linux服务器？

原文链接&#xff1a;生信服务器 | 做生信为什么推荐使用Linux服务器&#xff1f; 一、 做生信为什么推荐使用服务器&#xff1f; 大家好&#xff0c;我是小杜。在做生信分析的同学&#xff0c;或是将接触学习生信分析的同学&#xff0c;<font style"color:rgb(53, 1…...

编程新知 2026/2/9 6:27:36