카카오톡 로그인하기 로그인이 되지 않습니다

AOS에서 카카오로그인을 하려고 하면 로그인이 되지 않습니다.

크롬 개발자도구에서 실행을 해 보았을 때 아래와 같은 내용이 나옵니다.

위 문제에 대한 원인과 해결 방안을 아시는 분이 계신다면 도움 요청 드립니다.

intent:#Intent;action=com.kakao.talk.intent.action.CAPRI_LOGGED_IN_ACTIVITY;launchFlags=0x08880000;S.com.kakao.sdk.talk.appKey=fe2dad72e63f7f93fd39488809a4401c;S.com.kakao.sdk.talk.redirectUri=https://kapi.kakao.com/cors/afterlogin.html;S.com.kakao.sdk.talk.state=bk245wrx4druzp73uwlib;S.com.kakao.sdk.talk.kaHeader=sdk/1.43.0%20os/javascript%20sdk_type/javascript%20lang/ko-KR%20device/Win32%20origin/https%3A%2F%2Fmsecure.lottechilsung.co.kr;S.com.kakao.sdk.talk.extraparams=%7B%22client_id%22%3A%22fe2dad72e63f7f93fd39488809a4401c%22%7D;S.browser_fallback_url=https%3A%2F%2Fkauth.kakao.com%2Foauth%2Fauthorize%3Fclient_id%3Dfe2dad72e63f7f93fd39488809a4401c%26redirect_uri%3Dhttps%253A%252F%252Fkapi.kakao.com%252Fcors%252Fafterlogin.html%26response_type%3Dcode%26state%3Dbk245wrx4druzp73uwlib%26proxy%3DeasyXDM_Kakao_i0obfhhp5i9_provider%26ka%3Dsdk%252F1.43.0%2520os%252Fjavascript%2520sdk_type%252Fjavascript%2520lang%252Fko-KR%2520device%252FWin32%2520origin%252Fhttps%25253A%25252F%25252Fmsecure.lottechilsung.co.kr%26origin%3Dhttps%253A%252F%252Fmsecure.lottechilsung.co.kr;end

안녕하세요.

PC에서 크롬 개발자도구의 기기툴바를 사용하여 모바일 모드로 사용하시게 되면
SDK가 모바일로 판단되어 Intent URL를 호출하게 됩니다.
PC에서는 호출할 수 없는 URL이므로 위와 같은 오류가 발생하게 됩니다.

현재 iOS에서 카카오 로그인을 하면 카카오 페이지로 정상 이동하는데,
동일한 내용을 AOS에서 실행하면 카카오 페이지로 이동하지 않고 멈춰(백화)있습니다. 원인이 무엇인지 알 수 없을까여?

관련 내용 mp4 동영 상으로 되어 있는데 mp4는 업로드 지원이 안되네여.

@jwku23

안녕하세요.

확인을 위해 앱 ID 부탁드립니다.


앱ID
https://developers.kakao.com/ 의 내 애플리케이션>앱 설정>요약 정보 : 기본정보에 있는 앱 ID
숫자로된 ID 입니다

ex) 123456

관리자가 아니어서 패스워드 확인이 안되는데
계정 알려드리면 안될까여?
lot*********@lot***********

메일은 확인후 가렸습니다. 확인후 답변드리겠습니다.

안드로이드 개발자가 다음과 같다고 합니다.

특정 안드로이드 카카오로그인 오류 링크를 확인했는데
이미 적용되어야할 내용은 적용되어있고 또 앱의 내용이 아닌 부분은 제외하고 확인하였습니다.
별다른 내용은 없었습니다.

앱 코드에 문제가 있다면 다 안되야하는데 wifi 나 데이터 통신에 따라 혹은 망에 따라
보였다 안보이는 문제이기 때문에 앱에서 따로 처리 할 방법이 보이지 않는다고 말씀드리고 싶었습니다.

테스트 중 카카오 로그인이 보이지않는 단말이 KT 였는데 wifi에 붙어서 테스트를 하니 카카오 로그인 화면이 열렸습니다.

또 어느 망인지는 모르나 wifi에 연결된 단말이 카카오 로그인 창을열었을때 흰화면으로 열리지 않았는데 wifi끄고 SKT데이터로 하니 카카오 로그인 창이 잘열렸습니다.

카카오 로그인 시 잘보이는 단말과 안보이는 단말을 비교하면서 네이티브 코드의 로그를 봤을 때 특별한 문제점이 보이진 않았습니다.

다만 문제가 있던 없던 카카오 로그인 화면을 열었을 때 아래와 같은 크롬에서 나오는 로그가 있어 첨부드립니다.

