웹솔루션개발 22년 노하우! 해피CGI의 모든것

[해피CGI][cgimall] 카카오 로그인 본문

웹프로그램밍 자료실/기타 자료

[해피CGI][cgimall] 카카오 로그인

해피CGI윤실장 2017. 3. 31. 09:21
최근 많은 사이트에서 로그인시 SNS 계정으로 로그인이 구현되어 있습니다.

많은 분들이 아시겠지만 카카오에서도 동일하게 카카오계정으로 웹사이트에서 로그인을 구현할수있는 API를 제공합니다.

처음 카카오API를 접하시는 분들을 위하여 이렇게 글을 적어봅니다.

1. https://developers.kakao.com/apps 
   페이지에 로그인후 접속을 합니다.

   해당 페이지에서 "앱만들기" 버튼을 클릭하여 앱생성 페이지로 이동을 합니다.

   




2. 앱생성이 완료가 되면 아래 이미지처럼 "앱 키" 발행이 됩니다.
    여기서 소개 해드리는 API는 JavaScript API 로 연동하는 방법에 해당하므로,
    JavaScript 키를 추후 이용 하시면 됩니다.

     

    앱키 발행 아래쪽에는 "플랫폼 추가" 버튼이 있습니다.
    해당 버튼을 클릭하여 "웹" 플랫폼을 추가 하고 도메인을 입력 합니다.

   

3. https://developers.kakao.com/docs/js#카카오-로그인
   위 페이지에 설명이 되어 있는 소스를 실제 웹페이지에 적용을 합니다.


4. 위와같이 원하시는 페이지에 소스를 추가하셨다면 해당 페이지 접근시 아래와같이 카카오계정으로 로그인할수있는 버튼이
    생성되며 로그인 버튼클릭시 팝업창으로 카카오계정으로 로그인하실수있습니다.
    로그인해보시면 리턴받은 access_token 값으로 프로필정보를 조회할수있는 권한이 생깁니다.

  

5. 첨부파일의 예제를 참고하셔서 해당 acess_token값으로 직접 프로필의 닉네임과 사진을 가져오는 방법을 확인하실수있습니다.
    구글에 검색하니 깔끔하게 만들어놓은 소스가 있어 이렇게 첨부해드립니다^^
    (출처 : https://gist.github.com/kwangheum/6f9c98d81dcff59f61eb#file-kakaotalk-html)

 

홈페이지바로가기 

Comments