[Passportjs] [Angular5]所请求的资源上没有"Access-Control-Allow-Origin"标头.因此，不允许访问原始“空" [英] [Passportjs][Angular5] No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'null' is therefore not allowed access

问题描述

我正在尝试将Nodejs后端api与Angular集成.我已经在后端应用程序上实现了passpor-google，passport-github，passport-twitter策略.

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

我的后端应用程序URL是http://localhost:3000 我的前端应用程序的网址是http://localhost:4200

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

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

当我从前端应用程序发送请求时，它给了我CORS错误

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

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

我已经在我的Nodejs项目中添加了CORS.我该如何解决此问题，请帮助我

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

推荐答案

您只需在HTML模板中编写

You can simply write in your html template

<a href="http://localhost:3000/login/google">Google</a>

在后端，您只需要拥有

app.get('/login/google',  passport.authenticate('google', { scope: ['profile','email']}) );

这篇关于[Passportjs] [Angular5]所请求的资源上没有"Access-Control-Allow-Origin"标头.因此，不允许访问原始“空"的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！