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

http-为什么文件上传要转成Base64

news 2025/7/21 1:15:50

# 前言

最近在开发中遇到文件上传采用Base64的方式上传，记得以前刚开始学http上传文件的时候，都是通过content-type为multipart/form-data方式直接上传二进制文件，我们知道都通过网络传输最终只能传输二进制流，所以毫无疑问他们本质上都是一样的，那么为什么还要先转成Base64呢？这两种方式有什么区别？带着这样的疑问我们一起来分析下。

# multipart/form-data上传

先来看看multipart/form-data的方式，我在本地通过一个简单的例子来查看http multipart/form-data方式的文件上传，html代码如下

 

 

<!DOCTYPE html><html><head>    <title>上传文件示例</title>    <meta charset="UTF-8"><body><h1>上传文件示例</h1><form action="/upload" method="POST" enctype="multipart/form-data">    <label for="file">选择文件：</label>    <input type="file" id="file" name="file"><br>    <label for="tx">说明：</label>    <input type="text" id="tx" name="remark"><br><br>    <input type="submit" value="上传"></form></body></html>
 

页面展示也比较简单
 

 

 

 

选择文件点击上传后，通过edge浏览器f12进入调试模式查看到的请求信息。
 请求头如下
 

 

 

 

在请求头里Content-Type 为 multipart/form-data; boundary=----WebKitFormBoundary4TaNXEII3UbH8VKo，刚开始看肯定有点懵，不过其实也不复杂，可以简单理解为在请求体里要传递的参数被分为多部份，每一部分通过分解符boundary分割，就比如在这个例子，表单里有file和remark两个字段，则在请求体里就被分为两部分，每一部分通过boundary=----WebKitFormBoundary4TaNXEII3UbH8VKo来分隔（实际上还要加上CRLF回车换行符，回车表示将光标移动到当前行的开头，换行表示一行文本的结束，也就是新文本行的开始）。需要注意下当最后一部分结尾时需要加多两个"-"结尾。
 


 我们继续来看请求体
 

 

 

 

第一部分是file字段部分，它的Content-Type为image/png，第二部分为remark字段部分，它没有声明Content-Type，则默认为text/plain纯文本类型，也就是在例子中输入的“测试”，到这里大家肯定会有个疑问，上传的图片是放在哪里的，这里怎么没看到呢？别急，我猜测是浏览器做了特殊处理，请求体里不显示二进制流，我们通过Filder抓包工具来验证下。
 

 

 

 

可以看到在第一部分有一串乱码显示，这是因为图片是二进制文件，显示成文本格式自然就乱码了，这也证实了二进制文件也是放在请求体里。后端使用框架springboot通过MultipartFile接受文件也是解析请求体的每一部分最终拿到二进制流。
 

 

 

@RestControllerpublic class FileController {    // @RequestParam可接收Content-Type 类型为：multipart/form-data     // 或 application/x-www-form-urlencoded 请求体的内容    @PostMapping("/upload")    public String upload(@RequestParam("file") MultipartFile file) {        return "test";    }}
 

 

到此multipart/form-data方式上传文件就分析完了，关于multipart/form-data官方说明可参考 RFC 7578 - Returning Values from Forms: multipart/form-data (ietf.org)
 

 

# Base64上传
 

 

在http的请求方式中，文件上传只能通过multipart/form-data的方式上传，这样一来就会有比较大的限制，那有没其他方式可以突破这一限制，也就是说我可以通过其他的请求方式上传，比如application/json？当然有，把文件当成一个字符串，和其他普通参数没什么两样，我们可以通过其他任意请求方式上传。如果转成了字符串，那上传文件就比较简单了，但问题是我们怎么把二进制流转成字符串，因为这里面可能会有很多“坑”，业界一般的做法是通过Base64编码把二进制流转成字符串，那为什么不直接转成字符串而要先通过Base64来转呢？我们下面来分析下。
 

 

