소셜 로그인

pnpm add @nestjs/passport passport

pnpm add passport-google-oauth20 passport-kakao passport-naver passport-apple

pnpm add -D @types/passport-google-oauth20 @types/passport-kakao @types/passport-naver @types/passport-apple

 

 

- auth.module.ts

import { Module } from '@nestjs/common';
import { AuthService } from './auth.service';
import { AuthController } from './auth.controller';
import { JwtGoogleStrategy } from 'src/commons/auth/jwt-social-google.strategy';
import { JwtNaverStrategy } from 'src/commons/auth/jwt-social-naver.strategy';
import { JwtKakaoStrategy } from 'src/commons/auth/jwt-social-kakao.strategy';

@Module({
  imports: [],
  providers: [
    AuthService, //
    JwtGoogleStrategy,
    JwtKakaoStrategy,
    JwtNaverStrategy,
  ],
  controllers: [
    AuthController, //
  ],
})
export class AuthModule {}

 

- auth.controller.ts

import { Controller, Get, Req, Res, UseGuards } from '@nestjs/common';
import { AuthService } from './auth.service';
import { DynamicAuthGuard } from './guards/dynamic-auth.guard';

interface IOAuthUser {
  user: {
    id: string;
    provider: string;
  };
}

@Controller()
export class AuthController {
  constructor(private readonly authService: AuthService) {}

  @Get('signup/:social')
  @UseGuards(DynamicAuthGuard)
  SignUpGoogle(
    @Req() req: Request & IOAuthUser, //
    @Res() res: Response,
  ) {
    console.log(req.user);
  }
}

 

- AuthGuard 변형

import { CanActivate, ExecutionContext } from '@nestjs/common';
import { AuthGuard } from '@nestjs/passport';

// const DYNAMISC_AUTH_GUARD = {
//   google: new (class extends AuthGuard('google') {})(),
//   kakao: new (class extends AuthGuard('kakao') {})(),
//   naver: new (class extends AuthGuard('naver') {})(),
// };

const DYNAMISC_AUTH_GUARD = ['google', 'kakao', 'naver'].reduce(
  (prev, curr) => {
    return { ...prev, [curr]: new (class extends AuthGuard(curr) {})() };
  },
  {},
);

export class DynamicAuthGuard implements CanActivate {
  canActivate(context: ExecutionContext) {
    const { social } = context.switchToHttp().getRequest().params;
    return DYNAMISC_AUTH_GUARD[social].canActivate(context);
  }
}

 

- 전략 구글

현재 카카오랑 네이버는 이메일주소를 주지 않음.

때문에 각 소셜에 등록된 이메일의 고유 아이디번호랑 소셜(provider)로 구분했음.

import { PassportStrategy } from '@nestjs/passport';
import { Profile, Strategy } from 'passport-google-oauth20';

export class JwtGoogleStrategy extends PassportStrategy(Strategy, 'google') {
  constructor() {
    super({
      clientID: process.env.SOCIAL_GOOGLE_ID,
      clientSecret: process.env.SOCIAL_GOOGLE_SECRET,
      callbackURL: `${process.env.SOCIAL_CALLBACK_URL}/google`,
      scope: ['email'],
    });
  }

  validate(accessToken: string, refreshToken: string, profile: Profile) {
    // console.log(profile);

    return {
      id: profile.id,
      provider: profile.provider,
    };
  }
}

 

- passport랑 각 소셜 passport 설치해야함

 

 

 

- 각 소셜 로그인 설정

https://console.cloud.google.com/projectselector2/apis/dashboard?hl=ko&organizationId=0&supportedpurview=project

https://developers.kakao.com/

https://developers.naver.com/main/