Node.js | Passport.js (passport - kakao)

React(frontend) - Node.js(backend) - MySQL(DB) 연동 플젝임

1. KakaoDevelopers 사이트에 앱 등록 및 설정

 

계정이 없다면 가입 후 앱을 등록하세요.

Kakao Developers_

 

 

설정 - 사용자관리 - ON

 

설정 - 일반 - 플랫폼 등록

 

 

2. npm을 이용해 passport-kakao설치하기

 

$ npm install passport-kakao

 

 

3. 사용을 위한 준비 (config)

 

설정 - 일반 - 기본정보 - 앱 키에서 REST API키를 복사한 후,

 

clientID항목에 넣어줍니다.

clientSecret은 kakao strategy에 사용되지 않으므로 항목을 삭제하거나 빈 스트링을 넘겨주세요.

 

callbackURL은 기본적으로 /oauth값을 사용합니다.

var passport = require('passport'),
    KakaoStrategy = require('passport-kakao').Strategy;
    
passport.use(new KakaoStrategy({
    clientID : clientID,
    clientSecret: clientSecret, // clientSecret을 사용하지 않는다면 넘기지 말거나 빈 스트링을 넘길 것
    callbackURL : callbackURL
  },
  function(accessToken, refreshToken, profile, done){
    // 사용자의 정보는 profile에 들어있다.

  }
));

 

 

만약 callbackURL을 변경하고싶다면, kakaoDevelopers에서 수정해주어야 합니다.

설정 - 사용자관리 - 로그인 Redirect URI에서 등록해주세요.

 

 

기본적으로 kakao로부터 받아오는 정보는 프로필 정보입니다. (닉네임과 프로필사진)

만약 부가적인 정보를 받아오길 원하다면 설정이 필요합니다.

저는 이메일 정보를 받아올 수 있도록 설정해주었습니다.

 

 

 

4. route설정

 

'/login/kakao'경로로 들어오면 passport.authenticate가 실행되며 카카오계정을 사용하기 위한 동의 창이 생성됩니다. 동의하고 나면 'login/kakao/callback'(기본 callbackURL이 아닙니다. 위에서 수정해주었기 때문에 사용할 수 있는 것입니다.)경로로 들어오며 user정보를 얻을 수 있습니다. 이 때 세션에 user정보가 저장됩니다.

router.get('/login/kakao', passport.authenticate('kakao'));

router.get('/login/kakao/callback', function (req, res, next) {
  passport.authenticate('kakao', function (err, user) {
    console.log('passport.authenticate(kakao)실행');
    if (!user) { return res.redirect('http://localhost:3000/login'); }
    req.logIn(user, function (err) { 
       console.log('kakao/callback user : ', user);
       return res.redirect('http://localhost:3000/');        
    });
  })(req, res);
});

 

 

+) 참고

passport-kakao