FormData: append() メソッド

Baseline Widely available

This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015.

メモ: この機能はウェブワーカー内で利用可能です。

append()FormData インターフェイスのメソッドで、FormData オブジェクト内の既存のキーに新しい値を追加します。キーがまだ存在しない場合は追加します。

set()append() の違いは、指定されたキーが既に存在する場合、set() は既存のすべての値を新しい値で上書きすることです。 一方、append() は、既存の値のセットの最後に新しい値を追加します。

構文

js
append(name, value)
append(name, value, filename)

引数

name

value にあるデータのフィールド名です。

value

フィールドの値です。文字列または BlobFile などのサブクラスを含む)です。これらの何れでもないものが指定された場合、値は文字列に変換されます。

filename 省略可

第 2 引数に Blob または File を渡した場合に、サーバーに報告されるファイル名(文字列)です。Blob オブジェクトの既定のファイル名は "blob" です。File オブジェクトの既定値は、ファイルのファイル名です。

メモ: FormData オブジェクトに追加するデータとして Blob を指定した場合、"Content-Disposition" ヘッダーでサーバーに報告されるファイル名はブラウザーによって異なることがあります。

返値

なし (undefined)。

js
formData.append("username", "Chris");

値が Blob (または File)である場合、filename 引数でそのファイル名を指定します。

js
formData.append("user-pic", myFileInput.files[0], "chris.jpg");

通常のフォームデータと同様に、同じ名前の複数の値を追加することができます。

js
formData.append("user-pic", myFileInput.files[0], "chris1.jpg");
formData.append("user-pic", myFileInput.files[1], "chris2.jpg");

値が文字列でも Blob でもない場合、append() は自動的に文字列に変換します。

js
formData.append("name", true);
formData.append("name", 72);
formData.getAll("name"); // ["true", "72"]

仕様書

Specification
XMLHttpRequest
# dom-formdata-append

ブラウザーの互換性

Report problems with this compatibility data on GitHub
desktopmobileserver
Chrome
Edge
Firefox
Opera
Safari
Chrome Android
Firefox for Android
Opera Android
Safari on iOS
Samsung Internet
WebView Android
WebView on iOS
Deno
Node.js
append
filename parameter

Legend

Tip: you can click/tap on a cell for more information.

Full support
Full support
See implementation notes.

関連情報