카카오 아이디로 로그인

소셜(카카오, 구글, 네이버 등) 아이디로 로그인 하는 방법

이미 예전에 홈페이지를 만들 때 사용해 봐서 방법을 알 것 같았는데 지금에 와서

해 보니 역시나 헤매고 말았다.

그 당시에 나중을 위해 기록하는 방법을 왜 생각 못했었는지 바보같은 아쉬움에 

언제가 될 지는 모르지만 미래를 위해 혹은 본인처럼 소셜 로그인 방법을 모르시는

분들을 위해 기록해 둔다.

그 첫번째인 카카오다.

---

카카오 아이디로 로그인

★ 카카오 개발자 센터(kakao Developers) 바로가기 클릭!! ★

   1. 메뉴 클릭 : 개발가이드 자바스크립트 개발가이드 카카오 로그인 

▶ 첫 화면에서 [개발가이드]를 클릭해 [JavaScript 개발가이드]로 들어가 [카카오로그인]

선택하거나 왼쪽 제일 처음 [카카오계정 로그인] 클릭 후

▶ [JavaScript] 클릭하면 [JavaScript 개발가이드 - 카카오 로그인] 이 자동 선택된다.

 

▶ 카카오 로그인 선택하면 된다.

   2. 앱 만들기.

▶ 예제:로그인버튼추가 아래 [앱 등록]을 클릭한 후

▶ [앱 만들기] 클릭.

▶ 내 애플리케이션 - 앱 만들기에서 아이콘은 업로드해도 되지만 그대로 사용하고 

앱 이름(뭐 사이트명이라든지...)을 적어 준 후 [앱 만들기] 클릭.

아이콘 변경 안 할거냐고 물어보지만 그냥 진행하면 앱 만들기는 끝이다.

   3. 웹 플랫폼 추가.

▶ 앱을 만들면 위 이미지처럼 네 개의 키를 주는 데 카카오 아이디로 로그인에 사용 할 키는

[REST API 키]이다. 일단 여기서 개발자 가이드 아래 [설정]을 클릭하거나...

▶ 좌측 [일반] 메뉴를 클릭하면 위와 같은 화면이 나오고 [?] 를 클릭하면 각각 키의 용도를

알 수 있다. 중간 플랫폼에서 [플랫폼 추가]를 클릭한 후...

▶ [웹]에 체크 후 사이트 도메인을 적어 준 후 [추가]버튼 클릭!! 클릭!! 클릭!!

이상하다~~

클릭이 안되서 Enter키를 툭 치니 등록이 된다. 오류인가~~~!!

   4. 내 홈페이지 소셜 로그인 부분 등록.

  

▶ 카카오 아이디로 로그인을 이용할 사이트에 관리자로 들어가 소셜로그인 모듈에서

[KaKao API] 부분의 [Client ID] 빈칸에 [REST API 키]를 붙혀넣고 [Redirect Path] 키를

복사해서...

▶ 아까 등록한 웹 사이트를 클릭하면 위 이미지처럼 [Redirect Path] 부분에 붙혀넣어 준다.

이걸로 일단 웹 사이트 카카오 아이디 로그인 부분은 끝이다.

   5. 안드로이드(Android) 앱 플랫폼 추가.

▶ 본인은 안드로이드 앱까지도 등록해서 카카오 아이디로 로그인이 가능하게 만들었다.

[플랫폼 추가]에서 [Android] 체크 후 [패키지명]을 적어주면 자동으로 [마켓 URL]이 기재된다.

그리고 다시 등록된 Android 플랫폼을 클릭하면...

▶ 위 이미지처럼 [키해시]를 적어줘야 하는데 이건 일단 구글링 해 보면 여러방법이 나온다.

이 키 해시를 찾는 방법은 조금 복잡하므로 나중에 리뷰할 것이다. 일단은 구글로...

이걸로 안드로이드 앱 등록도 끝이다.

   6. 사용자 관리 

▶ 왼쪽 [사용자 관리] 메뉴 클릭 후 OFF에서 ON 으로 활성화 후...

▶ 동의항목을 작성해 주고 저장하면 카카오 아이디로 로그인은 끝이다.

★ 카카오 아이디로 로그인 링크 주기 (CONORY 소셜XE)★

http://사이트 주소//?act=dispSocialxeConnectSns&type=login&service=kakao

 

---

이상으로 소셜 로그인 방법에 대해서 리뷰는 끝입니다.

오늘 하루도 행복하세요.