kamilkisiela / apollo-angular

A fully-featured, production ready caching GraphQL client for Angular and every GraphQL server 🎁
https://apollo-angular.com
MIT License
1.5k stars 309 forks source link

Passing withCredentials: false into httpLink.create does not appear to be respected #1940

Closed jacksonopp closed 1 year ago

jacksonopp commented 1 year ago

Describe the bug

I am attempting to connect to contentfuls graphql api, which always returns 'Access-Control-Allow-Origin': '*'. If credentials are specified, then the preflight check will fail due to a cors issue:

Access to XMLHttpRequest at 'https://graphql.contentful.com/content/v1/spaces/{space hidden for security}/environments/{environment}' from origin 'http://localhost:4500' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: The value of the 'Access-Control-Allow-Origin' header in the response must not be the wildcard '*' when the request's credentials mode is 'include'. The credentials mode of requests initiated by the XMLHttpRequest is controlled by the withCredentials attribute.

I am creating the apollo client as follows.

/* graphql.module.ts */

const uri = "my-graphql-endpoint"; // <-- add the URL of the GraphQL server here
const headers = new HttpHeaders({
  Authorization: "Bearer asdlfkjaskldf" // <-- This is required for contentful specifically,
});
export function createApollo(httpLink: HttpLink): ApolloClientOptions<any> {
  return {
    link: httpLink.create({ 
      uri,
      headers,
      withCredentials: false
     }),
    cache: new InMemoryCache()
  };
}

I should not be seeing the cors issue, since I have set withCredentials to false, however i am seeing the cors issue.

To Reproduce

Steps to reproduce the behavior:

  1. Install apollo-angular via the angular cli (per the docs)
  2. Inside your graphql.module.ts, set up your URL to point to a cross-origin domain which will return 'Access-Control-Allow-Origin': '*' in the header.
  3. Make a query somewhere
  4. Observe in the console, a cors error

Expected behavior

We should not see the cors error for endpoints where 'Access-Control-Allow-Origin': '*' is set.

Environment:

MacOS (Apple m1 pro)

├── @angular/cli@14.2.10
├── @angular/core@14.2.12
├── @apollo/client@3.7.9
├── apollo-angular@4.2.1
├── graphql@16.6.0
└── typescript@4.6.4
- @angular/cli@XX.YY.ZZ
- @angular/core@XX.YY.ZZ
- @apollo/client@XX.YY.ZZ
- apollo-angular@XX.YY.ZZ
- graphql@XX.YY.ZZ
- typescript@XX.YY.ZZ

Additional context

jacksonopp commented 1 year ago

There was an HTTP inteceptor that was causing this issue. Closing as not planned