서버없이 Flutter로 카카오 로그인 준비하기

1. 로그인하고 애플리케이션 추가하기

Kakao Developers

카카오 API를 활용하여 다양한 어플리케이션을 개발해보세요. 카카오 로그인, 메시지 보내기, 친구 API, 인공지능 API 등을 제공합니다.

https://developers.kakao.com/

2. 카카로 로그인 활성화 설정하기

Kakao Developers

카카오 API를 활용하여 다양한 어플리케이션을 개발해보세요. 카카오 로그인, 메시지 보내기, 친구 API, 인공지능 API 등을 제공합니다.

https://developers.kakao.com/docs/latest/ko/kakaologin/prerequisite#tag

• OpenID Connect 활성화 설정은 FireBase 사용시 활성화시켜야함

3. 앱 키에서 본인의 키 확인하기

4. 동의항목 설정하기

• 닉네임 필수 항목으로 설정하기

5. 안드로이드 플랫폼 등록하기

• 플랫폼 등록 설명

Kakao Developers

카카오 API를 활용하여 다양한 어플리케이션을 개발해보세요. 카카오 로그인, 메시지 보내기, 친구 API, 인공지능 API 등을 제공합니다.

https://developers.kakao.com/docs/latest/ko/getting-started/app#platform-android

• 패키지명 확인하기

• 키 해쉬 확인하기
• 앱 출시 시 릴리즈 키로 한번 더 설정해줘야 함

Kakao Developers

카카오 API를 활용하여 다양한 어플리케이션을 개발해보세요. 카카오 로그인, 메시지 보내기, 친구 API, 인공지능 API 등을 제공합니다.

https://developers.kakao.com/docs/latest/ko/android/getting-started#before-you-begin-add-key-hash

• openssl 설치하기

• 디버그 키 해시 생성

keytool -exportcert -alias androiddebugkey -keystore %USERPROFILE%\.android\debug.keystore -storepass android -keypass android | openssl sha1 -binary | openssl base64

• 릴리즈 키 해시 생성

• android/app/build.gradle에 추가하기

 signingConfigs {
        release {
            keyAlias 'your-key-alias'
            keyPassword 'your-key-password'
            storeFile file(localProperties.getProperty('MYAPP_RELEASE_STORE_FILE'))
            storePassword 'your-store-password'
        }
    }
    buildTypes {
        release {
            // TODO: Add your own signing config for the release build.
            // Signing with the debug keys for now, so `flutter run --release` works.
            signingConfig signingConfigs.release
            // Enable Proguard to shrink and obfuscate the code
            minifyEnabled true
            // Add the Proguard configuration file
            proguardFiles getDefaultProguardFile('proguard-android-optimize.txt'), 'proguard-rules.pro'
        }
    }

• android/local.properties에 추가하기

# 카카오 로그인 릴리즈 해시를 위해 설정
MYAPP_RELEASE_STORE_FILE=C:/path/to/your/keystore.jks
MYAPP_RELEASE_KEY_ALIAS=mykeyalias
MYAPP_RELEASE_STORE_PASSWORD=mystorepassword
MYAPP_RELEASE_KEY_PASSWORD=mykeypassword

keytool -exportcert -alias <RELEASE_KEY_ALIAS> -keystore <RELEASE_KEY_PATH> | openssl sha1 -binary | PATH_TO_OPENSSL_LIBRARY\bin\openssl base64

• android/app/build.gradle에 코드 추가하기

• Java 8 사용을 위한 설정

    kotlinOptions {
        jvmTarget = "1.8"
    }

• AndroidManifest.xml에 카카오 로그인을 위한 코드 추가하기
Kakao Developers
카카오 API를 활용하여 다양한 어플리케이션을 개발해보세요. 카카오 로그인, 메시지 보내기, 친구 API, 인공지능 API 등을 제공합니다.

https://developers.kakao.com/docs/latest/ko/flutter/getting-started

 <!-- 카카오 로그인 커스텀 URL 스킴 설정 -->
    <activity 
        android:name="com.kakao.sdk.flutter.AuthCodeCustomTabsActivity"
        android:exported="true">
        <intent-filter android:label="flutter_web_auth">
            <action android:name="android.intent.action.VIEW" />
            <category android:name="android.intent.category.DEFAULT" />
            <category android:name="android.intent.category.BROWSABLE" />

            <!-- 카카오 로그인 Redirect URI -->
            <data android:scheme="kakao${YOUR_NATIVE_APP_KEY}" android:host="oauth"/>
        </intent-filter>
    </activity>

6. iOS 플랫폼 등록하기

• 패키지 명만 등록하면 됨
• ios/Runner/Info.plist에서 패키지명 찾기

<key>CFBundleIdentifier</key>
<string>패키지명</string>

• ios/Runner/Info.plist에 카카오 로그인을 위한 코드 추가하기
Kakao Developers
카카오 API를 활용하여 다양한 어플리케이션을 개발해보세요. 카카오 로그인, 메시지 보내기, 친구 API, 인공지능 API 등을 제공합니다.

https://developers.kakao.com/docs/latest/ko/ios/getting-started#project-plist

• iOS 9.0 이상에서 iOS SDK로 카카오톡 앱 실행 허용 목록(Allowlist)을 설정

<!-- iOS 9.0 이상에서 iOS SDK로 카카오톡 앱 실행 허용 목록(Allowlist)을 설정 -->
	<key>LSApplicationQueriesSchemes</key>
      <array>
          <!-- 카카오톡으로 로그인 -->
          <string>kakaokompassauth</string>
          <!-- 카카오톡 공유 -->
          <string>kakaolink</string>
          <!-- 카카오톡 채널 -->
          <string>kakaoplus</string>
      </array>

• 커스텀 URL 스킴 설정

<!-- 카카오 로그인 커스텀 URL 스킴 설정 -->
<key>CFBundleURLTypes</key>
    <array>
      <dict>
      <key>CFBundleURLSchemes</key>
      <array>
        <!-- kakao login -->
        <string>kakao${YOUR_NATIVE_APP_KEY}</string>
      </array>
      </dict>
    </array>