안드로이드 웹뷰에서 javascript sdk 사용 시 리다이렉트가 안되는 문제

JavaScript
#1

안녕하세요

안드로이드 웹뷰에서 javascript sdk를 이용해서 로그인을 구현하려고 합니다

공식 문서 예제를 그대로 복붙에서 구현해서 일단 웹뷰의 로그인 화면(a)에서 로그인 버튼 클릭 시 카카오 앱의 권한 체크 창까지 뜨는 것까지 했는데요,

권한 확인 후 진행 시 웹뷰가 redirectUri로 이동하는 것이 아니라 아무 반응이 없는채로 로그인화면(a)에 그대로 있습니다.

카카오 앱 intent의 결과를 받아서 별도로 처리하는 코드가 필요한지 궁금합니다.

그리고 예제 코드의 아래 로그 부분에서 ACTIVITY : null이 나오는데 정상 과정인지 궁금합니다.

if (intent.resolveActivity(packageManager) != null) {
    startActivity(intent)
    Log.d(TAG, "ACTIVITY: ${intent.`package`}")
    return true
  }
#2

안녕하세요.

어떤상황인지 잘 이해되지 않는데요.
웹뷰에서 로딩하는 카카오 로그인 페이지 url 알려주시겠어요?

웹뷰에서 아래 데모페이지 로딩하셔서 정상작동하는지도 확인 부탁합니다

https://developers.kakao.com/tool/demo/login/login

1개의 좋아요
#3

답변 감사합니다! 해당 문제는 해결했고 javascript 문제였습니다.

다른 분들 참고를 위해서 내용 정리합니다.

/login 페이지에서 ‘카카오톡 로그인’ 버튼을 제공하고있고 javascript SDK로 구현을 했습니다.
위 버튼은 pc 웹, 모바일 웹 환경에서 정상동작을 하였고 문제는 웹뷰에서 로그인을 시도했을 때

  1. 로그인 버튼을 클릭한다
  2. 카카오 앱으로 권한 요청 창이 오픈된다
  3. 권한 확인을 누른다

요 과정에서 2번까진 진행되는데 웹뷰가 3번까지 기존 /login 페이지에서 정지해있는 것이 아니라 새로고침 처럼 페이지가 리로딩되었고(이부분은 웹서버 페이지 요청 로그, 웹뷰 url 호출 로그에서 확인) 앱에선 3번 과정이 끝나더라도 아무런 동작을 하지 않는 것이 문제였습니다.

원인과 해결 조치는 아래와 같습니다.

  1. 프론트 페이지에선 stimulusjs 라는 자바스크립트 프레임워크를 사용중임
  2. 해당 프레임워크는 data-action=‘click->{함수}’ 로 클릭 액션을 다루는 기능을 제공함
  3. 해당 기능을 사용해서 버튼 엘리먼트인 a 태그에 해당 클릭 액션을 붙임
    → 여기서 stimulusjs의 data-action에 정의한 함수는 함수데로, a태그의 기본 클릭 href 동작은 동작데로 동작함.
    그래서 두 가지 이벤트가 모두 동시에 동작함
    href="" 의 동작데로 페이지가 리로드되는 것 처럼 보였음

그래서 stimulusjs에 href="’ 동작을 하지 않도록 event.preventDefault() 를 해주었음

삽질했네요 다른분들도 도움이될까 남깁니다…

1개의 좋아요