Headers: append() method

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.

Note: This feature is available in Web Workers.

The append() method of the Headers interface appends a new value onto an existing header inside a Headers object, or adds the header if it does not already exist.

The difference between set() and append() is that if the specified header already exists and accepts multiple values, set() will overwrite the existing value with the new one, whereas append() will append the new value onto the end of the set of values.

For security reasons, some headers can only be controlled by the user agent. These headers include the forbidden request headers and forbidden response header names.

Syntax

js
append(name, value)

Parameters

name

The name of the HTTP header you want to add to the Headers object.

value

The value of the HTTP header you want to add.

Return value

None (undefined).

Examples

Creating an empty Headers object is simple:

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

You could add a header to this using append():

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

If the specified header already exists, append() will change its value to the specified value. If the specified header already exists and accepts multiple values, append() will append the new value to the end of the value set:

js
myHeaders.append("Accept-Encoding", "deflate");
myHeaders.append("Accept-Encoding", "gzip");
myHeaders.get("Accept-Encoding"); // Returns 'deflate, gzip'

To overwrite the old value with a new one, use Headers.set.

Specifications

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

Browser compatibility

desktop mobile server
Chrome
Edge
Firefox
Opera
Safari
Chrome Android
Firefox for Android
Opera Android
Safari on iOS
Samsung Internet
WebView Android
WebView on iOS
Bun
Deno
Node.js
append
Chrome – Full support
Chrome 42 (Release date: 2015-04-14)
footnote Full support
Edge – Full support
Edge 14 (Release date: 2016-08-02)
footnote Full support
Firefox – Full support
Firefox 39 (Release date: 2015-07-02)
footnote Full support
Opera – Full support
Opera 29 (Release date: 2015-04-28)
footnote Full support
Safari – Full support
Safari 10.1 (Release date: 2017-03-27)
footnote Full support
Chrome Android – Full support
Chrome Android 42 (Release date: 2015-04-15)
footnote Full support
Firefox for Android – Full support
Firefox for Android 39 (Release date: 2015-07-02)
footnote Full support
Opera Android – Full support
Opera Android 29 (Release date: 2015-04-28)
footnote Full support
Safari on iOS – Full support
Safari on iOS 10.3 (Release date: 2017-03-27)
footnote Full support
Samsung Internet – Full support
Samsung Internet 4 (Release date: 2016-03-11)
footnote Full support
WebView Android – Full support
WebView Android 42 (Release date: 2015-04-15)
footnote Full support
WebView on iOS – Full support
WebView on iOS 10.3 (Release date: 2017-03-27)
footnote Full support
Bun – Full support
Bun 1 (Release date: 2023-09-08)
footnote Full support
Deno – Full support
Deno 1 (Release date: 2020-05-13)
footnote Full support
Node.js – Full support
Node.js 18 (Release date: 2022-04-19)
footnote Full support

Legend

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

Full support
Full support

See also