카카오톡으로 로그인 버튼 관련 질문

SDK version: 1.43.0
app id: 354733

안녕하세요. JS Authorize 방식을 사용하여 카카오톡 로그인을 구현하고 있습니다.
저희는 카카오 싱크도 이용하고 있기에, Kakao.Auth.authorize() 방식을 사용하면 카카오 회원가입 동의창이 바로 뜨는 것을 기대하고 있습니다.
하지만 authorize를 호출하였음에도 불구하고 카카오톡으로 넘어가지 않고 이메일/비밀번호를 입력하는 창으로 이동하는 사례가 종종 발생하고 있습니다.
그래서 데브톡 검색을 해보다가 Kakao.init을 JS key가 아닌 REST API key로 초기화 하면 적어도 로그인 페이지로 넘어가더라도 “카카오톡으로 로그인” 버튼이 노출된다는 글을 봤습니다. (카카오싱크로 가입시 이메일 계정과 비밀번호 입력해야 하는 화면으로 전환되는 경우 2 - tim.l 님의 게시물 #2)
그래서 Kakao.init을 REST API key로 바꾼 후 프로덕션에 배포하였는데, 또 일부 사용자는 로그인이 잘 되지만 일부 사용자에게서는
js_client_not_allowed 라는 에러가 발생하는 것을 확인했습니다.

  1. Kakao.init의 key를 js key가 아닌 rest api key로 했을 때 일부 사용자는 로그인이 성공하고 일부 사용자는 js_client_not_allowed라는 에러가 뜨는 이유가 무엇인지 알려주실 수 있나요? 내부적으로 js_client_not_allowed를 띄우는 기준이 있으신지 궁금합니다.

  2. Kakao.auth.authorize 호출 이후 카카오톡으로 넘어가지 않고 로그인 페이지로 이동했을 때 이메일/비밀번호 입력 버튼 외에도 “카카오톡으로 로그인” 버튼이 뜨도록 만들고 싶은데, 이것이 가능한지 알고 싶습니다.

  3. 아래 기준을 모두 만족하는 상황에서도, authorize 호출 후 카카오톡으로 이동하지 않고 이메일/비밀번호 로그인 창으로 이동하는 경우가 있는데(iPhone 11, iOS 16버전, 카카오톡 10.4.3 이용, Safari에서 authorize 호출) 어떠한 것 때문에 카카오톡이 바로 실행되지 않는지 알 수 있을까요?

  • 지원 가능한 카카오톡 버전 : And 9.1.0 / iOS 9.0.0 이상
  • 지원 가능 어플리케이션 : Chrome, Safari 등 기본 브라우저 + Naver / Facebook / Instagram
  • 그외 비표시 (단, 서비스 상황에 따라 버튼 미노출 설정 변경될 수 있음)

로그인 | 천명 에서 테스트했습니다.

안녕하세요.

우선, 파악하신 내용중 잘못된 부분 안내드려요.

아래 게시물에서 안내한 내용은 JS SDK 방식과 REST-API 방식 로그인의 차이점에 대해 안내한 것입니다.
JS SDK에 REST-API KEY를 사용하시면 안됩니다.

(카카오싱크로 가입시 이메일 계정과 비밀번호 입력해야 하는 화면으로 전환되는 경우 2 - tim.l 님의 게시물 #2 )


  1. Kakao.init의 key를 js key가 아닌 rest api key로 했을 때 일부 사용자는 로그인이 성공하고 일부 사용자는 js_client_not_allowed라는 에러가 뜨는 이유가 무엇인지 알려주실 수 있나요? 내부적으로 js_client_not_allowed를 띄우는 기준이 있으신지 궁금합니다.

JS SDK 사용 시, init는 반드시 Javascript Key로 해주세요. 용도에 맞지 않는 앱키를 사용하시면 정상 작동을 보장할 수 없습니다.

  1. Kakao.auth.authorize 호출 이후 카카오톡으로 넘어가지 않고 로그인 페이지로 이동했을 때 이메일/비밀번호 입력 버튼 외에도 “카카오톡으로 로그인” 버튼이 뜨도록 만들고 싶은데, 이것이 가능한지 알고 싶습니다.

불가능합니다. authorize는 톡으로 로그인을 먼저 시도하고 실패한 경우 계정 로그인 페이지로 이동하므로 “카카오톡으로 로그인” 버튼을 표시하지 않습니다.

  1. 아래 기준을 모두 만족하는 상황에서도, authorize 호출 후 카카오톡으로 이동하지 않고 이메일/비밀번호 로그인 창으로 이동하는 경우가 있는데(iPhone 11, iOS 16버전, 카카오톡 10.4.3 이용, Safari에서 authorize 호출) 어떠한 것 때문에 카카오톡이 바로 실행되지 않는지 알 수 있을까요?

재현 테스트 할 수 있는 URL과
카카오톡이 설치된 상황인데도 카카오 로그인으로 넘어가는 상황 영상 첨부 가능하실까요?

빠른 답변 감사드립니다.
카카오 로그인으로 넘어가는 영상 첨부드립니다. 추가 정보 확인 필요한 것 있으시면 말씀해주세요!

재현 테스트는 마이페이지 | 천명 에서 카카오톡으로 3초 만에 시작하기 버튼을 누르면 가능합니다.

카카오 로그인으로 넘어가는 영상.zip (5.8 MB)

아하… 인스타그램 인앱브라우저였군요.

(1) JS SDK authorize 로그인 시, 카카오톡 앱으로 간편하게 로그인은 인스타그램, 페이스북 인앱브라우저에서 동작하지 않습니다. 카카오 계정 로그인 페이지로 이동하게됩니다.

(2) REST-API 방식 로그인 시, 카카오 계정 로그인 페이지에 있는 “카카오톡으로 로그인” 버튼은 인스타그램 인앱브라우저에서는 정상작동하고 페이스북 인앱브라우저에서는 작동하지 않습니다.

위상황에 따라 인스타그램, 페이스북 인앱브라우저에서 동작이 다르게 처리됩니다.
이는 인스타그램, 페이스북의 지원 상황에 따라 달라질 수 있습니다.

아래 내용도 참고해보시면 좋을 것 같습니다.

Android 환경의 Facebook, Instagram Webview를 통해 간편 로그인을 하는 경우 카카오 앱이 뜨지 않고, 로그인 창이 노출됩니다

빠른 답변 진심으로 감사드립니다.
REST-API 방식으로 로그인 시, 인스타그램 인앱브라우저에서는 카카오톡 로그인 버튼이 보이지만 페이스북 인앱브라우저에서는 보이지 않는다는 말씀이시군요. 인스타그램 인앱브라우저에서만 REST-API 방식으로 로그인 하는 것을 고려해봐야겠습니다.

혹시 첨부드렸던 영상 중에서 Safari에서도 카카오톡이 아닌 로그인 페이지로 넘어가는 현상이 있는데, 이 부분도 같이 확인이 되셨는지요?

첨부해주신 영상 중, 인스타그램관련 영상 말고 1개는 파일이 손상되어 열리지 않던데요.

다시 첨부해주실 수 있을까요?

iOS 17.1 & Safari & Kakao 10.4.2.MP4.zip (1.6 MB)

그랬군요. 다시 전송드립니다! 혹시라도 손상된 것으로 다시 나오신다면 이메일로 전송 드리겠습니다.

영상의 카카오 계정 페이지로 전환 직전 카카오톡 앱으로 열기 시도를 확인하실 수 있습니다.

카카오톡이 설치되었는데도 이렇게된다면,
최초 카카오톡 실행 시점에 실행 여부를 물어볼때 “취소” 했을 가능성이 있습니다.
해당 브라우저의 임시인터넷파일, 캐시 및 쿠키 삭제하시고 다시 로그인 시도해보시면 좋을 것 같습니다.

1개의 좋아요