카카오 연동 로그인 시 멈춤 상태

영상은 AOS 모델이라 직접 캡쳐 가능한 앱이 없어 어렵네여.

네, 확인 감사합니다.

(1) 테스트 영상 zip파일로 압축해서 첨부 부탁드려요.

→ 안드로이드 상단 기본 메뉴에 “화면녹화” 기능이 있는데 확인해보시겠어요?

(2) 테스트하신 기기에 카카오톡앱이 설치되어있고 로그인까지 되어있는 상태인지 확인해주세요.

→ 네, 카카오톡 설치만 되어 있고 로그인 안한경우 폴링 성공응답을 받지 못하고 계속 폴링하는 현상이 있는데요. 이케이스는 아닌 것 같네요.

(3) 테스트하신 기기, 테스트하신 브라우저에서 아래 주소 접근하셔서
"JavaScript SDK 로그인(PopUp) " 탭 선택 후, 카카오 로그인 정상 작동하는지 확인 부탁드려요.

→ 캡쳐해주신 화면은 팝업 방식 카카오 로그인이 정상 작동한 것으로 해당 기기는 문제가 없는 상태입니다.

즉, 개발하신 시스템 종속적문제라 판단됩니다.

(4) 카카오 로그인 관련 구현하신 코드블럭 기재 부탁드려요.

아래 init는 함수 안에서 처리하지않고, 페이지 최상단 카카오 JS SDK import구문 근처에서 한번만 init처리해주세요.
이미 init했는데 또 init하면 두번째부터는 에러 발생합니다.

Kakao.init('<%=kakaoKeyId%>');

기재하신 코드에서 init위치 변경하고 아래와 같이 카카오 로그인만 가지고 테스트해보니 정상작동합니다.

Kakao.Auth.login의 success 구문 내 , <%-- 통합회원제 일반로그인 API 호출 --%> 이하 로직 제거하시고 accessToken값만 alert로 정상 처리되는지 확인해보시면 좋을 것같습니다.

function loginWithKakao548606(){
	var f = document.frmLoginMem;	
	
	Kakao.Auth.login({
		success: function(authObj){
			var accessToken = authObj.access_token;
			alert(accessToken);
                 
              
		},
		fail: function(err){
			if(typeof(err.error) == 'string' && err.error.toLowerCase() == 'access_denied'){
			}else if(typeof(err.error) == 'string' && err.error.toLowerCase() == 'window_closed'){
				alert("취소하셨습니다."+ err.error.toLowerCase());
			} else {
				alert("현재 시스템 문제로 인해 서비스가 제한되고 있습니다. 빠른 정상화를 위해 노력 하겠습니다. 서비스 이용에 불편을 드려 죄송합니다." + err.error.toLowerCase());
			}
		},
		always: function() {

		}
	});
}

의심되는 상황은
카카오 JS SDK가 로그인 시점 동적으로 생성한 html내 특정 Dom구조가 있는데
이는 카카오 계정 페이지와 교신하는 역할을 합니다.
개발하신 시스템에서 이 html내 객체를 훼손한것으로 추정되나 실제로 작동 테스트를 하지 않는한 정확한 판단은 어려워보이네요.

또 init하면 두번째부터는 에러 발생한다고 하셨는데 어떻게 발생하나여?
아이폰에서는 전혀 문제가 없고 AOS 모델에서만 이슈가 있습니다.

이 부분을 아래처럼 수정 부탁드립니다.

if(!Kakao.isInitialized()) {
    Kakao.init("your code");
}

초기화는 페이지에서 단한번만 수행되어야 합니다.
재 수행시 Kakao.init: Already initialized 오류가 발생합니다.
때문에, 버튼 이벤트와 연결된 함수에서 초기화가 이루어 진다면 여러번 클릭하는 경우 오류가 발생할수 있기에 위와 같은 코드가 필요합니다.

페이지 최상단이 아니라 function loginWithKakao548606() 에서
if(!Kakao.isInitialized()) {
Kakao.init(“your code”);
}
해도 된다는 거 아닌가여?

영상 첨부합니다.
Screen_Recording_20221114_190946.zip (7.3 MB)

또 init하면 두번째부터는 에러 발생한다고 하셨는데 어떻게 발생하나여?

만약 중복 init에러가 발생한다면, 아래와 같은 메시지가 출력됩니다.