 Base64编码原理
 

 

在分析原理之前，我们先来回答什么是Base64编码？首先我们要知道Base64只是一种编码方式，并不是加解密算法，因此Base64可以编码，那也可以解码，它只是按照某种编码规则把一些不可显示字符转成可显示字符。这种规则的原理是把要编码字符的二进制数每6位分为一组，每一组二进制数可对应Base64编码的可打印字符，因为一个字符要用一个字节显示，那么每一组6位Base64编码都要在前面补充两个0，因此总长度比编码前多了(2/6) = 1/3，因为6和8最小公倍数是24，所以要编码成Base64对字节数的要求是3的倍数（24/8=3字节），对于不足字节的需要在后面补充字节数，补充多少个字节就用多少个"="表示（一个或两个），这么说有点抽象，我们通过下面的例子来说明。
 


 我们对ASCII码字符串"AB\nC"(\n和LF都代表换行)进行Base64编码，因为一共4字节，为了满足是3的倍数需要扩展到6个字节，后面补充了2个字节。
 

 

 

 

转成二级制后每6位一组对应不同颜色，每6位前面补充两个0组成一个字节，最终Base64编码字符是QUIKQw==，Base64编码表大家可以自行网上搜索查看。
 

 

 

 

我们通过运行程序来验证下
 

 

 

 

最终得出的结果与我们上面推理的一样。
 

 

Base64编码的作用
 

 

在聊完原理之后，我们继续来探讨文件上传为什么要先通过Base64编码转成字符串而不直接转成字符串？一些系统对特殊的字符可能存在限制或者说会被当做特殊含义来处理，直接转成普通字符串可能会失真，因此上传文件要先转成Base64编码字符，不能把二进制流直接字符串。
 

 

另外，相比较multipart/form-data Base64编码文件上传比较灵活，它不受请求类型的限制，可以是任何请求类型，因为最终就是一串字符串，相当于请求的一个参数字段，它不像二进制流只能限定multipart/form-data的请求方式，日常开发中，我们用的比较多的是通过apllication/json的格式把文件字段放到请求体，这种方式提供了比较便利的可操作性。
 

 

# 总结
 

 

本文最后再来总结对比下这两种文件上传的方式优缺点。
 

 

（1）multipart/form-data可以传输二进制流，效率较高，Base64需要编码解码，会耗费一定的性能，效率较低。
  
 

（2）Base64不受请求方式的限制，灵活度高，http文件二进制流方式传输只能通过multipart/form-data的方式，灵活度低。
 


