Nest.js Вход в систему Google(passport.js) с интерфейсом SPA(реагировать)

#reactjs #authentication #passport.js #nestjs #passport-google-oauth

Вопрос:

В моем проекте с полным стеком(Nest.js Реагировать), я реализовал вход в Google с помощью passport-google, как показано ниже.

 import { Controller, Get, Req, UseGuards } from '@nestjs/common';
import { AppService } from './app.service';
import { AuthGuard } from '@nestjs/passport';

@Controller('auth')
export class AuthController {
    constructor(
        private authService: AuthService,
    ) {}

    ...

    @Get('google')
    @UseGuards(GoogleAuthGuard)
    async googleAuth(@Req() req) {}
  
    @Get('google/callback')
    @UseGuards(GoogleAuthGuard)
    async googleAuthRedirect(@Req() req) {
        return this.authService.socialLogin(req);
    }
}

 

Когда я получу доступ к http://localhost:3000/auth/google в браузере Chrome все процессы, включая вход в систему и регистрацию новых пользователей, работают хорошо.

Но в интерфейсном проекте(React) приведенный ниже код не работает.

 axios.get('http://localhost:3000/auth/google')
 

Поэтому я попытался использовать «react-google-login», как показано ниже:

 <GoogleLogin 
    clientId={GOOGLE_OAUTH.GOOGLE_CLIENT_ID}
    buttonText="Log In with Google Account"
    onSuccess={result => onGoogleLogin(result)}
    onFailure={result => console.log(result)}
    cookiePolicy={'single_host_origin'}
/>
 

но я не мог понять поток входа в Google на интерфейсе и бэкэнде и не знаю, как реализовать функцию «onGoogleLogin».

Как я могу это исправить?