03. 카카오 로그인 코드 짜보기

일단 나에게 메시지를 보내려면.

1. 카카오 로그인 api를 이용해 인가코드를 발급한다

2. 발급한 인가코드를 사용해 사용자 토큰을 발급한다

3. 사용자 토큰을 사용해 메시지를 보낸다

 

AWS EC2위에서 코드를 짜보았다. AWS위에 올렸기 때문에 redirect url, web 플랫폼의 도메인을 내 aws ip로 수정했다.

 

내가 구상해서 짠 코드의 로직은

http://[aws ip]/code url 로 들어가면 인가코드 받는 url로 redirect 된다(res.redirect) -> 카카오 로그인 화면이 나타나면 로그인한다 -> 로그인 후 받은 인가코드로 토큰을 요청한다(axios) -> 받은 토큰을 저장한다

 

문제는 이렇게 코드를 짰는데, 개발자도구에서 확인해보니 첫번째의 redirect에서 요청하는 url에 나의 rest api key가 노출된다.(redirect url이 https://kauth.kakao.com/oauth/authorize?response_type=code&client_id=${restapi_key}&redirect_uri=${redirect} 이기 때문에)

나의 key가 노출되면 안되기때문에 다시 서치해본 결과 passport를 사용하면 바로 사용자 토큰을 받을 수 있다...

 

한번에 성공할 것이라 생각했지만,, 다시 passport를 사용해 사용자 토큰을 받고, 크롤링하는 것 까지 내일 해봐야 겠다.

그래도 오늘 짠 코드를 설명해보면..

 

app.js

router.js

/로가면 main페이지이다

/code로 가면 인가코드를 받는 url로 redirect 된다

/result/:result 인가코드를 받은 후 token 발급에 성공하면(로그인에 성공하면) /result/sucess, 발급에 실패하면 /result/failed 이다.

 

controller.js

* main : 먼저 메인페이지로 가면 req.query.code가 있을 때(if) / 없을 때(else)로 나뉜다.

if문은 나중에 설명하고, 처음에 main으로 접속하게 되면, {'msg' : `ICE ALERT MAIN PAGE`} 이런 json이 화면에 띄워진다.

 

* codeAPI : /code로 접속하면 인가코드를 받는 url로 redirect된다. try안의 url이 인가코드를 받는 url이다(kakao developers 공식문서에 나와있다. restapi_key, redirect는 따로 config폴더에 저장해두고, .gitignore를 적용시켜 놓아 import해서 사용했다)

/code로 접속하게 될 시에 redirect후 인가코드가 발급되면 http://[aws ip]:3000/?code={인가코드} 이런 url로 redirec가 된다(redirect로 설정한 url이 http://[aws ip]:3000/ 이기 때문에. 그래서 인가코드를 url에서 가져오려면 main에서 처리해준다

 

* main의 if문 : ?code={인가코드} 부분에서 인가코드를 가져오려면 req.query.code를 사용해야한다(?code 이므로 .code) 따라서 main문이 처음 접속시 main 페이지와 인가코드를 받은 후 메인페이지 두개가 존재하는 것이다. const code로 발급한 인가코드를 저장하고, axios로 토큰을 발급하는 url로 post를 보낸다. token이 오면 result=success. 중간에 에러발생시엔 result=failed가 된다.

이후 http://[aws ip]:3000/result/${result}로 redirect가 된다(성공시엔 http://[aws ip]:3000/result/success)

 

* result : 토큰발급후 main페이지에서 redirect될 때 param(success/failed)을 받아 적절한 페이지로 json을 보낸다. success면 등록이 완료되었습니다, 아니면 등록에 실패했습니다.

 

 

redirect 하는 부분도 있고 별로 마음에 들지않는 코드다. 내일되면 다 갈아엎어야함..

passport를 사용하면 더 깔끔하고 괜찮은 코드가 될 것이라 생각한다.

화이팅!