안녕하세요
1)싱크 로그인을 도입 했는데, 제 예상과 다르게 모바일에서 카카오 로그인창이 뜹니다.
제가 설명을 듣기로는 모바일에서 카카오톡을 사용하고 있을 경우, 별도의 로그인창이 뜨지 않고
바로 싱크 회원가입창이 뜨는 것으로 알고 있었습니다.
그런데, 모바일에서 카톡을 사용하고 있는 중인데도 아래와 같이 카카오 로그인창이 뜨는 것일까요?
- 싱크회원가입 동의창에서
카카오스토리 글목록, 글작성을 해제 했습니다.
그런데 아직도 싱크 회원가입창에 [선택] 항목에 반영이 되어 있습니다.
추가로 설정해야 하는 것이 있을까요?
죄송하지만 답변을 잘 이해하지 못했습니다.
저희는 REST API로 로그인을 구현한 상황 입니다.
그런데 첨부한 이미지 처럼 회원가입을 진행하면 카톡 로그인 창이 뜹니다.
고객들이 카톡 아이디/패스워드에 익숙하지 않아 애로 사항이 많이 있습니다.
질문은,
첫째) 카톡 인앱 브라우저에서는 문제 없이 카톡 로그인 없이 바로 싱크 회원가입이 되는건지요?
둘째) 카톡 인앱 브라우저가 아닌 경우, 카톡 로그인 없이 바로 싱크 회원가입이 되도록 하려면 어떻게 해야 하나요?
답변 기다립니다…
@cooltips
REST 방식으로 카카오 로그인을 연동한 경우 말씀하신 것 처럼,
사용자가 직접 카카오 계정을 입력해야 하는 불편함이 있습니다.
이러한 불편함을 개선하고자 최근 REST 방식 로그인연동 시 에도
간편로그인을 사용할 수 있도록 하기위한, JS-SDK를 추가 개발하였습니다.
아직 해당 스펙에 대하여 디벨로퍼스 사이트에 공식 가이드 문서가 준비되지는 않은 상태이지만,
최신 JS-SDK을 사용하여 REST방식 카카오 로그인 방식에도 카톡 간편로그인을 사용하실 수 있습니다.
해당 스펙은, 이미 구현하신 REST 방식의 Backend 로직 변경 없이,
Front 웹 페이지에 ‘카카오로 로그인’ 기능을 카카오 JS-SDK를 사용하는 것 으로 적용 가능합니다.
REST 로그인의 카톡 간편로그인 스펙은, JS-SDK 1.36.5 버전 부터 사용 가능합니다.
좀 더 자세한 내용은 아래와 같습니다.
JS-SDK import 및 초기화
<head>
<script src="//developers.kakao.com/sdk/js/kakao.min.js"></script>
</head>
<script>
Kakao.init('YOUR JS APP KEY');
</script>
사용자 이벤트 발생 시 함수 호출
<a id="custom-login-btn" href="javascript:loginWithKakao()">
<img src="//mud-kage.kakao.com/14/dn/btqbjxsO6vP/KPiGpdnsubSq3a0PHEGUK1/o.jpg" width="300"/>
</a>
<script>
function loginWithKakao() {
Kakao.Auth.authorize({
redirectUri: 'https://www.service.com/kakaoLogin',
state: 'test'
});
}
</script>
[요청 파라미터 정보]
_____________________________________________________________________________
| Key | Type | Description | Required |
=============================================================================
| redirectUri | String | 인증코드를 받을 Redirect URI | O |
| state | String | 인증코드 요청/응답 과정에서 유지할 수 있는 파라미터 | X |
_____________________________________________________________________________
[성공 응답]: 싱크 동의창에서 동의 버튼 클릭 시 전달 (state는 요청 시 state파라미터가 있을 때만 응답에 그대로 전달 함)
- query string으로 code, state 전달 함
- https://www.service.com/kakaoLogin?code=UxWp9VKo4j6puhm96c-La-WzWDVd2Seti4ptUAPtObu_3RKd1t9gpn-s31zcY0i70cZjhwo9dRoAAAFvowp90&state=test
[에러 응답]: 싱크 동의창에서 동의 취소 버튼 클릭 시 전달 (state는 요청 시 state파라미터가 있을 때만 응답에 그대로 전달 함)
- query string으로 error, error_description, state 전달 함
- https://www.service.com/kakaoLogin?error=access_denied&error_description=User%20denied%20access&state=test