角度和护照谷歌身份验证

如何解决角度和护照谷歌身份验证

我第一次使用passport.js，我尝试使用谷歌策略passport-google-oauth2创建登录，到目前为止我的节点代码如下所示：

passport.config

import passport,{ Profile } from 'passport';
import { Strategy } from 'passport-google-oauth2';

const googleStrategy = new Strategy(
  {
    clientID: process.env.GOOGLE_CLIENT_ID,clientSecret: process.env.GOOGLE_CLIENT_SECRET,callbackURL: '/api/v1/auth/google/callback',passReqToCallback: true,},(
    request: any,accesstoken: any,refreshToken: any,profile: Profile,done: any
  ) => {
    console.log(accesstoken);
    done(null,profile);
  }
);

passport.serializeUser((user,done) => {
  done(null,user);
});

passport.deserializeUser((user,user);
});

passport.use(googleStrategy);

auth.route

router.get(
  '/google',passport.authenticate('google',{
    session: false,scope: ['email','profile'],})
);

router.get('/google/callback',(req,res,next) => {
  passport.authenticate('google',(err,profile,info) => {
    if (err) {
      next(err);
      return;
    }
    if (!profile) {
      res.status(500);
      const error = new Error('Internal Server Error');
      next(error);
      return;
    }
    var responseHTML = '<html><head><title>Main</title></head><body></body><script>res = %value%; window.opener.postMessage(res,"*");window.close();</script></html>'
    responseHTML = responseHTML.replace('%value%',JSON.stringify({
    user: req.user
    }));
    res.status(200).send(responseHTML);
  })(req,next);
});

到目前为止，一切都很好，在我的 Angular 应用程序的客户端，我打开了用于节点 api 的窗口以重定向到 google auth，这样：

角度身份验证服务

loggingWithGoogle(): void {
    const popup = window.open(
      'http://localhost:3000/api/v1/auth/google','mywindow','location=1,status=1,scrollbars=1,width=800,height=800'
    );
    const listener = popup?.addEventListener('message',(message) => {
      console.log(message);
    });
    // return this.http.get(`${this.BASE_URL}/auth/google`);
  }

此时，一个新窗口打开，我可以登录谷歌帐户，登录后窗口应该关闭，我应该在我的 angular 应用程序上获取数据，但窗口永远不会关闭，我收到此错误控制台 Refused to execute inline script because it violates the following Content Security Policy directive: "script-src 'self'" 中的消息。登录后如何获取数据。

角度和护照谷歌身份验证

如何解决角度和护照谷歌身份验证

相关推荐