上传单个文件时，Filepond 在提交“真实”文件之前先提交一个空文件

Question

我试图了解 Filepond 正在上传到我的服务器方法的内容，但我遇到了一些非常令人困惑的事情。我只使用process服务器方法，并且一次测试一个文件。这是我的 Filepond 定义（这是与打字稿反应）

<FilePond
   ref={this.pond}
   allowMultiple={true}
   maxFiles={3}
   instantUpload={false}
   onupdatefiles={(files) => this.setState({files: files})}
   files={this.state.files}

   // @ts-ignore
   server={{
       process: this.getProcessUrl(),
       revert: null,
       fetch: null,
       load: null,
       restore: null,
   }}/>

files在状态对象上定义为any[]。processFiles()我们通过组件保留的元素引用来手动触发上传。根据页面其他位置生成的 id 构建 FilePond，并为其提供要传递的 auth 标头getProcessUrl。ServerUrl所以基本上server.process看起来像这样：

{ 
  url: "http://server/api/1234/upload",
  method: "POST",
  headers: {"Authorization": "foo"}
}

当添加单个文件（通过拖放，如果重要的话，通过拖放）触发上传时，如果我查看state.files数组中的一项，我发现我还没有通过浏览测试这一点。但是，Filepond 提交到我的服务器的内容如下所示：

------WebKitFormBoundary1YHKxKgBU2cvURKi
Content-Disposition: form-data; name="filepond"

{}
------WebKitFormBoundary1YHKxKgBU2cvURKi
Content-Disposition: form-data; name="filepond"; filename="test.csv"
Content-Type: text/csv


------WebKitFormBoundary1YHKxKgBU2cvURKi--

请注意首先发送的名为“filepond”的额外表单数据。

我一直在查看文档，在这种情况下，实际的帖子正文应该是什么样子，并没有告诉我期待多部分表单数据，所以我不明白我所看到的内容。额外的表单数据是否应该存在，而我的服务器代码应该忽略它还是什么？

谢谢。

Answer 1

FilePond 的作者在这里。FilePond 为每个文件发送两个项目。文件本身及其元数据。

元数据部分是您看到的第一个部分。它可以包含自定义元数据、图像裁剪信息等。第二个是文件。

我可以理解这可能会令人困惑，我正在考虑使其成为可选/更易于配置。如果您想解决此问题，您可以设置自定义处理方法，服务器文档中的流程示例应该可以开箱即用。