小编典典

HTTP 文件上传是如何工作的?

all

当我提交这样一个简单的表格并附有文件时:

<form enctype="multipart/form-data" action="http://localhost:3000/upload?upload_progress_id=12344" method="POST">
<input type="hidden" name="MAX_FILE_SIZE" value="100000" />
Choose a file to upload: <input name="uploadedfile" type="file" /><br />
<input type="submit" value="Upload File" />
</form>

它如何在内部发送文件?文件是否作为 HTTP 正文的一部分作为数据发送?在此请求的标头中,我没有看到与文件名相关的任何内容。

我只是想知道发送文件时 HTTP 的内部工作原理。


阅读 125

收藏
2022-03-04

共1个答案

小编典典

让我们看看当您选择文件并提交表单时会发生什么(为简洁起见,我截断了标题):

POST /upload?upload_progress_id=12344 HTTP/1.1
Host: localhost:3000
Content-Length: 1325
Origin: http://localhost:3000
... other headers ...
Content-Type: multipart/form-data; boundary=----WebKitFormBoundaryePkpFF7tjBAqx29L

------WebKitFormBoundaryePkpFF7tjBAqx29L
Content-Disposition: form-data; name="MAX_FILE_SIZE"

100000
------WebKitFormBoundaryePkpFF7tjBAqx29L
Content-Disposition: form-data; name="uploadedfile"; filename="hello.o"
Content-Type: application/x-object

... contents of file goes here ...
------WebKitFormBoundaryePkpFF7tjBAqx29L--

注意:每个边界字符串必须以 extra
作为前缀--,就像最后一个边界字符串的末尾一样。上面的例子已经包含了这个,但很容易错过。请参阅下面@Andreas 的评论。

不是对表单参数进行 URL 编码,而是将表单参数(包括文件数据)作为请求正文中的多部分文档中的部分发送。

在上面的示例中,您可以看到MAX_FILE_SIZE在表单中设置了值的输入,以及包含文件数据的部分。文件名是Content- Disposition标题的一部分。

2022-03-04