2022-11-02 17:12:54.728 10541-10541/com.lotte.ltcsmobile W/chromium: [WARNING:render_frame_host_impl.cc(14241)] https://msecure.lottechilsung.co.kr/ ran insecure content from http://mall.lottechilsung.co.kr/helpdesk_page_error.html
2022-11-02 17:12:54.729 10541-10541/com.lotte.ltcsmobile I/chromium: [INFO:CONSOLE(0)] “Mixed Content: The page at ‘https://msecure.lottechilsung.co.kr/member/kakao/callback.lecs?returnurl=https%3A%2F%2Fmsecure.lottechilsung.co.kr%2Fmobile%2Fmypage%2Fmypage.lecs%3FFROM%3Dmobile%26FROM%3Dmsecure’ was loaded over HTTPS, but requested an insecure favicon ‘http://mall.lottechilsung.co.kr/helpdesk_page_error.html’. This content should also be served over HTTPS.”, source: https://msecure.lottechilsung.co.kr/member/kakao/callback.lecs?returnurl=https%3A%2F%2Fmsecure.lottechilsung.co.kr%2Fmobile%2Fmypage%2Fmypage.lecs%3FFROM%3Dmobile%26FROM%3Dmsecure (0)
2022-11-02 17:12:54.967 10541-10541/com.lotte.ltcsmobile D/MainActivity: onPageCommitVisible: https://msecure.lottechilsung.co.kr/member/kakao/callback.lecs?returnurl=https%3A%2F%2Fmsecure.lottechilsung.co.kr%2Fmobile%2Fmypage%2Fmypage.lecs%3FFROM%3Dmobile%26FROM%3Dmsecure
2022-11-02 17:12:55.229 10541-10773/com.lotte.ltcsmobile W/chromium: [WARNING:display_webview.cc(31)] WebView overlays are enabled!

또 잘나오는 단말과 안나오는 단말을 크롬 인스펙터를 이용해서 웹코드를 조금 봤는데 … 나올때와 안나올때의 화면 코드가 좀 다른것 같았습니다.

제가 웹 개발자가 아니라 어느 부분이 잘못되었는지는 잘모르겠습니다.

크롬 인스펙터를 통해 화면을 점검 해보는것도 하나의 방법일듯합니다.

카카오창 로그인 창은 open window로 창이 새로 열리는 부분인데 네이티브 코드로 이부분을 지원해 주지 않으면 open window가 되지 않습니다.

예로 칠성몰 하단 푸터 중 회사소개 메뉴도 창이 새로 열리는 부분입니다.

창이 새로 열리는 부분의 코드가 이상 없기 때문에 현재 열리는 것을 확인 할 수있습니다.

네이티브 웹뷰에서는 새창 여는것을 지원할지 말지의 옵션 외에 화면을 제어 하는 기능은 없습니다.

결론으로 앱에서 수정이 필요한 증상 및 이상이 발견되지 않았습니다.

@jwku23

사전 확인

칠성몰은 웹뷰로 제작되어 있습니다.
카카오 로그인 및 디벨로퍼스에서 제공하는 JS SDK를 정상적으로 사용하기 위해서는 네이티브에서는 아래 하이브리드 가이드의 내용이 구현되어 있어야 합니다. (안드로이드 개발자에게 아래 내용이 구현되어 있는지 확인 부탁드립니다.)

https://developers.kakao.com/docs/latest/ko/getting-started/sdk-js#hybrid-app


직접적인 오류 원인

아래는 칠성몰에 구현된 로그인 단계 입니다.

1. 로그인 버튼 클릭 시, 서비스측의 별도의 화면으로 이동하고 있습니다.

image

2. 이동된 화면에서 JS SDK 사용 팝업 로그인을 호출합니다.

image

여기에 문제가 있습니다.
사용자가 클릭 이벤트를 발생시킨 이벤트 내가 아닌 다른곳에서 팝업 호출이 일어나게 되면 브라우저에서는 해당 액션을 차단하게 됩니다. 사용자 환경에 따라 간헐적으로 동작할수는 있으나 기본적으로는 브라우저에서 차단하며 정상동작할수 없습니다.


해결

카카오 로그인 시, 위 1단계에서 다른 페이지로 이동시키지 마시고 사용자 클릭이벤트가 유효한 이곳(loginWithKakao)에서 JS SDK를 사용부탁드립니다.


다른 이야기

위 2단계에서 Mixed 오류가 발생하고 있습니다.
서비스에 크리티컬한 영향을 주는 오류는 아니지만 확인 부탁드립니다.
(http → https 로 변경하면 될것 같습니다)
image

카카오 로그인 시, 위 1단계에서 다른 페이지로 이동시키지 마시고 사용자 클릭이벤트가 유효한 이곳(loginWithKakao )에서 JS SDK를 사용하였으나 되는 사용자 그렇지 않은 사용자 나뉘어 집니다.

안녕하세요.

확인해보니 이전과 동일하게 구현되어 있습니다.
코드를 변경 하셨다면 제가 확인해볼수 있는 URL 제공 부탁드립니다.