[Android] 카카오톡 로그인 - 1

카카오톡 로그인 - 1

프로젝트에 카카오톡으로 로그인 하는 부분이 필요해서 구현해보기로 했다.

페이스북으로는 로그인을 구현해 보았지만 카카오톡은 처음이다.

들리는 바에 의하면 제휴를 해야지 많은 기능을 사용할 수 있다고 하는데 아직까지는 모르니까,

일단 로그인 구현에 초점을 맞춰야지.

처음으로 맥 환경에서의 실습이다. 아직 인터페이스가 익숙치 않아서 고생 꽤나 하고 있다.

아니나 다를까 드라이버가 설치되지 않아서 Run되지 않는다.

시키는대로 필요한 파일을 다운받자.

다운 받고 예만 계속 누르면 설치가 완료되고 내 디바이스를 인식한다.

Empty Activity로 프로젝트를 생성후 잘 동작하는지 실행해보았다.

디바이스에서 잘 동작한다.

어플리케이션 등록

먼저, 카카오톡 개발자페이지에 접속한다.

아이디를 만들고 로그인을한다.

그리고 내 어플리에이션에 들어가 앱 만들기를 클릭, 어플리케이션을 등록한다.

등록된 어플리케이션을 클릭, 설정->일반으로 들어간다.

오른쪽 하단에 플랫폼 추가를 눌러 자신의 개발 플랫폼을 추가한다.

플랫폼을 클릭후 자신이 생성한 안드로이드 스튜디오 프로젝트의 패키지명을 입력한다.

그러면 자동으로 마켓 URL까지 입력되는 것을 확인할 수 있다.

다음으로 해시키를 입력해야한다.

해시키는 터미널에 커맨드를 입력하여 찾아낸다.

 

keytool -exportcert -alias androiddebugkey -keystore <debug_keystore_path> -storepass android -keypass android | openssl sha1 -binary | openssl base64

커맨드는 다음과 같다.

커맨드는 내부의 <debug_keystore_path> 는 사용자 컴퓨터 마다 다르며 debug_keystore의 경로를 입력한다.

예 : ~/.android/debug.keystore

 

Windows Vista와 Windows 7 예: C:\Users\<user>\.android\debug.keystore

Windows XP 예 : C:\Documents and Settings\<user>\.android\debug.keystore

debug_keystore_path는 예시와 동일하게 입력하면 된다.

맥 OS의 터미널은 위와 같다.

주의할 점은, 위의 코드는 디버그용 해시키를 찾는 것이다. 

릴리즈 시, 릴리즈 해시키를 찾아 등록해야 한다.

다음으로 네이티브 키를 앱에 등록해야한다.

values에 kakao_string.xml를 생성후 키값을 등록한다.

 

<resources>
    <string name="kakao_app_key">AAAAAAAAAAAAAAAAAAAAAA</string>                                           
</resources>
 

코드는 다음과 같다.

AAA...에 네이티브 키값을 입력하면 된다.

네이티브 키값은 어플리케이션 최초 생성시 지급되며 개발자 페이지 설정->일반에서 확인할 수 있다.

 

<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
    package="com.example.anew.kakao">
 
    <uses-permission android:name="android.permission.INTERNET" />
 
    <application
        android:allowBackup="true"
        android:icon="@mipmap/ic_launcher"
        android:label="@string/app_name"
        android:supportsRtl="true"
        android:theme="@style/AppTheme">
        <activity android:name=".LoginActivity">
            <intent-filter>
                <action android:name="android.intent.action.MAIN" />
 
                <category android:name="android.intent.category.LAUNCHER" />                               
            </intent-filter>
        </activity>
        <meta-data
            android:name="com.kakao.sdk.AppKey"
            android:value="@string/kakao_app_key" />
    </application>
 
</manifest>

다음은 AndroidManifest.xml이다.

Internet에 대한 퍼미션을 추가해주고, 방금전에 생성한 네이티브 키 xml을 등록해 주도록 하자.

여기까지 진행했으면 1차 완료이다.

SDK 환경 구축

일단 기본 세팅부터 시작한다.

카카오톡의 경우 SDK 소스를 다운받을것이 아니라 bulid.gradle에 경로를 추가해줌으로써

불필요한 소스를 줄이고 어플리케이션을 가볍게 할 수 있다.

따라서 카카오톡 SDK를 bulid. gradle에 추가하는 것이 선행되어야한다.

프로젝트 창을 보면 다음과 같은 리스트가 나온다.

build.gradle이 2개 나오는데 카카오톡 개발자 페이지에서는 어떤 gradle에 추가해야하는지

명확하게 명시하지 않는다.

subprojects {
    repositories {
        mavenCentral()
        maven { url 'http://devrepo.kakao.com:8088/nexus/content/groups/public/' }                          
    }
}
 

먼저 상단의 build.gradle(Project: 프로젝트명)에 다음과 같은 소스를 추가한다.

dependencies {
    compile group: 'com.kakao.sdk', name: 'kakaolink', version: project.KAKAO_SDK_VERSION
 
    // 카카오스토리 sdk를 사용하기 위해 필요.
    compile group: 'com.kakao.sdk', name: 'kakaostory', version: project.KAKAO_SDK_VERSION
 
    // 카카오톡 sdk를 사용하기 위해 필요.
    compile group: 'com.kakao.sdk', name: 'kakaotalk', version: project.KAKAO_SDK_VERSION                  
 
    // push sdk를 사용하기 위해 필요.
    compile group: 'com.kakao.sdk', name: 'push', version: project.KAKAO_SDK_VERSION
}
 

다음으로 build.gradle(Module:app)에 다음과 같은 소스를 추가한다.

name에 들어가는 이름들은 자신이 사용할 모듈들이다. 개발자 페이지에 목록이 나와있다.

자신이 사용할 내용만 잘 선택해서 사용하도록 하자

다음으로 project.KAKAO_SDK_VERSION에 대한 정의를 지정해줘야한다.

project.KAKAO_SDK_VERSION 는 현재 최신 버전 SDK를 입력하면 되는데, 

일괄적으로 정의하기 위하여 gradle.property에 다음과 같은 코드를 선언한다.

KAKAO_SDK_VERSION=1.1.20                                                                                     

테스트 일자 기준, 최신버전은 1.1.20이다.

상단에 나타난 노란바에 안에 Sync now 를 눌러서 적용해주면 gradle에 대한  SDK세팅이 완료된다.

XML 로그인 위젯

다음은 카카오톡 로그인  위젯이다.

 

<com.kakao.usermgmt.LoginButton
    android:id="@+id/com_kakao_login"
    android:layout_width="0dp"
    android:layout_height="wrap_content"                                                                     

    android:layout_weight="1"
    android:layout_marginBottom="30dp"
    android:layout_marginLeft="20dp"
    android:layout_marginRight="20dp"/>

페이스북 로그인과 마찬가지로 카카오톡에서 제공하는 로그인 버튼을 추가해준다.

XML은 카카오톡 개발자 페이지에 있는 소스이다.

쿠키런 등의 게임에 처음 접속 했을 때 볼 수 있는 노란 버튼이다.

테스트 화면에 로그인 버튼을 확인할 수 있다.

이를 기반으로 로그인 동작을 수행하는 Class를 만들어보도록하자