Headers()

Baseline Widely available

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

Headers() コンストラクターは、新しい Headers オブジェクトを生成します。

構文

js
new Headers()
new Headers(init)

引数

init 省略可

Headers オブジェクトに事前に入力したい、任意の HTTP ヘッダーを含むオブジェクトです。これは文字列の値を持つ単純なオブジェクトリテラル、名前と値の組の配列（各組は 2 つの要素を持つ文字列の配列）、あるいは既存の Headers オブジェクトになります。最後の場合は、新しい Headers オブジェクトは既存の Headers オブジェクトからそのデータをコピーします。

例

簡単に空の Headers オブジェクトを生成できます。

js
const myHeaders = new Headers(); // Currently empty

Headers.append を使用してヘッダーを追加できます。

js
myHeaders.append("Content-Type", "image/jpeg");
myHeaders.get("Content-Type"); // Returns 'image/jpeg'

または、Headers オブジェクトの生成時に必要なヘッダーを追加することもできます。次のスニペットでは、新しい Headers を作成し、コンストラクターに初期化オブジェクトを引数として渡してヘッダーを追加しています。

js
const httpHeaders = {
  "Content-Type": "image/jpeg",
  "X-My-Custom-Header": "Zeke are cool",
};
const myHeaders = new Headers(httpHeaders);

最初の Headers を初期化オブジェクトとして渡して、別の Headers オブジェクトを生成できます。

js
const secondHeadersObj = new Headers(myHeaders);
secondHeadersObj.get("Content-Type"); // Would return 'image/jpeg' — it inherits it from the first headers object

また、Headers オブジェクトを作成する際に、二次元の配列を使用して、同じ値を持つ複数のヘッダーを追加することができます。以下のスニペットでは、コンストラクターの引数に初期化配列を渡して、複数の Set-Cookie ヘッダーを持つ新しい Headers オブジェクトを作成しています。

js
const headers = [
  ["Set-Cookie", "greeting=hello"],
  ["Set-Cookie", "name=world"],
];
const myHeaders = new Headers(headers);

仕様書

Specification
Fetch Standard
# ref-for-dom-headers①

ブラウザーの互換性

BCD tables only load in the browser

関連情報