如今使用HTTP协议定制API已经是十分常见的事情,在普通的GET和POST请求中传递些参数估计人人都会,但是如果我们需要上传文件呢?如果只是传递单个文件,那么将数据流POST给服务器端即可。但如果需要上传多个文件,或是在文件之外需要附带一些信息,那么又该怎么做呢?之前我遇到过一些朋友是这么打算的,他们说,不如就把文件流转化为文本,然后把它当作一个普通的字段传递。这么做自然可以“实现功能”,但缺点也很多。首先,将二进制流转化为文本会增大体积(例如最常见的BASE64编码会增大1/3的数据量);其次,既然互联网上存在相关的协议,又为何要自定义一套规则呢?其实这便是《RFC 1867 - Form-based File Upload in HTML》,它是我们用HTML表单上传文件时使用的传输协议,虽然十分常用,但似乎了解它的人并不多。

普通POST操作

说起HTML表单,大家绝对不会陌生。例如下面这样的HTML表单:

提交时会向服务器端发出这样的数据(已经去除部分不相关的头信息):

POST http://www.baidu.com/ HTTP/1.1Host: www.baidu.com

Content-Length:74Content-Type: application/x-www-form-urlencoded

myText1=hello+world&myText2=%E4%BD%A0%E5%A5%BD%E4%B8%96%E7%95%8C

对于普通的HTML POST表单,它会在头信息里使用Content-Length注明内容长度。头信息每行一条,空行之后便是Body,即“内容”。此外,我们可以发现它的Content-Type是application/x-www-form-urlencoded,这意味着消息内容会经过URL编码,就像在GET请求时URL里的Query String那样。在上面的例子中,myText1里的空格被编码为加号,而myText2,您看得出这是“你好世界”这四个汉字吗?

使用POST上传文件

不过之前的HTML表单是无法上传文件的,因此RFC 1867应运而生,它的目的便是让HTML表单可以提交文件。它对HTML表单的扩展主要是:

为input标记的type属性增加一个file选项。

在POST情况下,为form标记的enctype属性定义默认值为application/x-www-form-urlencoded。

为form标记的enctype属性增加multipart/form-data选项。

于是,如果我们要使用HTML表单提交文件,则可以使用如下定义:

为了实验所需,我们创建两个文件file1.txt和file2.txt,内容分别为“This is file1.”及“This is file2, it's bigger.”。在文本框里写上“hello world”,并选择这两个文件,提交,则会看到浏览器传递了如下数据:

POST http://www.baidu.com/ HTTP/1.1Host: www.baidu.com

Content-Length:495Content-Type: multipart/form-data;boundary=---------------------------7db2d1bcc50e6e-----------------------------7db2d1bcc50e6e

Content-Disposition: form-data;name="myText"hello world

-----------------------------7db2d1bcc50e6e

Content-Disposition: form-data;name="upload1"; filename="C:\file1.txt"Content-Type: text/plain

This is file1.

-----------------------------7db2d1bcc50e6e

Content-Disposition: form-data;name="upload2"; filename="C:\file2.txt"Content-Type: text/plain

This is file2,it's longer.

-----------------------------7db2d1bcc50e6e--

这段内容比较有趣,值得细细观察。首先,第一个空行之前自然还是HTTP头,之后则是Body,而此时的Body也比之前要复杂一些。根据RFC 1867定义,我们需要选择一段数据作为“分割边界”,这个“边界数据”不能在内容其他地方出现,一般来说使用一段从概率上说“几乎不可能”的数据即可。例如,上面这段数据使用的是IE 9,而我在Chrome下则是这样的:

POST http://www.baidu.com/ HTTP/1.1Host: www.baidu.com

Content-Length:473Content-Type: multipart/form-data;boundary=----WebKitFormBoundaryW49oa00LU29E4c5U------WebKitFormBoundaryW49oa00LU29E4c5U

Content-Disposition: form-data;name="myText"hello world

------WebKitFormBoundaryW49oa00LU29E4c5U

Content-Disposition: form-data;name="upload1"; filename="file1.txt"Content-Type: text/plain

This is file1.

------WebKitFormBoundaryW49oa00LU29E4c5U

Content-Disposition: form-data;name="upload2"; filename="file2.txt"Content-Type: text/plain

This is file2,it's bigger.

------WebKitFormBoundaryW49oa00LU29E4c5U--

