리액트 카카오 소셜 로그인 인가 인증까지 하기

리액트 카카오 소셜 로그인 인가 인증까지 하기

는 업데이트가 중단된 djangorestauth를 잇는 프로젝트입니다. 기능으로는 DRF를 베이스로 인증과 연관된 기능들을 간단하게 제대기오염 주고, djangoallauth와 함께 사용하여 소셜 로그인OAuth 로그인과 이메일 인증등의 기능도 탑재되어 있습니다. 또한 djangorestframeworksimplejwt등과 함께 사용하여 JWT기능도 도와주고 있습니다. djrestauth가 기본적으로 제공하는 기능은 DRF에 맞춰 REST API로 인증기능을 지요구하는 것입니다.

DRF는 기본적으로 따로 간단한게 제공하는 유저 인증기능은 따로 없어서 하나하나 제작해야 했습니다. djrestauth는 처음 일반적인 로그인 등의 기능에 관련해서 URL만 설정해 주면 사용 가능하게 해 줍니다.

이메일만 사용

이 경우는 소셜 로그인의 대부분의 기능을 사용하지 않고, 오직 이메일만 로그인 시에 활용하는 방법입니다. 작동 방식은 유저 필드에 이메일을 필드를 하나 추가하고, 매 소셜 로그인 시에 이메일 값만 받아와서 그 즉시 인증하고, 다른 소셜 데이터는 따로 저장하거나 사용하지 않는 방식입니다. 이 경우 소셜 로그인에 에 대해 저장하는 것이 없기에, 해당 아이디가 어느 소셜 OTT와 연결되었는지 알 수 없고실제로 연결이 안 돼있는 것과 마찬가지 이기도 하고, 플랫폼에서 이메일 인증절차를 제대로 걸치지 않는다면, 보안적으로도 상당한 문제가 있는 방식입니다.

이메일을 속이는 것 만으로 로그인 인증이 가능하니 말이죠. 다만 이메일만 저장하니, DB 구성자체는 쉽고, 다중 소셜 로그인도 구현하기 아주 편한 방식입니다.

인증 토큰 받기

curl v X POST httpskauth.kakao.comoauthtoken H ContentType applicationxwwwformurlencoded d granttypeauthorizationcode d clientidRESTAPIKEY dataurlencode redirecturiREDIRECTURI d codeAUTHORIZECODE

카카오에서 제공하는 API입니다. Axios로 비동기 처리를 했는데 삽질을 좀했습니다.

헤더에 ContentType 설정을 했었는데 이게 문제가 되었습니다. 헤더로 아무런값을 보내면 안됐었습니다. 그래서 카카오로그인 인스턴스를 따로만들었습니다. 잘 넘어 옵니다. 이제 accesstoken을 이용하여 회원정보를 얻어옵니다.

카카오 인증 서버에 인가 코드 요청

인가Authorization

인가란 어떤 개체가 특정 리양념에 접근할 수 있는지 혹은 어떤 동작을 수행할 수 있는지를 정밀 연구하는 것입니다. 카카오 로그인 과정 중 인가는 사용자가 카카오 계정 인증 성공 시 동의 화면을 통해 카카오가 서비스에 자원 접근 권한을 제공해도 될지 사용자의 동의를 구출하는 과정입니다. Code

GET oauthauthorize?clientidRESTAPIKEYredirecturiREDIRECTURIresponsetypecode HTTP1.1Host kauth.kakao.com

위의 코드와 같이 인가를 요청합니다.

추가적인 테이블 작성

이 방식은 추가적인 소셜 로그인 정보 관리용 테이블을 만들고 이를 11 혹은 1N으로 연결하는 방식입니다. 이때 1N으로 연결할 시에는 다중 소셜 로그인을 구현할 수 있습니다. 유저와 연결되는 소셜 로그인 관리용 테이블은 platformtype, platformid 등의 정보 등을 가지는 것으로 구현할 수 있습니다. 혹은 이경우에도 이메일을 구별 수단으로 사용할 수 있습니다. 또한 인증 관련 정보뿐만이 아닌, 각 소셜 플랫폼에서 나오는 정보들을 위해 확장하기도 편합니다.

zwj 애플 소셜로그인 탈퇴 구현

자 이제 어느정도 종합적인 구조는 파악했으니 이제 구현기로 넘어가겠습니다. 저번 푸시알림과 비슷하게 저는 서버측 구현만 다루도록 하겠습니다. 위 로직 순서를 보시면 서버가 구현해야할 부분은 3,4,5번으로 클라이언트한테 정상적으로 authorizationCode를 받았다는 가정으로 진행하겠습니다.

이번 애플 소셜로그인 탈퇴를 구현하며 가장 힘들었던 점은 import 과정입니다.

다들 이게 왜 힘드냐고 여쭤보실 수 있지만 대부분의 레퍼런스에서 buildgradle에 어떤 라이브러리를 넣어야하는지 안가르쳐줘서 한참을 해맸습니다 . 결국 해결을 못해 stackOverFlow에 인도인 형님들과 긴 대화를 나눈 경험도 있습니다.

애플 소셜로그인 탈퇴 후기

앱 스토어에 제출하고 승인받으려면 정말 많은 노력을 해야함을 최근 동안 이해하고 있습니다. 하나부터 열까지 애플은 정말 깐깐하게 보는 느낌인데 저희 편은 iOS 어플을 주력으로 타겟킹하고 있기에 개발팀에서 조금 더 노력해야하는 것이 사실입니다. 오늘은 2주정도 전에 구현했던 애플 소셜로그인 탈퇴를 정리해봤습니다.

자주 묻는 질문