 因为随着机器性能的提升，小文件通过二进制流传输和字符串传输，我们对这两种方式时间延迟的感知差异并不那么明显，因此大部分情况下我们更多考虑的是灵活性，所以采用Base64编码的情况也就比较多。














相关文章：
















http-为什么文件上传要转成Base64




# 前言 最近在开发中遇到文件上传采用Base64的方式上传&#xff0c;记得以前刚开始学http上传文件的时候&#xff0c;都是通过content-type为multipart/form-data方式直接上传二进制文件&#xff0c;我们知道都通过网络传输最终只能传输二进制流&#xff0c;所以毫无疑问他们本…...






编程日记
2023/7/27 7:27:38



















htmlCSS-----定位




目录 
前言 
定位 分类和取值 
定位的取值 1.相对定位 2.绝对位置 
元素居中操作 
3.固定定位 前言 今天我们来学习html&CSS中的元素的定位&#xff0c;通过元素的定位我们可以去更好的将盒子放到我们想要的位置&#xff0c;下面就一起来看看吧&#xff01; 
定位 定位posi…...






编程日记
2023/7/27 7:26:37



















腾讯云大数据型CVM服务器实例D3和D2处理器CPU型号说明




腾讯云服务器CVM大数据型D3和D2处理器型号&#xff0c;大数据型D3云服务器CPU采用2.5GHz Intel Xeon Cascade Lake 处理器&#xff0c;大数据型D2云服务器CPU采用2.4GHz Intel Xeon Skylake 6148 处理器。腾讯云服务器网分享云服务器CVM大数据型CPU型号、处理器主频性能&#x…...






编程日记
2023/7/27 7:25:36



















计算机科学cs/电子信息ei面试准备——数学基础/线性代数复习




1. 中值定理 
中值定理是反映函数与导数之间联系的重要定理&#xff0c;也是微积分学的理论基础&#xff0c;在许多方面它都有重要的作用&#xff0c;在进行一些公式推导与定理证明中都有很多应用。中值定理是由众多定理共同构建的&#xff0c;其中拉格朗日中值定理是核心&…...






编程日记
2023/7/27 7:24:35



















极速查找（2）-算法分析




篇前小言 
本篇文章是对查找&#xff08;1&#xff09;的续讲线性索引查找 
线性索引查找&#xff08;Linear Index Search&#xff09;是一种基于索引的查找算法。它在数据集合中创建一个索引
结构&#xff0c;然后使用该索引结构来加快对目标元素的查找。
线性索引是一种在数…...






编程日记
2023/7/27 7:23:34



















flask路由添加参数




flask路由添加参数 
在 Flask 中&#xff0c;可以通过两种方式在路由中添加参数&#xff1a;在路由字符串中直接指定参数&#xff0c;或者通过 request 对象从请求中获取参数。 在路由字符串中指定参数&#xff1a;可以将参数直接包含在路由字符串中。参数可以是字符串、整数、…...






编程日记
2023/7/27 7:22:33



















网络安全系统教程+学习路线（自学笔记）




一、什么是网络安全 
网络安全可以基于攻击和防御视角来分类&#xff0c;我们经常听到的 “红队”、“渗透测试” 等就是研究攻击技术&#xff0c;而“蓝队”、“安全运营”、“安全运维”则研究防御技术。 
无论网络、Web、移动、桌面、云等哪个领域&#xff0c;都有攻与防两面…...






编程日记
2023/7/27 7:21:32



















23. 合并 K 个升序链表




题目描述 
给你一个链表数组&#xff0c;每个链表都已经按升序排列。 
请你将所有链表合并到一个升序链表中&#xff0c;返回合并后的链表。 
示例 1&#xff1a; 
输入&#xff1a;lists  [[1,4,5],[1,3,4],[2,6]]
输出&#xff1a;[1,1,2,3,4,4,5,6]
解释&#xff1a;链表数组…...






编程日记
2023/7/27 7:20:31



















Nexus3部署、配置+SpringBoot项目Demo




Docker部署Nexus 搜索Nexus3镜像&#xff1a;[rootlocalhost ~]# docker search nexus 拉取Nexus3镜像&#xff1a;[rootlocalhost ~]# docker pull sonatype/nexus3 启动Nexus3前查看虚拟机端口是否被占用&#xff1a;[rootlocalhost ~]# netstat -nultp 通过Docker Hub查看安…...






编程日记
2023/7/27 7:19:30



















linux下用docker安装mysql




1.mysql Docker镜像 
docker pull mysql:[版本号 或 latest]例&#xff1a;docker pull mysql:5.7 
2.查看拉取的docker镜像 
docker images3.设置 Docker 卷 
docker volume create mysql-data列出 Docker 已知的所有卷 
docker volume ls4.运行一个 MySQL Docker 容器 
docke…...






编程日记
2023/7/27 7:18:29



















Vue - 可视化用户角色、菜单权限、按钮权限配置(动态获取菜单路由)




GitHub Demo 地址 在线预览  前言 关于动态获取路由已在这里给出方案 Vue - vue-admin-template模板项目改造&#xff1a;动态获取菜单路由 这里是在此基础上添加了系统管理模块&#xff0c;包含用户管理&#xff0c;角色管理&#xff0c;菜单管理&#xff0c;字典管理&#xf…...






编程日记
2023/7/27 7:17:27



















hive库操作示例




hive库操作示例 
1、常规表 
创建数据库 
CREATE DATABASE mydatabase;使用数据库 
USE mydatabase;创建表 
CREATE TABLE mytable (id INT,name STRING,age INT
)
ROW FORMAT DELIMITED
FIELDS TERMINATED BY ,
STORED AS TEXTFILE;插入数据 
INSERT INTO TABLE mytable VALUE…...






编程日记
2023/7/27 7:16:26



















LeetCode第 N 个泰波那契数 (认识动态规划)




认识动态规划 编写代码代码空间优化 链接: 第 N 个泰波那契数 编写代码 
class Solution {
public:int tribonacci(int n) {if(n  0){return 0;}else{if(n 1 || n  2)return 1;}vector<int> dp(n  1);dp[0]  0;dp[1]  1;dp[2]  1;for(int i  3;i < n;i){dp[i] dp[i-3]…...






编程日记
2023/7/27 7:15:25



















线程安全问题（内存可见性）




导致的原因 内存可见性问题的出现主要是因为编译器优化多线程导致的 
示例代码 
package 线程安全问题;import java.util.Scanner;/*** Created with IntelliJ IDEA.* Description:* User: wuyulin* Date: 2023-07-26* Time: 13:49*/
public class Demo2 {private volatile sta…...






编程日记
2023/7/27 7:14:24



















STM32MX配置EEPROM(AT24C02)------保姆级教程




———————————————————————————————————— ⏩ 大家好哇&#xff01;我是小光&#xff0c;嵌入式爱好者&#xff0c;一个想要成为系统架构师的大三学生。 ⏩最近在开发一个STM32H723ZGT6的板子&#xff0c;使用STM32CUBEMX做了很多驱动&#x…...






编程日记
2023/7/27 7:13:23



















微信小程序 样式和全局配置




WXSS 
wxss 把屏幕分为750个物理像素&#xff0c;大屏大&#xff0c;小屏小&#xff0c;随着设备不一致自动适配 
推荐使用iPhone6作为标准&#xff0c;1个rpx  0.5个px&#xff0c;把px乘以2就是rpx的参数 
import   
导入外部样式表 
import /common/common.wxss 样式 权重一…...






编程日记
2023/7/27 7:12:22



















一.初识C语言




一.初识C语言 
C语言标准规定&#xff1a; sizeof(long)>sizeof(int)就可以了变量要定义在当前代码块的最前面 
#defin _CRT_SECURE_NO_WARNINGS 1#include <stdio.h>  //包含一个stdio.h的文件 std-标准standard input outputint main() //主函数-程序的入口-main函数…...






编程日记
2023/7/27 7:11:21



















filebeat到kafka示例




docker run -d \   --namefilebeat_7.14_0 \            #filebeat名称   --userroot \   --volume"/data/filebeat/filebeat.yml:/usr/share/filebeat/filebeat.yml" \  #映射filebeat.yml配置   --volume"/data/filebeat/log:/usr/share/filebeat/log" \…...






编程日记
2023/7/27 7:10:20



















AlmaLinux系统下的Zabbix汉化




我安装的是zabbix下的虚拟机&#xff0c;安装完成后&#xff0c;直接可以打开网站了&#xff0c;但是界面是英文&#xff0c;看了设置&#xff0c;没有中文选项&#xff0c;就需要在系统中安装中文字符集了。 
# locale -a         #查看里面没有zh_CN之类的项
# dnf install -…...






编程日记
2023/7/27 7:09:19



















【网络编程】(TCP流套接字编程 ServerSocket API Socket API 手写TCP版本的回显服务器 TCP中的长短连接)




文章目录 网络编程TCP流套接字编程ServerSocket APISocket APITCP中的长短连接手写TCP版本的回显服务器 网络编程 
TCP流套接字编程 
TCP提供的API主要是两个类:ServerSocket 和 Socket . TCP不需要一个类来表示"TCP数据报"因为TCP不是以数据报为单位进行传输的.是以…...






编程日记
2023/7/27 7:08:18





















Linux 文件类型，目录与路径，文件与目录管理




文件类型 
后面的字符表示文件类型标志 
普通文件&#xff1a;-&#xff08;纯文本文件&#xff0c;二进制文件&#xff0c;数据格式文件&#xff09; 如文本文件、图片、程序文件等。 目录文件&#xff1a;d&#xff08;directory&#xff09; 用来存放其他文件或子目录。 设备…...






编程新知
2025/7/18 20:35:00



















【第二十一章 SDIO接口(SDIO)】




第二十一章 SDIO接口 目录 
第二十一章 SDIO接口(SDIO) 
1 SDIO 主要功能 
2 SDIO 总线拓扑 
3 SDIO 功能描述 
3.1 SDIO 适配器 
3.2 SDIOAHB 接口 
4 卡功能描述 
4.1 卡识别模式 
4.2 卡复位 
4.3 操作电压范围确认 
4.4 卡识别过程 
4.5 写数据块 
4.6 读数据块 
4.7 数据流…...






编程新知
2025/7/15 21:35:33



















React Native在HarmonyOS 5.0阅读类应用开发中的实践




一、技术选型背景 
随着HarmonyOS 5.0对Web兼容层的增强&#xff0c;React Native作为跨平台框架可通过重新编译ArkTS组件实现85%以上的代码复用率。阅读类应用具有UI复杂度低、数据流清晰的特点。 
二、核心实现方案 
1. 环境配置 
&#xff08;1&#xff09;使用React Native…...






编程新知
2025/7/6 2:55:54



















C++八股 —— 单例模式




文章目录 1. 基本概念2. 设计要点3. 实现方式4. 详解懒汉模式 1. 基本概念 
线程安全&#xff08;Thread Safety&#xff09; 
线程安全是指在多线程环境下&#xff0c;某个函数、类或代码片段能够被多个线程同时调用时&#xff0c;仍能保证数据的一致性和逻辑的正确性&#xf…...






编程新知
2025/7/6 22:10:07



















Python基于历史模拟方法实现投资组合风险管理的VaR与ES模型项目实战




说明&#xff1a;这是一个机器学习实战项目&#xff08;附带数据代码文档&#xff09;&#xff0c;如需数据代码文档可以直接到文章最后关注获取。 1.项目背景 
在金融市场日益复杂和波动加剧的背景下&#xff0c;风险管理成为金融机构和个人投资者关注的核心议题之一。VaR&…...






编程新知
2025/7/17 23:18:14



















GruntJS-前端自动化任务运行器从入门到实战




Grunt 完全指南&#xff1a;从入门到实战 
一、Grunt 是什么&#xff1f; 
Grunt是一个基于 Node.js 的前端自动化任务运行器&#xff0c;主要用于自动化执行项目开发中重复性高的任务&#xff0c;例如文件压缩、代码编译、语法检查、单元测试、文件合并等。通过配置简洁的任务…...






编程新知
2025/7/16 22:31:27



















LabVIEW双光子成像系统技术




双光子成像技术的核心特性 
双光子成像通过双低能量光子协同激发机制&#xff0c;展现出显著的技术优势&#xff1a; 深层组织穿透能力&#xff1a;适用于活体组织深度成像  高分辨率观测性能&#xff1a;满足微观结构的精细研究需求  低光毒性特点&#xff1a;减少对样本的损伤…...






编程新知
2025/7/18 16:57:24



















从“安全密码”到测试体系：Gitee Test 赋能关键领域软件质量保障




关键领域软件测试的"安全密码"&#xff1a;Gitee Test如何破解行业痛点 
在数字化浪潮席卷全球的今天&#xff0c;软件系统已成为国家关键领域的"神经中枢"。从国防军工到能源电力&#xff0c;从金融交易到交通管控&#xff0c;这些关乎国计民生的关键领域…...






编程新知
2025/7/18 21:36:58



















嵌入式常见 CPU 架构




架构类型架构厂商芯片厂商典型芯片特点与应用场景PICRISC (8/16 位)MicrochipMicrochipPIC16F877A、PIC18F4550简化指令集&#xff0c;单周期执行&#xff1b;低功耗、CIP 独立外设&#xff1b;用于家电、小电机控制、安防面板等嵌入式场景8051CISC (8 位)Intel&#xff08;原始…...






编程新知
2025/6/10 21:24:01



















微服务通信安全：深入解析mTLS的原理与实践




&#x1f525;「炎码工坊」技术弹药已装填&#xff01; 点击关注 → 解锁工业级干货【工具实测|项目避坑|源码燃烧指南】 一、引言&#xff1a;微服务时代的通信安全挑战 
随着云原生和微服务架构的普及&#xff0c;服务间的通信安全成为系统设计的核心议题。传统的单体架构中&…...






编程新知
2025/7/6 17:40:31