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

这篇具有很好参考价值的文章主要介绍了再学http-为什么文件上传要转成Base64?。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。

1 前言

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

2 multipart/form-data上传

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

 

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>

页面展示也比较简单

再学http-为什么文件上传要转成Base64?,IT技术系列,http,网络协议,网络

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

再学http-为什么文件上传要转成Base64?,IT技术系列,http,网络协议,网络

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

再学http-为什么文件上传要转成Base64?,IT技术系列,http,网络协议,网络

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

再学http-为什么文件上传要转成Base64?,IT技术系列,http,网络协议,网络

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

 

java

复制代码

@RestController public 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)

3 Base64上传

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

3.1 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个字节。

再学http-为什么文件上传要转成Base64?,IT技术系列,http,网络协议,网络

表3.1

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

再学http-为什么文件上传要转成Base64?,IT技术系列,http,网络协议,网络

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

再学http-为什么文件上传要转成Base64?,IT技术系列,http,网络协议,网络

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

3.2 Base64编码的作用

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

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

4 总结

本文最后再来总结对比下这两种文件上传的方式优缺点。
(1)multipart/form-data可以传输二进制流,效率较高,Base64需要编码解码,会耗费一定的性能,效率较低。
(2)Base64不受请求方式的限制,灵活度高,http文件二进制流方式传输只能通过multipart/form-data的方式,灵活度低。
因为随着机器性能的提升,小文件通过二进制流传输和字符串传输,我们对这两种方式时间延迟的感知差异并不那么明显,因此大部分情况下我们更多考虑的是灵活性,所以采用Base64编码的情况也就比较多。文章来源地址https://www.toymoban.com/news/detail-677401.html

到了这里,关于再学http-为什么文件上传要转成Base64?的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包 赞助服务器费用

相关文章

  • 为什么 https 比 http 更安全?

    http 和 https 在许多网站都有用到,但是现在都是极力倡导使用 https ,究其原因就是 http 的安全性不够高,在数据传输过程中可能会遭到黑客窃取。 本篇文章会先讲解 http 缺点,然后再讲解 https 是如何解决这些问题来保证安全的。 一、http 缺点 通信使用明文(不加密),内容

    2024年01月24日
    浏览(37)
  • 为什么有了 HTTP 还要 RPC

    哈喽大家好,我是咸鱼 随着互联网技术的发展,分布式架构越来越被人们所采用。在分布式架构下, 为了实现复杂的业务逻辑,应用程序需要分布式通信实现远程调用 而这时候就需要一种协议来支持远程过程调用,以便实现不同应用程序之间的数据交换和信息传递。其中常

    2024年02月05日
    浏览(38)
  • 爬虫为什么需要 HTTP 代理 IP?

    前言 爬虫在互联网数据采集、分析和挖掘中扮演着至关重要的角色,但是对于目标网站而言,频繁的爬虫请求可能会对其服务器产生不小的负担,严重的情况甚至会导致网站崩溃或者访问受限。为了避免这种情况的发生,同时也为了保护客户端的隐私和安全,爬虫使用HTTP代

    2024年02月07日
    浏览(38)
  • 既然有HTTP协议,为什么还要有RPC?

    我想起了我刚工作的时候,第一次接触RPC协议,当时就很懵, 我HTTP协议用得好好的,为什么还要用RPC协议?   于是就到网上去搜。   不少解释显得非常官方,我相信大家在各种平台上也都看到过,解释了又好像没解释,都在 用一个我们不认识的概念去解释另外一个我们不

    2024年02月09日
    浏览(26)
  • 为什么有了HTTP,还需要WebSocket协议?

    目录 WebSocket是什么? WebSocket怎样建立连接? WebSocket的实际用途 WebSocket 与 HTTP 的选择 HTTP 是基于 TCP协议 的,同一时间里,客户端和服务器只能有一方主动发数据,是 半双工通信 。 通常,打开某个网页,我们每点击一次网页上的某个选项,前端就会发送一次HTTP请求,网站

    2024年02月11日
    浏览(34)
  • 既然有 HTTP 协议,为什么还要有 RPC

    什么是HTTP HTTP 协议( H yper T ext T ransfer P rotocol),又叫做 超文本传输协议 。平时上网在浏览器上敲个网址就能访问网页,这里用到的就是HTTP协议。 什么是RPC RPC ( R emote P rocedure C all),又叫做 远程过程调用 。它并不是一个具体的协议,而是一种 调用方式 。 像之前的单体

    2024年02月09日
    浏览(28)
  • HTTP协议演进:为什么说HTTP/1.1的时代已经过去了

    前言   欢迎来到今天的每日一题,每日一提。昨天聊到了,HTTP 是什么。有哪些组成部分。并且最后提到了 HTTP 的一些缺点,比如:性能较低,容易导致网络拥塞和延迟,不支持服务器推送等等。设计协议的大佬们,对这样的缺点肯定是不能容忍的,所以 HTTP2 它来了。 什

    2023年04月17日
    浏览(28)
  • 为什么HTTP/3要引入UDP?(快速了解QUIC)

    笔者前段时间参加银行技术面时被问到了这个问题,特来整理资料以供记录分享 HTTP/3是HTTP协议的最新版本,它的诞生是为了解决HTTP/1和HTTP/2在性能和效率上的问题。在HTTP/3之前,HTTP协议使用的是TCP作为传输层协议。然而,随着互联网的发展,TCP的性能瓶颈逐渐显现出来。为

    2024年01月17日
    浏览(40)
  • HTTPS工作过程,国家为什么让http为什么要换成https,Tomcat在MAC M1电脑如何安装,Tomcat的详细介绍

    目录 引言 一、HTTPS工作过程 二、Tomcat 在访达中找到下载好的Tomcat文件夹(这个要求按顺序) zsh: permission denied TOMCAT的各部分含义: 在密码中一般是:明文+密钥-密文(加密) ,密文+密钥-明文(解密) 那么为什么大家放弃了原有的http换为https呢? 这我们就要先介绍一下H

    2024年02月08日
    浏览(42)
  • SSL/TLS协议详解 - https为什么比http更安全

    SSL/TLS是世界上应用最广泛的密码通信方法。比如,在网上商城输入信用卡卡号时,Web浏览器就会使用SSL/TLS进行密码通信。使用SSL/TLS可以对通信对象进行认证,还可以确保通信内容的机密性。TLS相当于SSL的后续版本。 SSL (Secure Sockets Layer)安全套接层协议 :由Netscape公司开发

    2024年02月05日
    浏览(37)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包