14

I'm using the library isomorphic-unfetch (https://www.npmjs.com/package/isomorphic-unfetch) to get JSON data from a Rest API. This is how I make the request:

    const res = await fetch(
      `url`
    );

To access the body I simply need to do 

    const response = await res.json()

But how do I access the response headers? If I log the response to my server's console this is what I see:

Response {
  size: 0,
  timeout: 0,
  [Symbol(Body internals)]: {
    // stuff
  },
  [Symbol(Response internals)]: {
    url: 'request url',
    status: 200,
    statusText: 'OK',
    headers: Headers { [Symbol(map)]: [Object: null prototype] },
    counter: 0
  }
}

What's Symbol(Response internals)? And how do I access its headers property?

VLAZ
  • 26,331
  • 9
  • 49
  • 67
lpetrucci
  • 1,285
  • 4
  • 22
  • 40

2 Answers2

12

To access its headers use one of the following:

const res = await fetch(url);
console.log(res.headers.get('content-type');
// or
res.headers.forEach(header => console.log(header));

https://github.github.io/fetch/#Headers

Makoto
  • 152
  • 1
  • 3
  • Thanks very much for this. I've been remotely 'debugging' my app to find the appropriate field on the request object using console.log, but the headers property is missing when logged. Any idea why that might be? – jsaven Nov 08 '21 at 21:11
  • It doesn't fetch the `[Symbol(Response internals)]`, as requested in the question. – mihai Mar 31 '23 at 07:53
1

When you run into a situation like this, you'll have access to those properties on the response object, so if you want to get access to the url property you'll simply have to write response.url and you'll get what you need.

fetch({someURL}, {
 method: "POST"
}).then((response) => response).then((result) => {return result.url});
aedwards22
  • 174
  • 2
  • 4