[Bug] 안드로이드 폰으로 (Flutter Web) 카카오 로그인시 앱이 설치가 되어있어도 카카오 웹 페이지로 이동합니다.

[suprema-swkim]

이슈 설명 (Issue description)

플러터 웹으로 웹사이트를 개발중입니다.

IOS는 이슈가 없고 ANDROID에서만 이슈가 발생합니다.

1.isKakaoTalkInstalled()을 통해서 설치여부를 판단합니다.
2-1.설치가 되어있으면 loginWithKakaoTalk() //authorizeWithTalk로 테스트해도 동일합니다.
2-2.설치가 안되었으면 loginWithKakaoAccount()을 호출하게 되어있습니다.

ANDROID폰에서 설치여부는 true로 반환되지만 loginWithKakaoTalk()을 실행해도 웹사이트로 이동을합니다.

kakao_flutter_sdk/example에서 실행해도 동일합니다.

앱 ID (App ID)

1128815

플랫폼 (Platform)

WEB

디바이스 (Device)

Samsung Galaxy A34(다른폰도 동일)

Version

1.9.6

Flutter SDK

3.22.2

재현 방법 (Steps to reproduce)

1.핫스팟을 켜서 PC와 안드로이드 스마트폰 네트워크를 같게 연결합니다.
2.vscode web 실행 포트를 고정시킵니다.(.vscode/launch.json)
"args": [
"--web-hostname",
"172.20.10.5",
"--web-port",
"9999"
],
3.chrome으로 web을 실행시킵니다.(ex:http://172.20.10.5:9999)
4.안드로이픈으로 해당 url에 접속합니다.(Firefox)
5.카카오 로그인 버튼을 클릭 합니다.

코드 샘플 (Code Sample)

ElevatedButton(
  onPressed: () async {
    bool isInstalled = await isKakaoTalkInstalled();
    OAuthToken token;
    if (isInstalled) {
      token = await UserApi.instance.loginWithKakaoTalk();
    } else {
      token = await UserApi.instance.loginWithKakaoAccount();
    }
    print(token);
  },
  child: const Text(
    '카카오톡 로그인',
  ),
),

Logs

아무런 로그 없이 웹페이지로 이동합니다.

Flutter Doctor

[✓] Flutter (Channel stable, 3.22.2, on macOS 13.5 22G74 darwin-arm64, locale ko-KR)
    • Flutter version 3.22.2 on channel stable at /Users/swkim/development/flutter
    • Upstream repository https://github.com/flutter/flutter.git
    • Framework revision 761747bfc5 (4달 전), 2024-06-05 22:15:13 +0200
    • Engine revision edd8546116
    • Dart version 3.4.3
    • DevTools version 2.34.3

[✓] Android toolchain - develop for Android devices (Android SDK version 34.0.0)
    • Android SDK at /Users/swkim/Library/Android/sdk
    • Platform android-35, build-tools 34.0.0
    • Java binary at: /Applications/Android Studio.app/Contents/jbr/Contents/Home/bin/java
    • Java version OpenJDK Runtime Environment (build 17.0.6+0-17.0.6b829.9-10027231)
    • All Android licenses accepted.

[✓] Xcode - develop for iOS and macOS (Xcode 15.2)
    • Xcode at /Applications/Xcode.app/Contents/Developer
    • Build 15C500b
    • CocoaPods version 1.15.0

[✓] Chrome - develop for the web
    • Chrome at /Applications/Google Chrome.app/Contents/MacOS/Google Chrome

[✓] Android Studio (version 2022.3)
    • Android Studio at /Applications/Android Studio.app/Contents
    • Flutter plugin can be installed from:
      🔨 https://plugins.jetbrains.com/plugin/9212-flutter
    • Dart plugin can be installed from:
      🔨 https://plugins.jetbrains.com/plugin/6351-dart
    • Java version OpenJDK Runtime Environment (build 17.0.6+0-17.0.6b829.9-10027231)

[✓] VS Code (version 1.83.1)
    • VS Code at /Users/swkim/Downloads/Visual Studio Code.app/Contents
    • Flutter extension version 3.98.0

[✓] Connected device (3 available)
    • macOS (desktop)                 • macos                 • darwin-arm64   • macOS 13.5 22G74 darwin-arm64
    • Mac Designed for iPad (desktop) • mac-designed-for-ipad • darwin         • macOS 13.5 22G74 darwin-arm64
    • Chrome (web)                    • chrome                • web-javascript • Google Chrome 129.0.6668.91

[✓] Network resources
    • All expected network resources are available.

• No issues found!

[mbkim95]

안녕하세요

서버 로그를 확인해봤을 때 Firefox 브라우저에서 이슈가 발생한 것으로 파악되고, 이슈 재현되는 것 확인했습니다.

현재 안드로이드 웹 브라우저 환경에서 카카오톡 로그인은 Android Intent를 활용하는 방식으로 구현되었습니다. 그리고 Intent에는 S.browser_fallback_url 파라미터를 통해 Intent가 정상적으로 동작하지 않을 때 특정 url로 이동시키고 있습니다.

그런데 현재 Firefox 브라우저에서 카카오톡 로그인용 Intent 형식을 지원하지 않는 것으로 보이고, 그로 인해 S.browser_fallback_url로 전달된 카카오계정 로그인 페이지로 이동하는 것으로 보입니다. 브라우저 자체적으로 Intent 형식을 지원하지 않는 것은 SDK 입장에서 대응이 불가능하기 때문에 제보주신 이슈는 대응하기 어려운 점 양해 부탁드리겠습니다. 조금 번거로우시더라도 Firefox 브라우저일 때는 분기를 통해 카카오계정으로 로그인이 동작하도록 코드 수정하시는 것이 좋을 것 같아요.