ブラウザがmultipart/formdataを強制的に送信する

Question

フェッチAPIを使用してブラウザから投稿要求を送信しています。

const headers = new Headers(); 
headers.append("Content-Type", "application/x-www-form-urlencoded"); 

fetch('/signup', { 
    method: 'POST', 
    body: new FormData(document.querySelector('form')), 
    credentials: 'same-origin', 
    headers 
}).then(
    response => response.text() 
).then(
    text => console.log(text) 
); 

私のフォームは、テキスト、メールアドレスとパスワードの入力タイプのみが含まれています。これは私のコードです。私は、フォームデータがcontent-typeアプリケーション/ x-www-form-urlencodedで送信されることを期待していましたが、multipart/formdataとして送信されています。

フェッチリクエストでヘッダーを手動で設定し、フォームのencTypeプロパティを明示的に指定しようとしましたが（デフォルトではURLエンコードする必要があります）、動作しません。

これはChromeとSafariの両方で発生します。私はJSONを使って簡単にこれを回避できますが、なぜこれが起こるのかを知りたいのです！ the specから

Answer 1

：オブジェクトの型に

スイッチ：オブジェクトとmultipart/form-dataエンコーディング・アルゴリズムを実行し、アクションに

いるFormData

セットアクション、フォームデータセットとしてとutf-8を明示的な文字エンコーディングとして使用します。

コンテンツタイプをmultipart/form-data;boundary=に設定し、その後にmultipart/form-dataエンコーディングアルゴリズムによって生成されたmultipart/form-data境界文字列を設定します。

これは、FormDataオブジェクトを渡しているためにmultipartを使用します。これは、フェッチがFormDataオブジェクトで行うことです。

---

あなたがapplication/x-www-form-urlencodedデータを送信したい場合は、その方法を手動でエンコードまたはURLSearchParamsインタフェースを実装するオブジェクトを使用します。

あなたはそうする必要はありません。 multipart/form-dataは標準であり、私はそれを処理できないフォームデータ解析ライブラリに遭遇したことはありません。あなたが持っている必要がある唯一の否定は、要求がわずかに多くのバイトを占めることです。