API/Kakao 카카오
SNS 로그인 기능 구현 하기 카카오 (JSP, javascript)
KIMSG
2017. 7. 20. 15:31
카카오톡 로그인에 대해서 크게 생각을 해보진 않았지만 언젠가는 꼭 써야할 날이 오고야만 마는 그 날을 위해서.
SNS로그인 기능을 사용하려면 우선
OAuth에 대해서 알아야 한다.
요약 : 내정보를 다른 곳에서도 쓸 수 있게 인증해주는 것이다.
카카오톡 이외에도 구글, 페이스북, 네이버, 트위터 기타 등등이 있다.
앱을 만든다. (한글 문서라서 어려운 부분이 없다. 최고다.)
아이콘, 이름도 다 설정할 수 있다.
이후에 다시 키를 확인할 수 있으니 개발가이드로 바로 넘어가도 된다.
사용자관리 > 원하는 방식으로 들어가면 된다. (JavaScript)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
|
<script src="//developers.kakao.com/sdk/js/kakao.min.js"></script>
<a id="kakao-login-btn"></a>
<a href="http://developers.kakao.com/logout"></a>
<!-- Kakao Login -->
<script type="text/javascript">
// 사용할 앱의 JavaScript 키를 설정해 주세요.
Kakao.init('키입력');
// 카카오 로그인 버튼을 생성합니다.
Kakao.Auth.createLoginButton({
container: '#kakao-login-btn',
success: function(authObj) {
// 로그인 성공시, API를 호출합니다.
Kakao.API.request({
url: '/v1/user/me',
success: function(res) {
console.log(JSON.stringify(res.kaccount_email));
console.log(JSON.stringify(res.id));
console.log(JSON.stringify(res.properties.profile_image));
console.log(JSON.stringify(res.properties.nickname));
},
fail: function(error) {
alert(JSON.stringify(error));
}
});
},
fail: function(err) {
alert(JSON.stringify(err));
}
});
</script>
|
cs |
이렇게 소스를 그대로 사용을 했지만 사용자의 정보를 가져올 수 없다면 설정을 수정한다.
사용자 관리를 활성화 시키면 가져올 수 있는 데이터나 항목을 선택할 수 있고
그에따른 설정도 선택할 수 있다.
지금까지 사용한 카카오API의 기능은 Auth라는 것이었고
또한, 위에 적힌 데이터 예시 이외의 가져올 수 있는 데이터는 아래의 링크에서 확인할 수 있다.