웹 -> 카톡앱을 이용한 간편 로그인 지원(아이폰)

모바일 웹에서 사파리등의 외부 브라우저에서는 ID/Password를 이용해야 하는 불편함이 있었습니다. 내 카카오톡에는 계정이 있음에도 불구하고…

여러 카카오게임에서는 카카오톡으로 간편로그인을 하는데 왜 모바일 웹에서는 ID/Password를 입력하지?? 라고 많은 사용자들이 불편하셨을텐데요…

이제 드디어 모바일 웹에서도 카카오톡 앱을 이용한 간편 로그인이 지원됩니다!

- 모바일에서만 가능
- iOS9 이상에서 가능
- Mobile Safari Browser 만 지원
- 시뮬레이터에서는 테스트 할 수 없음
  1. 내 아이폰에서 사파리를 연다.
  2. 데모 보러가기 를 클릭한다.
  3. 로그인 버튼을 눌러본다!

Javascript 로그인 버튼만 붙이면 됩니다. 기존에 이미 연동하셨다면 아무것도 안하셔도 됩니다. :smile:

카카오로그인 가이드

PS) 안드로이드도 이제 지원됩니다! 웹 -> 카톡앱을 이용한 간편 로그인 지원(안드로이드)

어떻게 하면 보다 더 쉽고 간편하게 카카오 로그인을 사용할 수 있을까 매일매일 고민하는 카카오팀 드림

좋아요 1

This topic is now pinned globally. It will appear at the top of its category and all topic lists until it is unpinned by staff for everyone, or by individual users for themselves.

카톡앱으로 열린 후 다시 사파리로 돌아왔을때, 빈창이 떠있는건 어떻게 해야 없앨 수 있나요?

@boxed35 재현할 수 있는 링크를 좀 주실 수 있을까요? 현상을 한번 보고 싶어요.

http://waguwagi.co.kr/kakao.php
iframe안에 썼을 때 그런 현상이 나오는듯 싶어요.

@boxed35 오… 재현 되네요. 요 부분은 좀 더 살펴보고 다음주에 다시 피드백 드릴께요~ 갓 오픈된 기능이라 ㅋㅋ

추가로 카카오톡 앱을 백그라운드에서 제거한 상태에서 (카톡앱이 구동되어있지 않은경우)
iframe안에 구현하여 로그인을 하면, 성공/실패 여부를 알 수 없습니다( 무응답 )

좋아요 1

네~ iframe 안에서의 동작은 이상한점이 있는 것 같네요. 수정하도록 하겠습니다.
제보 정말 감사합니다!

좋아요 1

혹시, 예상 처리완료일을 알 수 있을까요?
아니면, 해당 문제를 해결하기 전까지 이전상태(아이디/비밀번호 입력 했던 상태)로 바꿔주실수는 없을까요?

네 현재로부터 24시간내에 수정본 배포하도록 하겠습니다. 불편을 드려 죄송합니다ㅜ

@boxed35 버그 픽스한 버전 배포했습니다. 확인해주세요~

좋아요 1

@leon 우선, 빠른 처리 감사합니다.(_ _ )

기존상황 : iframe 안에 구현한 kakao 로그인 기능을 활용시, 카톡앱으로 갔다 돌아오면, 빈 페이지가 떠 있는 문제가 있었음

버그 픽스 이후>

몇 가지 테스트를 해봤습니다.

[1] 아이폰 백그라운드 리스트 (홈버튼 두번 눌렀을 때 나오는 실행 중인 앱 리스트) 에서, 카카오톡이 없을 경우
[1-1] 1인 상태에서, 현재 페이지(로그인 기능을 사용하려는 페이지)가 사파리의 첫번째 탭인경우
[1-2] 1인 상태에서, 현재 페이지(로그인 기능을 사용하려는 페이지)가 사파리의 첫번째 탭이 아닌경우

[2] 아이폰 백그라운드 리스트 (홈버튼 두번 눌렀을 때 나오는 실행 중인 앱 리스트) 에서, 카카오톡이 있을 경우
[2-1] 2인 상태에서, 현재 페이지(로그인 기능을 사용하려는 페이지)가 사파리의 첫번째 탭인경우
[2-2] 2인 상태에서, 현재 페이지(로그인 기능을 사용하려는 페이지)가 사파리의 첫번째 탭이 아닌경우

( 여기서 사파리의 첫번째 탭은 사파리의 우측하단에 있는 탭을 눌럿을 때, 가장 앞에 보이는 탭을 의미합니다.)

결과>
[1-1]

  • 로그인 이후 돌아오는 페이지 : 현재 페이지(로그인 기능을 사용하려는 페이지)
    - 리턴여부 : 성공여부를 알 수 없음
    [1-2]
    - 로그인 이후 돌아오는 페이지 : 현재 페이지(로그인 기능을 사용하려는 페이지)의 앞 페이지
    - 리턴여부 : 성공여부를 알 수 없음
    [2-1]
  • 로그인 이후 돌아오는 페이지 : 현재 페이지(로그인 기능을 사용하려는 페이지)
  • 리턴여부 : 리턴값을 가져옴
    [2-2]
    - 로그인 이후 돌아오는 페이지 : 현재 페이지(로그인 기능을 사용하려는 페이지)의 앞 페이지
  • 리턴여부 : 리턴값을 가져옴

긴 글 읽어주셔서 감사합니다.

좋아요 1

자세한 설명 정말 감사드립니다.
1-2,2-2(첫번째 탭이 아니었을때의) 이슈는 카카오톡 앱의 이슈가 있어서 수정에 소요가 좀 걸릴 것 같구요.
1-1 케이스(앱이 백그라운드에 없을때의 이슈)는 수정해 배포했습니다.
첫번째 탭 이슈 관련해서 수정이 되면 공유드리도록 하겠습니다.
감사합니다~

좋아요 1

@leon 네~! 알겠습니다. 감사합니다.

저 안드로이드 로그인하면 스크립트 오류가 발생합니다.

안드로이드 버전과 user-Agent 주실 수 있으신가요?
그리고 아래 페이지에서도 발생하는지 확인가능하실까요?
https://dev.kakao.com/docs/js/demos/custom-login

크롬 개발자 모드로 테스트 해본 결과, 개발자 모드에 있는 전 기종에서 스크립트 에러가 발생합니다.

음 실제 하드웨어 디바이스에서 테스트해보신게 아니라 크롬의 개발자 모드에서 시뮬레이터로 테스트해보신건가요?
윈도우버전과 크롬 버전 알려주시면 확인해보도록 하겠습니다.

네 실제 디바이스에서는 스크립트 오류인지 판단하기 어려운부분이 있어서, 시뮬레이터로 테스트 해보았습니다.

윈도우 7
크롬 : 49.0.2623.87 m

입니다.

아마 시뮬모드가 아니라 일반모드에서도 발생할것 같은데요. 확인부탁드릴게요