본문 바로가기

개발

[SNS 로그인] 카카오 회원가입/로그인 API

728x90

 

 

카카오 개발자 센터 ( https://developers.kakao.com )

 

Kakao Developers

카카오 API를 활용하여 다양한 어플리케이션을 개발해보세요. 카카오 로그인, 메시지 보내기, 친구 API, 인공지능 API 등을 제공합니다.

developers.kakao.com

 

1. javascript SDK 등록 - kakao.min.js ( https://developers.kakao.com/docs/latest/ko/sdk-download/js )

<script type="text/javascript" src="https://developers.kakao.com/sdk/js/kakao.min.js"></script>

 

2. 카카오 로그인 ( https://developers.kakao.com/docs/latest/ko/kakaologin/js )

//login.jsp
<a id="kakao-login-btn"></a>

//kakao.js(로그인)
Kakao.init('앱키(javascript)');
Kakao.isInitialized();

console.log("Kakao.isInitialized()", Kakao.isInitialized());

Kakao.Auth.createLoginButton({
	container: '#kakao-login-btn',
	success: function(response) {
		console.log("success", response);
	},
	fail: function(error) {
		console.log("fail", error);
	},
});

 

3. 사용자 정보 요청 ( https://developers.kakao.com/docs/latest/ko/user-mgmt/js )

Kakao.API.request({
	url: '/v2/user/me',
	success: function(response) {
		var userID = response.id;
		var useEmail = response.kakao_account.email;
		var useNickName = response.properties.nickname;
				
		console.log("userID", userID);
		console.log("useEmail", useEmail);
		console.log("useNickName", useNickName);
	},
	fail: function(error) {
		console.log("fail", error);
	}
});

 

4. 로그인 + 사용자 정보 요청

Kakao.init('앱키(javascript)');
Kakao.isInitialized();

console.log("Kakao.isInitialized()", Kakao.isInitialized());

Kakao.Auth.createLoginButton({
	container: '#kakao-login-btn',
	success: function(response) {
		Kakao.API.request({
			url: '/v2/user/me',
			success: function(response) {
				var userID = response.id;
				var useEmail = response.kakao_account.email;
				var useNickName = response.properties.nickname;
				
				console.log("userID", userID);
				console.log("useEmail", useEmail);
				console.log("useNickName", useNickName);
				
			},
			fail: function(error) {
				console.log("request fail", error);
			}
		});
		
	},
	fail: function(error) {
		console.log("fail", error);
	},
});

 

728x90
반응형