[KOE006] react-native 웹뷰 환경, 카카오톡 로그인 오류(IOS)

REST API
1

문의 시, 사용하시는 개발환경과 디벨로퍼스 앱ID를 알려주세요.

앱 ID: 964910
플랫폼: Web (https://moyeota-webview.netlify.app)
Redirect Uri: https://moyeota-webview.netlify.app

expo에서 “react-native-webview”: "13.2.2"를 사용하여 웹뷰로 kauth.kakao.com/oauth/authorize를 호출하여 인카 코드를 받아오는 코드를 작성했습니다.

<WebView
        source={{
          uri: `https://kauth.kakao.com/oauth/authorize?response_type=code&client_id=${process.env.EXPO_PUBLIC_KAKAO_REST_API_KEY}&redirect_uri=${process.env.EXPO_PUBLIC_REDIRECT_URI}
          `,
        }}
        originWhitelist={["*"]}
        javaScriptEnabled
      />

redirect uri를 정상 등록하였고 안드로이드와 웹에서는 정상 동작하나 ios 시뮬레이터 및 ios 실제 기기의 expo go 환경에서는 앱 관리자 설정 오류(KOE006) 에러가 발생합니다.

Ios의 expo go가 아닌 일반적인 브라우저에서 rest api를 요청 시 정상 작동하는 것으로 보아 react-native-webview의 ios에서의 문제 같은데 정확한 원인을 모르겠습니다.

2

KOE006 에러는 인가코드요청(kauth.kakao.com/oauth/authorize)시 설정한 redirect_uri 파라메터값이 디벨로퍼스 설정에 등록안된경우 발생합니다.

ios 시뮬레이터 및 ios 실제 기기의 expo go 환경에서 redirect_uri 어떤 값으로 설정되었는지 확인해보시면 좋을 것같습니다.

에러 로그상 아래와 같은 값을들 사용하신 것으로 확인됩니다.

https://moyeota-webview.netlify.app
asdasda.com
https://moyeota-webview.netlify.app
https://moyeota-webview.netlify.app/mainpage
https://www.naver.com
https://www.naver.com/
3

현재 디벨로퍼스 설정에 등록된 uri는 https://moyeota-webview.netlify.app이며 expo 환경에서 해당 uri와 동일한 redirect uri를 사용중입니다.

동일한 expo 환경에서 안드로이드 및 웹에서는 잘 작동하는데 ios 시뮬레이터 및 실물 디바이스에서 작동하지 않아 질문 드립니다.

아침부터 수고 많으십니다. 감사합니다.

4 
https://moyeota-webview.netlify.app

uri 뒤에 공백 문자가 있습니다. 확인해주세요~

5

코드 내의 줄바꿈이 영향을 미칠 줄 몰랐습니다 …

줄바꿈 없애니 정상작동합니다. 감사합니다 !

1개의 좋아요