{
    "name": "KakaoError",
    "message": "Kakao.init: Already initialized"
}

아이폰에서는 전혀 문제가 없고 AOS 모델에서만 이슈가 있습니다.

네. 코드상에 예상되는 문제점만 확인해드렸구요.
재현테스트를 해볼 수 없어서. 정확한 안내가 어려운점 양해부탁드립니다.

위에 안내드린 것처럼. 칠성몰 내부 로직에서 JS SDK 팝업방식 로그인에서 생성한 객체를 훼손하는게 아닌가 의심되는데요.

팝업 방식 로그인이 아니라
JS SDK authorize방식을 사용해보시는 것도 좋을 것같습니다.

JavaScript | Kakao Developers JavaScript

안드로이드 크롬에서 문제상황이라 하시지 않으셨나요? ;;

영상첨부해주신 흰화면은 앱내 인앱브라우저 팝업처리가 제대로안된 현상으로 보입니다.

앱 내부에 구현이 필요하다는 얘기 아닌가여?

그런데 되는 사람이 있고 그렇지 않은 사람이 있는데여?
그리고 카카오톡 로그인하기 로그인이 되지 않습니다 - jwku23님의 글 #7 에서 답변주신 내용으로 적용한 케이스입니다.

네 맞습니다.

인앱브라우저에서 카카오 로그인 팝업 호출 시, 새로운 팝업 인앱브라우저를띄우고
카카오 로그인 및 동의창 동의 후, 팝업을 닫고 부모창으로 돌아가는데요.

팝업 닫고 돌아갈 브라우저가 없어서 생기는 현상입니다.

아래내용 참고하셔서 구현해주시거나
변경이 어려우신경우, JS SDK authorize방식으로 웹페이지를 변경해주시면 됩니다.

JavaScript | Kakao Developers JavaScript

모바일 크롬에서는 잘되는데 상관없나여?

위에 답변주신내용은 버튼 이벤트와 팝업이벤트를 동기화해야 팝업차단이 일어나지 않는다는 안내로
백화현상과 무관합니다.

백화현상은 앱에 팝업 처리 구현문제입니다.
참고부탁드려요.

네, 브라우저에서는 팝업처리를 알아서해주니 오류 발생하지 않습니다.
앱내 인앱브라우저에서 팝업구현문제입니다.

웹개발자와 앱개발자 중 누가 구현해야 하나여?

JS SDK팝업 방식
즉, Kakao.Auth.login 함수를 그대로 사용하신다면
앱개발자가 아래 내용 참고하셔서 동적 팝업 처리 구현해야하구요.

JavaScript | Kakao Developers JavaScript


JS SDK authorize 방식으로 구현 변경하시면
즉, Kakao.Auth.authorize 함수로 변경하신다면
웹개발자( frontend, backend)가 구현하시면됩니다.

JavaScript | Kakao Developers JavaScript

이전 캡쳐한 소스부분처럼 Kakao.Auth.login 함수 구현 부분은 웹쪽에 구현되어 있는데
앱개발자가 아래 내용 참고하셔서 동적 팝업 처리 구현해야하는 건가여?

네, 인앱브라우저를 띄우는 앱에서 처리해야합니다.

앱 개발자가 ‘카카오 로그인 관련 링크를 주셨던 내용(카카오 로그인 시 팝업웹뷰 등 기본적인 가이드)과 같은 내용(팝업웹뷰)으로 이미 적용되어 있습니다.’ 라고 합니다.

안녕하세요.

여전히 이전에 안내드린 바와 같이 구현되어 있는데요

https://devtalk.kakao.com/t/topic/125938/7

image


만약, 테스트 중인 웹뷰 전용 사이트가 따로 계시다면 저희가 접속해 볼수 있는 주소를 제공해 주시면 재현여부를 확인해보도록 하겠습니다.

안내해주신 부분 적용은 이슈가 있어서 아직 PRD에 반영할 수 없는 상태입니다.
TST 서버에서 확인 중인데 저희쪽 TST 서버는 내부망이나 VPN으로 접근해야 하는데
Ivanti Secure Access 앱 설치 후 알려주신면 접근 가능한 접속정보와 인증번호 보내드리겠습니다.
AOS 칠성앱 TST는 com-app.lotteon.com 에 DEBUG, RELEASE 중 DEBUG 버전으로 설치하면 됩니다.