很显然它们两个选择了不同的数据“模式”作为边界——事实上,浏览器提交两次数据时,使用的边界也可能不会相同,这都没有问题。

选择了边界之后,便会将它放在头部的Content-Type里传递给服务器端,实际需要传递的数据便可以分割为“段”,每段便是“一项”数据。从上面的内容中大家应该都能看出数据传输的规范,因此便不做细谈了。只强调几点:

数据均无需额外编码,直接传递即可,例如您可以看出上面的示例中的“空格”均没有变成加号。至于这里您可以看到清晰地文字内容,是因为我们上传了仅仅包含可视ASCII码的文本文件,如果您上传一个普通的文件,例如图片,捕获到的数据则几乎完全不可读了。

IE和Chrome在filename的选择策略上有所不同,前者是文件的完整路径,而后者则仅仅是文件名。

数据内容以两条横线结尾,并同样以一个换行结束。在网络协议中一般都以连续的CR、LF(即\r、\n,或0x0D、Ox0A)字符作为换行,这与Windows的标准一致。如果您使用其他操作系统,则需要考虑它们的换行符。

实现

了解上述策略之后,使用编程来实现文件上传也是顺理成章的事情,例如我这里便编写了一段简单的代码实现这一功能。

首先,我们定义一个Part类,表示每“段”,它的Write方法会写入整段数据。每段数据分为Header和Body两部分,使用WriteHeader和WriteBody两个抽象方法写入:

publicabstractclassPart

{protectedabstractvoidWriteHeader(StreamWriter writer);protectedabstractvoidWriteBody(StreamWriter writer);publicvoidWrite(StreamWriter writer)

{this.WriteHeader(writer);

writer.WriteLine();this.WriteBody(writer);

}

}

接着便是表示普通字段的NormalPart和文件上传得FilePart:

publicclassFilePart : Part

{publicstringName {get;set; }publicstringFilePath {get;set; }protectedoverridevoidWriteHeader(StreamWriter writer)

{

writer.WriteLine("Content-Disposition: form-data; name=\"{0}\"; filename=\"{1}\"",this.Name,

Path.GetFileName(this.FilePath));

writer.WriteLine("Content-Type: application/octet-stream");

}protectedoverridevoidWriteBody(StreamWriter writer)

{

var data=File.ReadAllBytes(this.FilePath);

writer.Flush();

writer.BaseStream.Write(data,0, data.Length);

writer.WriteLine();

}

}

最后便是统一写入各段的Write方法,我在这里使用新建的GUID作为“边界”:

staticvoidWrite(StreamWriter writer, IEnumerableparts)

{

var guidBytes=Guid.NewGuid().ToByteArray();

var boundary="----------------"+Convert.ToBase64String(guidBytes);foreach(var pinparts)

{

writer.WriteLine(boundary);

p.Write(writer);

}

writer.WriteLine(boundary+"--");

}

其实就是这么简单。不过在实际情况中可能会复杂一些。例如,由于HTTP协议需要先发送头信息,因此我们需要提前计算出Content-Length再传输所有内容,不过我相信这对您来说也不会是件难事。

其他

世界上已经有了足够多的协议,在我看来在绝大部分情况下都无所谓使用自定义的协议。协议在制定时,往往也会考虑到安全、性能等诸多方面,有时候我们自己所谓的“顾虑”其理由也并不充分。更重要的是,使用现成的协议,我们往往都有现成的实现,对于开发和测试都会有很大帮助。

RFC 1867是一个很简单的协议,当然再简单也不是我这短短一篇文章可以完整描述的,其中很多细节(例如在同一个“段”中上传多个文件)就要靠您自己去挖掘了。

