반응형
https://developers.kakao.com/console/app
카카오계정
accounts.kakao.com
1. 카카오 개발자 접속
2. 애플리케이션 추가
3. 카카오로그인 url 등록
4. 플랫폼 등록
5. 코드 작성
<script src="https://t1.kakaocdn.net/kakao_js_sdk/2.1.0/kakao.min.js" integrity="sha384-dpu02ieKC6NUeKFoGMOKz6102CLEWi9+5RQjWSV0ikYSFFd8M3Wp2reIcquJOemx" crossorigin="anonymous"></script>
<script src="https://developers.kakao.com/sdk/js/kakao.js"></script>
<script>
Kakao.init({JavaScript KEY}); // 사용하려는 앱의 JavaScript 키 입력
</script>
<body>
<a href="javascript:loginWithKakao()">카카오 인증</a>
<a href="javascript:login()">카카오 로그인</a>
<script>
Kakao.isInitialized();
function loginWithKakao() {
Kakao.Auth.authorize({
redirectUri: '{redirectUrl}',
});
}
function login(){
const urlParams = new URL(location.href).searchParams;
const code = urlParams.get('code');
$.ajax({
url: `https://kauth.kakao.com/oauth/token?grant_type=authorization_code&client_id={REST API KEY}&redirect_uri={redirectUrl}&code=${code}`,
method: 'post',
success: function (data, status, xhr) {
Kakao.Auth.setAccessToken(data.access_token);
Kakao.Auth.login({
success: function (res){
Kakao.API.request({
url: '/v2/user/me',
}).then(function(res) {
alert(JSON.stringify(res));
}).catch(function(err) {
alert('실패 '+JSON.stringify(err))
});
}
})
}
});
}
</script>
</body>
반응형