title: Adding headers to graphql client causes Failed to execute 'fetch' on 'Window' error
body: <p>This code causes the error and if I remove the headers it does not .I followed the instructions here <a href="https://www.apollographql.com/docs/react/networking/authentication" rel="nofollow noreferrer">https://www.apollographql.com/docs/react/networking/authentication</a>. Here are my cors setting for my backed</p>
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-html lang-html prettyprint-override"><code>  //Cors setting on the backend
  origin: 'http://localhost:3000',
    credentials: true,</code></pre>
  </div>
  </div>
  </p>
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>const link = new HttpLink({
    uri: process.env.NEXT_PUBLIC_SERVER_URL,
  });
  
  const authLink = setContext((_, { headers }) =&gt; {
    return {
      headers: {
        ...headers,
        authorization: tokenVar ? `Bearer ${tokenVar}` : '',
      },
    };
  });
  
  const apolloClient = new ApolloClient({
    //@ts-ignore
    uri: authLink.concat(link),
    cache: new InMemoryCache({
      typePolicies: {
        Query: {
          fields: {
            token: {
              read() {
                return tokenVar();
              },
            },
            userData: {
              read() {
                return userDataVar();
              },
            },
          }</code></pre>
  </div>
  </div>
  </p>