html文件上传协议,模拟HTML表单上传文件(RFC 1867)相关推荐

  1. QT模拟表单上传文件到微信服务器

    最近做微信开发,需要上传素材到微信服务器,我就用qt写了一个界面上传素材,首先我们来看下最终的界面: 然后将里面的access_token后面的lineEdit命名为:accessMediaEdit, ...

  2. PHP curl模拟表单上传文件 微信公众号素材管理接口crul文件上传核心源码

    PHP curl模拟表单上传文件  微信公众号素材管理接口crul文件上传核心源码 /*** curl 上传文件* @param $url* @param $filePath* @param stri ...

  3. ajax 模拟表单提交,Ajax模拟Form表单提交,含多种数据上传

    ---恢复内容开始--- Ajax提交表单.使用FormData提交表单数据和上传的文件(这里的后台使用C#获取,你可以使用Java一样获取) 有时候前台的数据提交到后台,不想使用form表单上传,希 ...

  4. WebApi发送HTML表单数据:文件上传与多部分MIME

    5.3 Sending HTML Form Data 5.3 发送HTML表单数据(2) 本文引自:http://www.cnblogs.com/r01cn/archive/2012/12/20/28 ...

  5. 七牛云上传文件之表单上传文件

    本人愚钝,七牛云上传文件的开发说明文档看了好久才搞懂,才能完成一个实例跑起来.现在做一下总结. 1.注册七牛,新建一个bucket,并获得ak,sk这个不用说了.不涉及到程序编码,重点讲一下编码的流程 ...

  6. php无表单上传文件,php – 如何使用没有实体类的表单上传文件

    我试图使用没有实体类的表单上传文件.到目前为止没有运气. // Controller public function uploadAction() { $request = $this->get ...

  7. form表单上传文件_SpringBoot中如何使用SpringMVC上传文件?

    今天我们要说的这个话题很简单,不要问为啥,因为SpringBoot,哈哈.现在SpringBoot可以说人人都会用了,它的好处是显而易见的,大大的简化了配置,一起来看看吧. 我们分以下3种情况来谈这个 ...

  8. javaweb开发之处理表单上传文件和文件下载

    2019独角兽企业重金招聘Python工程师标准>>> 一.基于表单的上传文件 1. enctype属性 当表单需要上传文件时,需指定表单 enctype 的值为 multipart ...

  9. Android之PC浏览器上传表单格式大文件到手机客户端read函数阻塞问题

    1 .问题 PC浏览器上传表单格式大文件到手机服务器端,然后read文件真实数据时候出现阻塞. 比如 User-Agent: PostmanRuntime/7.26.1Accept: */*Cache ...

  10. php文件上传并保存路径到数据库,thinkphp表单上传文件并将文件路径保存到数据库中?...

    上传单个文件,此文以上传图片为例,上传效果如图所示 创建数据库upload_img,用于保存上传路径 CREATE TABLE `seminar_upload_img` (  `id` int(11) ...

最新文章

  1. 视频 网站 页面开关灯实现方法
  2. (C++)类内运算符重载时:此运算符函数的参数太多/少
  3. EIGRP 实验2: 邻居关系
  4. 算法----有效的括号
  5. GDCM:解析XPATH文件的测试程序
  6. 5 CrawlSpider操作
  7. vs2005中的aspnetdb(转)
  8. MacOS Monterey12.3和Big Sur11.6.5离线安装包
  9. Eclipse 跌落“神坛”,这款 IDE 后来居上!
  10. ubuntu下安装gcc
  11. go test生成html测试报告
  12. 中国遥感卫星地面站存档数据目录服务系统
  13. 火狐浏览器——问题解决:网络正常但无法打开百度页面和搜索功能
  14. loadrunner icrosoft Visual c++2005 sp1运行时组件,就会提示命令行选项语法错误,键入“命令/?”
  15. 哔哩哔哩作者页上的作品批量保存的方法
  16. 手把手教你写保研简历|计算机保研|保研夏令营文书写作|简历模板
  17. 最优化算法学习笔记+个人总结(一)
  18. 关于mybatis的分页实现
  19. 【题解】CF808G Anthem of Berland
  20. linux怎么打开rpm文件怎么打开,RPM格式文件怎么打开

热门文章

  1. 软件测试行业中ta表示什么意思,软件测试架构师(TA)的职位特点
  2. Julia1.4文档 —— 5. Julia 字符串
  3. 不限机型,手机端实时玩转3D、混合现实,快手Y-tech有黑科技(已开源)
  4. 华为耳机登陆天宫空间站 降噪科技成关键因素
  5. 推荐两款个人深度使用的笔记软件
  6. 以太镇火了,快卖掉手中的猫买楼吧
  7. openwrt_ipsec_racoon.init 分析
  8. STM32+QRCode二维码生成
  9. 360P 480P 720P 1080P 1080i 说明
  10. chrome js 读取文件夹_javascript – 如何从chrome扩展程序读取文件?