Express - Github Login - create user

앞서 인증 정보를 받았을때 토큰과 프로필 cb가 있었는데 토큰은 신경안쓰고   githubId & email & name & avartar 이것들이 중요한 정보이다. 현재 _json형태로 담겨있고 그안에서 정보를 추출하자

 

cb는 무엇인가 - cb는 passport에서 제공된 callback함수이다. 그리고 passport에서 이 callback 함수는 

인증이 성공했을 때 호출이 된다.

이때 두가지 옵션이 있는데

한가지는 cb를 호출 할 때 에러 없이, user를 넣어주는 것,  에러가 없다고 하고 user object를 넣고 함수를 호출 하면

passport는 user ID를 쿠키에 넣어주고 사용자 인증방식으로 인증할 때와 똑같은 process가 진행된다.

만약 user object 없이 에러만 넣어서 cb를 호출하면, passport는 사용자를 찾지 못한 것으로 인식한다.

 

userController로 돌아가서 githubLoginCallback 함수를 완성하자

역시 async를 써주고

예외처리 구문으로 작성해준다.

먼저 catch에 에러를 인자로 주고  return 값을 cb()함수로 준다. cb는  error를 인자로 갖는다

머리가 굳었나.. 찬찬히 보니까 이해가 된다 ㅡㅡ;; 그럴만한게 아닌거 같은데 ㅎㅎ;;

github strategy 컨트롤러를 작성해다

먼저 깃헙에서 인증정보를 받아와 매개변수에 넣어준다. 꼭 필요한 매개변수로 accessToken과 refreshToken은 받아서 쓰지 않기 때문에

_, __ 로 처리해줬다. 뭐 써도 되고 안써도 되는게 아니라 정해진 파라미터가 4개인 함수인 것으로 strategy가 짜져있기 때문에

4개는 꼭들어가되 쓸것만 제대로 명명 해주고 그냥 빈파라미터 처리? 해준것 같다. " _ " 의 내용은 아직 정확히 모른다.  차차 알아보자

 

그리고 깃헙 인증정보에서 받아온 인수중 profile 의 id, avartar_url, name, email을 이용한다.

try구문에서 깃헙에서 가져온 정보중 email을 db의 User객체에서 찾아본다.

만약 db에서 같은 이메일이 발견되어서 user가 있다면

user를 업데이트 해준다. 깃헙아이디에 id를 부여해주고 save해준다. 그리고 passport에서 제공한 callback에 error는 null이고, user는 업데이트된 user임을 인자로 넣어준다.

 

만약 email이 db에 없다면! 새로운 유저를 생성해주는데 깃헙 인증정보 중 profile에서 받아온 email, name, githubID, avatar_url을 넣어주고 역시 passport 제공 callback함수 에 error는 null이고 유저는 생성된 newUser를 넣어 주자

 

이제 다시 서버를 재시작해주고 로그인을 진행해주면... 문제가 생겼다... 

토큰 에러가 발생한다. 코드가 잘못되었거나 인증이 만료되었다고 한다...

 

곰곰히 생각해보니. 인증정보를 출력했을때 email이 null로 뜨길래 깃헙에서 기존 private이던 이메일을 public으로 바꿔줬다...

이미 한번 인증정보를 private으로 가져왔었는데 깃헙에서 바꿨으니 안된다..

그냥 db에서 유저정보를 삭제하고 깃헙 Oauth에서 유저 생성된것을 하나 Revoke해줬더니 다시 잘된다.

 

근데 그럼 priavte한 메일을 가진 사람은 가입이 안되는 것인가..

다행히 노마드코더 댓글중에 한분이 이를 해결하신 분이 있어서 그코드를 잠시 빌려와본다.

 

1. passport.js : GithubStrategy 인자 object에 scope:"user:email" 을 추가합니다.
passport.use(
new GithubStrategy(
{
clientID: process.env.GITHUB_CLIENT_ID,
clientSecret: process.env.GITHUB_CLIENT_SECRET,
callbackURL: `http://localhost:4000${routes.githubCallback}`,
scope: "user:email",
},
githubLoginCallback
)
);

2. userController.js : githubLoginCallback 함수 내에서 email 변수를 아래와 같이 설정해줍니다.

const { value: email } = profile.emails.filter((item) => item.primary)[0];

 

const {
_json: { id, avatar_url, name },
} = profile;

const { value: email } = profile.emails.filter((item) => item.primary)[0];

 

-*** 수정사항 *** 

 

기존 postGithubLogin 컨트롤러가 유저 로그인이 되면 res.send()를해줬는데 res.redirect를 해주자..send는 함수에 넣어준 값을 보내주기만 한다..ㅡㅡ;; 잘못썼다.

 

완료!! 이제 페이스북 로그인도 다루고 프로필페이지를 다루자@~!~!~!~! 

그래도 블로그 쓰면서 하니까 다시 이해하기가 편한듯 하다 .. 물론 필자가 보기 편하게 쓴거라 다른사람은 모르겠지만 ㅡㅡ;;