Search code examples
node.jsangularexpresscorssession-cookies

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'.-

I am trying to connect my angular app with nodejs with graphql api and I'm using cookies/sessions for auth.

The api works perfectly with GraphQL PLayground. This is my angular connection to connect with graphql api.

const uri = "http://localhost:4000/graphql/"; // <-- add the URL of the GraphQL server here

export function createApollo(httpLink: HttpLink): ApolloClientOptions<any> {
  return {
    link: httpLink.create({ uri, withCredentials: true }),
    cache: new InMemoryCache(),
  };
}

The connection is made if I set withCredentials:false but I can't use cookies for auth anymore.

This is my code on the cors middleware.

    const corsOptions = {
      credentials: true,
      origin: "http://localhost:4200",
    };
    app.use(cors(corsOptions));

I've tried the following code snippets in an effort to make this work but none worked.

  app.use(function (req, res, next) {
      res.header("Access-Control-Allow-Origin", "http://localhost:4200");
      res.header(
        "Access-Control-Allow-Headers",
        "Origin, X-Requested-With, Content-Type, Accept",
      );
      res.header("Access-Control-Allow-Credentials", "true");
      next();
    });

    const corsOptions = {
      credentials: true,
      origin: true,
    };
    app.use(cors(corsOptions));

This is the exact error that is being displayed. This is the exact error

I've tried all solutions from the question link below.
Related Questions:

... and similar posts but none have solved this issue.

Solution

  • You have to set apolloServer.applyMiddleware({ app, cors: false }); while creating server or else it will seem as there are two cors blockers in the app and either one of them will throw any clients trying to connect,