React, flutter inappWebview 를 통한 카카오로그인 연결중 문의드립니다

문의 시 사용하시는 SDK 버전 정보와 플랫폼(Android / iOS)를 알려주세요.
Kakao sdkVersion = “1.2.2”;
flutter inappWebview 통해 Ios 와 Android 동시 사용하려 합니다.
앱 ID 838334

지금 구조 와 현상은 아래와 같습니다.
FE react webview → eventHandler → flutter 에서 처리후, 다시 토큰 전달 → FE react 받은 토큰 → BE 전송후 로그인 처리
해당 방법으로 사용시 UserApi.instance.loginWithKakaoAccount(); 로는 문제가 없으나, loginWithKakaoTalk(); 로 OAuthToken 를 받아오려면, 카카오톡 연결후에 회원가입(유저의 카카오톡과 서비스가 연동중이 아님) 이라면 약관 체크 후에 카카오톡에 머무름, 이미 연동이 되어있다면 카카오톡으로 넘어간후에 다른 리다이렉팅이 없이 액션이 끝남. 하지만, loginWithKakaoAccount(); 를 통해 연결시 에는 정상 작동됩니다.

loginWithKakaoTalk(); 를 통해 이용하려면 다른 조치가 필요한가요?

flutter 코드
webViewController?.addJavaScriptHandler(
                                handlerName: 'kakaoSignUp',
                                callback: (arguments) async {
                                  if (await isKakaoTalkInstalled()){
                                    try{
                                      // OAuthToken token = await UserApi.instance.loginWithKakaoTalk(); <--- 제대로 동작하지 않음
                                      OAuthToken token = await UserApi.instance.loginWithKakaoAccount();
                                      // print('로그인 성공 ${token.accessToken}');
                                        return token.accessToken;
                                    } catch (error) {
                                          if (error is PlatformException && error.code == 'CANCELED'){
                                            return null;
                                          } 
                                          return null;
                                      } 
                                  } else {
                                    try {
                                      OAuthToken token = await UserApi.instance.loginWithKakaoAccount();
                                      return token.accessToken;
                                    } catch (error) {
                                      if (error is PlatformException && error.code == 'CANCELED'){
                                            return null;
                                          } 
                                          return null;
                                    }
                                }
                                });

안녕하세요

해당 가이드 참고하셔서 관련 설정이 다 올바르게 되어있는지 확인 부탁드리겠습니다

1개의 좋아요

네 지금 설정 완료된 부분으로는

  1. 플랫폼등록 (android, ios, Web 모두 등록)
  2. 안드로이드 AndroidManifest.xml URL 스킴 설정, ios 앱 실행 허용 목록, URL 스킴 설정
  3. 초기화 설정 nativeAppKey, javaScriptAppKey 모두 설정

위의 설정은 모두 완료된상태입니다.

첨부해주신 코드 참고해서 이슈를 재현해봤는데 카카오톡으로 로그인하기 기능도 정상적으로 잘 동작하는 것 확인했습니다.

이슈 증상을 봤을 때 설정이 잘못되어있을 확률이 높아보이는데요, SDK 관련 설정하신 부분 캡쳐해서 저에게 개인 메시지로 보내주시면 확인해보겠습니다. (댓글로 남겨주시면 앱 키가 유출될 수 있기 때문에 개인 메시지로 전달 부탁드립니다)

이슈와 별개로 웹 페이지를 react로 개발하고 있다면 Flutter SDK를 활용한 현재 방식보다는 JavaScript SDK를 사용하시는 것이 더 좋을 것 같아요.
JavaScript SDK 가이드 참고해서 적용 검토해보시면 좋을 것 같습니다.