[Flutter] Flutter Kakao Api 사용하기 (1) - sdk 설치

flutter kakao api에는 아래의 기능들을 포함하여 여러가지 기능들을 sdk 형식으로 제공하여,

원하는 api를 sdk 설치를 통해 사용하면 된다.

• 카카오 로그인
• 카카오톡 소셜
• 카카오스토리
• 카카오톡 공유
• 카카오 내비

 

설치

1. pubspec.yaml 파일에 의존성 설정

pubspec.yaml 파일에 사용할 sdk를 추가한 후 저장을 누르면 설치된다.

dependencies:
  kakao_flutter_sdk: ^1.4.1 # 전체 추가
  kakao_flutter_sdk_user: ^1.4.1 # 카카오 로그인
  kakao_flutter_sdk_talk: ^1.4.1 # 카카오톡 메시지, 카카오톡 소셜(프로필 가져오기, 친구 목록 가져오기)
  kakao_flutter_sdk_story: ^1.4.1 # 카카오스토리
  kakao_flutter_sdk_share: ^1.4.1 # 카카오톡 공유
  kakao_flutter_sdk_navi: ^1.4.1 # 카카오내비
  kakao_flutter_sdk_friend: ^1.4.1 # 카카오톡 소셜(피커: 친구 선택하기)

 

* 참고

아래는 카카오 developers 문서에 나와있는 kakao SDK 패키지 의존성이다.

 

설정

1. 플랫폼 정보 등록

sdk를 설치한 후에는 kakao developers의 내애플리케이션에 등록해 주는 과정이 필요하다.

 

1-1. 애플리케이션 만들기

애플리케이션 추가하기 클릭 후 앱이름 / 사업자명을 입력한 후 저장 버튼을 클릭한다.

카카오 애플리케이션 만들기

1-2. 플랫폼 설정

만든 애플리케이션을 들어가서 앱설정 > 플랫폼에서 사용할 플랫폼 정보를 등록한다.

Flutter SDK를 통해 카카오 api를 사용하려면 플랫폼 등록이 꼭 필요하다.

• android
  • 패키지명 : AndroidManifest.xml 파일에서 2번째 줄에서 패키지명을 확인할 수 있다.
  • 키해시 : 터미널에 아래 명령어를 입력하면 키해시가 발급되는데, 발급받은 키해시를 입력한다.
   

keytool -exportcert -alias androiddebugkey -keystore ~/.android/debug.keystore -storepass android -keypass android | openssl sha1 -binary | openssl base64

 

• ios
  • 번들ID : XCode에서 확인이 가능한데, 아래 이미지와 같이 XCode를 통해 프로젝트를 열어 Runner > General > 타겟에서 확인이 가능하다.

Flutter Xcode로 프로젝트 열기

Xcode에서 번들 아이디 확인하는 방법

 

플랫폼 등록이 완료되면 앱설정에서 아래와 같이 확인할 수 있다.

 

 

1-3. 커스텀 URL 스킴 설정

• 위에서 패키지명을 확인했던 매니페스트에 카카오 로그인 redirect URI를 추가한다.

<activity
            android:name=".MainActivity"
            android:exported="true"
            android:launchMode="singleTop"
            android:theme="@style/LaunchTheme"
            android:configChanges="orientation|keyboardHidden|keyboard|screenSize|smallestScreenSize|locale|layoutDirection|fontScale|screenLayout|density|uiMode"
            android:hardwareAccelerated="true"
            android:windowSoftInputMode="adjustResize">
            <!-- Specifies an Android theme to apply to this Activity as soon as
                 the Android process has started. This theme is visible to the user
                 while the Flutter UI initializes. After that, this theme continues
                 to determine the Window background behind the Flutter UI. -->
            <meta-data
              android:name="io.flutter.embedding.android.NormalTheme"
              android:resource="@style/NormalTheme"
              />
            <intent-filter>
                <action android:name="android.intent.action.MAIN"/>
                <category android:name="android.intent.category.LAUNCHER"/>
            </intent-filter>
		
            <!--카카오 로그인-->
            <data android:host="oauth"
                android:scheme="kakao네이티브키값" />

            <!-- 카카오톡 공유, 카카오톡 메시지 -->
            <data android:host="kakaolink"
                android:scheme="kakao네이티브키값" />
            <!-- 카카오스토리 -->
            <data android:host="kakaostory"
                android:scheme="kakao네이티브키값" />
        </activity>

• 앱 실행 허용 목록을 설정한다.

<key>LSApplicationQueriesSchemes</key>
	<array>
		<string>kakaokompassauth</string>
		<string>kakaolink</string>
	</array>

• 커스텀 URL 스킴을 생성한다.

 

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

Kakao Developers