header is always empty for each response received on client from server

[techyrajeev]

I have added a afterwareLink which basically reads the response header and sets up the token.

const afterwareLink = new ApolloLink((operation, forward) => {
return forward(operation).map(response => {
const context = operation.getContext();
const { response: { headers } } = context;

if (headers) {
const refreshToken = headers.get('x-refresh-token');

if (refreshToken) {
localStorage.setItem('refreshToken', refreshToken);
}
}

return response;
});
});

My link ordering is like this
I tried both approaches
let links = [elink, stateLink, setSiteIdHeaderLink, afterwareLink, httpLink]

let links = [elink, stateLink, setSiteIdHeaderLink, httpLink, afterwareLink]

Every time I print the response headers its always empty, but I can see them in browser that it is being sent from server but not receiving them in context.
const context = operation.getContext();

Packages:

"apollo-boost": "^0.1.22",
  "apollo-cache-inmemory": "^1.3.11",
  "apollo-cache-persist": "^0.1.1",
  "apollo-client": "^2.4.7",
  "apollo-link": "^1.2.3",
  "apollo-link-batch-http": "^1.2.8",
  "apollo-link-http": "^1.5.9",
  "apollo-link-retry": "^2.2.5",
  "apollo-link-schema": "^1.1.1",
  "apollo-link-token-refresh": "^0.2.3",
  "apollo-link-ws": "^1.0.9",

I tried to use custom-fetch method event that didn't worked

const customFetch = (uri, options) => {
    let promise = fetch(uri, options)
    promise
      .then(response => {
        let refreshToken = response.headers.get('token-x')
        console.log(refreshToken)
        if (refreshToken) {
          console.log(refreshToken)
        }
        return response
      })
      .catch(e => {
        throw e
      })
    return promise
  }
const httpLink = middlewareLink.concat(createHttpLink({uri: API_URL ,credentials: 'include', opts:{
  credentials:'include'
}, fetch: customFetch }));

[oqx]

Did you ever figure out a solution? I'm experiencing this same issue. I can see in devtools that the response header I'm looking for is ultimately coming back, however the response.headers is an empty Headers constructor in the afterware.

[peterbabic]

This is working for me, but I would like some nice way of receiving response headers with apollo client

import { InMemoryCache } from "apollo-cache-inmemory"
import { ApolloClient } from "apollo-client"
import { ApolloLink } from "apollo-link"
import { HttpLink } from "apollo-link-http"
import fetch from "node-fetch"

const afterwareLink = new ApolloLink((operation, forward) =>
    forward(operation).map(response => {
        const context = operation.getContext()
        const {
            response: { headers },
        } = context

        console.log(headers) 

        return response
    })
)
const myfetch = fetch as any // this hack is sadly not needed with apollo-boost
const httpLink = new HttpLink({ uri: "http://localhost:4000/graphql", fetch: myfetch })

const links = [afterwareLink, httpLink]
const link = ApolloLink.from(links)
const client = new ApolloClient({ link, cache: new InMemoryCache() })

[alan345]

I have founded the answer here: https://stackoverflow.com/questions/47443858/apollo-link-response-headers/58986484#58986484