[Passportjs][Angular5] No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'null' is therefore not allowed access

问题

I am trying to integrate Nodejs backend api with Angular. I have implemented passpor-google, passport-github, passport-twitter strategy on the backend application.

My backend App url is http://localhost:3000 My Frontend App url is http://localhost:4200

Passport Routes

authRouter.get('/github', passport.authenticate('github'));
authRouter.get(
  '/github/callback',
  passport.authenticate('github', {
    failureRedirect: 'http://localhost:4200/login',
  }),
  authController.sendJWTToken
);

When i send request from the frontend app it gives me CORS error

AuthService.ts

githubAuth(): Observable<LoginRsp> {
    return this.httpClient.get<LoginRsp>(
      `${environment.api_url}/auth/github`
    );
  }

I have already added CORS on my Nodejs project. How can I resolve this issue please help me

回答1:

use cors module cors or else use express cors middleware express cors

app.use(cors()); after this any other routes

const users = require('./routes/users');

or try moving cors middleware to top

回答2:

You could do it like in the image below

回答3:

In AuthService.ts just use window.location.href='{environment.api_url}/auth/github'

来源：https://stackoverflow.com/questions/50317575/passportjsangular5-no-access-control-allow-origin-header-is-present-on-the