Filepond がサーバー メソッドにアップロードしているものを理解しようとしていますが、非常に紛らわしいことに遭遇しました。私はprocess
サーバー方式のみを使用しており、一度に 1 つのファイルでテストしています。これが私のFilepond定義です(これはtypescriptに反応します)
<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()
コンポーネントが維持する要素 ref を介して呼び出すことにより、アップロードを手動でトリガーしています。getProcessUrl
ページの別の場所で生成された ID に基づいて for FilePond を構築し、ServerUrl
渡す認証ヘッダーを与えます。したがって、基本的にserver.process
は次のようになります。
{
url: "http://server/api/1234/upload",
method: "POST",
headers: {"Authorization": "foo"}
}
単一のファイルが追加された状態でアップロードがトリガーされた場合 (それが重要な場合はドラッグ アンド ドロップを介して、ブラウズでこれをテストしていないことがわかります) state.files
、配列に 1 つの項目があることを確認します。ただし、Filepond がサーバーに送信する内容は次のようになります。
------WebKitFormBoundary1YHKxKgBU2cvURKi
Content-Disposition: form-data; name="filepond"
{}
------WebKitFormBoundary1YHKxKgBU2cvURKi
Content-Disposition: form-data; name="filepond"; filename="test.csv"
Content-Type: text/csv
------WebKitFormBoundary1YHKxKgBU2cvURKi--
最初に送信される「filepond」という名前の余分なフォームデータに注意してください。
私はドキュメントを見てきましたが、実際の投稿本文がこの場合、マルチパートフォームデータを期待するように言わない限り、どのように見えるべきかについて漠然としているので、私が見ているものを理解していません. その追加のフォーム データがそこにあるはずで、サーバー コードはそれを無視する必要がありますか?
ありがとう。