@ledsun blog

無味の味は佳境に入らざればすなわち知れず

FormData

FormData

先週、Form要素のデータがそのまんま欲しくて、はじめて使いました。 そのときは次のようにJSON形式で送信しました。

const formData = new FormData(document.bookForm);
const name = formData.get("name");
const age = formData.get("age");
const data = {
  name,
  age
};

jQuery.ajax({
  type: "post",
  url: "/books/,
  data: JSON.stringify(data),
  contentType: "application/json"
});

developer.mozilla.org

The FormData object lets you compile a set of key/value pairs to send using XMLHttpRequest.

と、あるのでずいぶん昔からあるAPIみたいです。 次のように使われていたようです。

javascript - How to send FormData objects with Ajax-requests in jQuery? - Stack Overflow

var xhr = new XMLHttpRequest(),
    fd = new FormData();

fd.append( 'file', input.files[0] );
xhr.open( 'POST', 'http://example.com/script.php', true );
xhr.onreadystatechange = handler;
xhr.send( fd );

この書き方の場合はmultipart/from-data形式で送信されるようです。

entries()があるので、ES6以降も拡張されているようです。

参考情報