I am trying to convert a list of headers from a Request (see ) object to a plain key/value object.

// Create a Request object.
const req = new Request('', {
    headers: {
        'X-Test-header': 'Test'
    }
});

Sadly, the following doesn't work because the headers property is an iterator:

Unusable result:

const result1 = JSON.stringify(req.headers);
// result1 =  `{}`

Usable result but very verbose to create:

const headers = {};
for(const [key, value] of req.headers.entries()) {
    headers[key] = value;
}
const result2 = JSON.stringify(headers)
// result2 = `{'X-Test-Header': 'Test'}`

I'm looking for some sort of a one liner (maybe including Array.from() or some of the other methods on the Request.headers object like .keys()/.values() so that I am able to stringify the result.

I am trying to convert a list of headers from a Request (see https://developer.mozilla.org/en-US/docs/Web/API/Request/headers) object to a plain key/value object.

// Create a Request object.
const req = new Request('https://example.com', {
    headers: {
        'X-Test-header': 'Test'
    }
});

Sadly, the following doesn't work because the headers property is an iterator:

Unusable result:

const result1 = JSON.stringify(req.headers);
// result1 =  `{}`

Usable result but very verbose to create:

const headers = {};
for(const [key, value] of req.headers.entries()) {
    headers[key] = value;
}
const result2 = JSON.stringify(headers)
// result2 = `{'X-Test-Header': 'Test'}`

I'm looking for some sort of a one liner (maybe including Array.from() or some of the other methods on the Request.headers object like .keys()/.values() so that I am able to stringify the result.

• javascript
• iterator
• javascript-objects

2 Answers 2

You could use the Object.fromEntries() method, and then stringify that object like below. The .fromEntries() method will invoke the iterator of your headers object (ie: the .entries()) to grab the entries of the header object, and then use that to create an object. You can then pass this to JSON.stringify() to get your JSON string:

const req = new Request('https://example.com', {
    headers: {
        'X-Test-header': 'Test'
    }
});

const result1 = JSON.stringify(Object.fromEntries(req.headers));
console.log(result1);

If you just want to grab the headers as a regular object then you could generate an 2d array with key-value pair using Array.from() and create an object from the 2d array using Object.fromEntries()

const req = new Request('https://example.com', {
    headers: {
      'X-Test-header': 'Test',
      'accepts': 'application/json'
    }
});

const headers = Object.fromEntries(Array.from(req.headers.entries()));


console.log(JSON.stringify(headers));

Why this is working? The req.headers.entries() provides you an Interator {} which is an array type but not array. So, you could not implement any Array.prototype methods on it. But fortunately, Array.from() accepts any array type and converts it into an array.

So, Array.from(req.headers.entries()) generates an 2D array like -

[['X-Test-header', 'Test'], ['accepts', 'application/json']]

And if you see the Object.fromEntries() structure, then you find that this method takes the same 2D type array for generating an object.

Now you could apply JSON.stringify() on the headers object.