본문 바로가기

Android

안드로이드 자바 카카오 로그인 API 예제 구현하기

maven { url 'https://devrepo.kakao.com/nexus/content/groups/public/' }

안드로이드 자바 카카오 로그인 API 예제 구현하기에 앞서

주의 사항 

 

사용에 앞서 Android SDK를 사용하기 위한 최소 요구 사양은 다음과 같습니다.

사용에 앞서 Android SDK를 사용하기 위한 최소 요구 사양은 다음과 같습니다.

 

 

 

그냥 따라하면 저절로 됩니다 

 

 

그런데 가상 애뮬레이터는 안 되는거 같음 ㅡㅡ 만약에 가상 안 되면

폰이랑 연결해서 하셈 

카카오 맵도 안 되더니 휴대폰이랑 애뮬레이터 연결하니까 되더라 빡침 ;;

 

 

https://developers.kakao.com/console/app

 

카카오계정

 

accounts.kakao.com

 

1. 계정 등록하기

카카오 계정에 들어가 (이미지 업로드 안 해도 댐)

3번째 해보는 것 이기 때문에 login3 (상관없음)

 

앱 이름 : login3 (상관없음)

사업자명 : login3  (상관없음)

카테고리도 그냥 테스트 하는 것이기 때문에 암거나 해도 (상관없음)

 

카카오 로그인만 연속 3번째 해보는 것 이기 때문에 login3으로 지었음 (상관없음)

 

저장 하면 아래 사진처럼 뜨는데 여기에 들어가 주자

 

 

 

아래 사진처럼

들어가면 아래처럼 뜨는데 네이티브 앱 키를 기억하자 쓸 때가 있다 

 

앱 설정 -> 요약 정보 -> 네이티브 앱 키를 기억

 

 

 

 

2. 카카오 로그인 활성화 & 동의항목 설정해주기

아래 사진을 보면

내 어플리케이션 -> 제품 설정 -> 카카오로그인 에 들어가 상태를 On으로 변경해주자 

 활성화를 눌러 주면 끗

그래야지 된다 

어플리케이션 -> 제품 설정 -> 카카오로그인 에 들어가 상태를 On으로 변경

 

 

아래 사진을 보고 

어플리케이션 -> 제품 설정 -> 카카오로그인 -> 동의항목에 들어가 필수 동의를 해준다

동의 목적은 테스트라고 적어 준다 

 

닉네임 , 프로필 사진 필수 동의하면 댐 

어플리케이션 -> 제품 설정 -> 카카오로그인 -> 동의항목 에 들어가 필수 동의 후 동의 목적은 테스트라고 적어 준다

 

 

 

3. 플랫폼 등록하기 그리고 키해시 넣기 

+ 키 해시 알아내는 법

키 해시(Key Hash)란 인증서(Certificate)의 인증서 지문 값(Certificate fingerprints)을 해시(hash)한 값으로,

악성 앱인지 판별하는 데 사용됩니다. 카카오 API를 호출하면 카카오 API 서버가 요청 헤더에 추가된

키 해시값과 카카오 플랫폼에 등록한 값이 일치하는지 확인합니다. 키 해시는 디버그 키 해시(Debug key hash)와

릴리즈 키 해시(Release key hash) 두 가지가 있습니다.

  • 디버그 키 해시: 프로젝트를 처음 생성하거나 디버그할 때, 안드로이드 스튜디오에서 개발 환경에 맞게 자동으로 생성되는 디버그 인증서 에서 해시(hash)한 값입니다.
  • 릴리즈 키 해시: 앱 스토어에 앱을 배포하기 위해 생성한 릴리즈 인증서로부터 해시한 값입니다.

공식 홈페이지에서는 키 해시를 알아내기 위한 3가지의 방법이 있으나 2번쨰 방법인 kakao SDK를 이용하는 방법을

사용하겠습니다.

1. 터미널을 이용해 티버그, 릴리즈 키 해시 생성하기

2. kakao SDK를 이용해 디버그, 릴리즈 키 해시 확인하기

3. google play console에서 릴리즈 키 해시 구하기.

 

카카오 로그인만 하면 되기에 필요할 때 보셈

 

MainActivity 클래스

밑에 코드 복사 붙여넣기 

import android.content.pm.PackageInfo;
import android.content.pm.PackageManager;
import android.os.Bundle;
import android.content.pm.Signature;
import android.util.Base64;
import android.util.Log;

import java.security.MessageDigest;
import java.security.NoSuchAlgorithmException;

public class MainActivity extends AppCompatActivity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        PackageInfo packageInfo = null;
        try {
            packageInfo = getPackageManager().getPackageInfo(getPackageName(), PackageManager.GET_SIGNATURES);
        } catch (PackageManager.NameNotFoundException e) {
            e.printStackTrace();
        }
        if (packageInfo == null)
            Log.e("KeyHash", "KeyHash:null");

        for (Signature signature : packageInfo.signatures) {
            try {
                MessageDigest md = MessageDigest.getInstance("SHA");
                md.update(signature.toByteArray());
                Log.d("KeyHash", Base64.encodeToString(md.digest(), Base64.DEFAULT));
            } catch (NoSuchAlgorithmException e) {
                Log.e("KeyHash", "Unable to get MessageDigest. signature=" + signature, e);
            }
        }


    }
}

 

작성한 후 앱을 실행시켜주자

 

 위와 같이 코드를 작성하고 프로젝트를 실행하게 되면 로그를 통해 해시 값을 획득 가능

이때 획득한 키 해시를 플랫폼 작성칸에 입력해버렷ㄱ

 

키 해시 알아내는 법

 

 

 

내 어플리케이션 -> 앱설정 -> 플랫폼 으로 들어가 플랫폼을 설정

Android 플랫폼으로 설정해줘야 합니다

아래의 사진처럼 본인의 프로젝트명을 입력하고 아까 구한 키해시를 입력해주자

 

 

다음은 패키지명 알아내는 법이다 

패키지명도 해시키도 넣어줘야 카카오 로그인이 되기 떄문에 무조건 넣어주자 

패키지명 알아내는 법
내 어플리케이션 -> 앱설정 -> 플랫폼 으로 들어가 플랫폼을 설정한다 그리고  본인의 프로젝트명을 입력하고 키해시를 입력하자

 

 

 

 

4. 그래들 , 매니페스트  , 클래스에서 초기화해주기

+그래들 설정 

아래 사진 처럼 build.gradle  그래들 추가 해주기 

implementation "com.kakao.sdk:v2-user:2.19.0" // 카카오 로그인
implementation "com.kakao.sdk:v2-cert:2.19.0" // 카카오 인증서비스

implementation "com.github.bumptech.glide:glide:4.13.0"// 오픈소스 이미지 핸들링할 때 많이 사용되는 글라이드

 

build.gradle  그래들 설정해주기

 

 

settings.gradle 그래들 추가 해주기 

maven { url 'https://devrepo.kakao.com/nexus/content/groups/public/' }

settings.gradle 그래들 설정해주기

 

+ 매니페스트  설정 

 

매니페스트에서 <application를 기준으로 바로 위에 인터넷 사용 권한 설정 추가

<!-- 인터넷 사용 권한 설정 추가 -->
<uses-permission android:name="android.permission.INTERNET" />

 

 

매니페스트에서 <application를 기준으로 바로 아래에 코드 추가

android:name=".KakaoApplication"

 

매니페스트에서 이 코드 밑에 

    <application
        android:name=".KakaoApplication"    
        android:allowBackup="true"
        android:dataExtractionRules="@xml/data_extraction_rules"
        android:fullBackupContent="@xml/backup_rules"
        android:icon="@mipmap/ic_launcher"
        android:label="@string/app_name"
        android:roundIcon="@mipmap/ic_launcher_round"
        android:supportsRtl="true"
        android:theme="@style/Theme.Kakao_login"
        tools:targetApi="31">
        <activity
            android:name=".MainActivity"
            android:exported="false" />

        <activity
            android:name=".KakaoLogin"
            android:exported="true" >
            <intent-filter>
                <action android:name="android.intent.action.MAIN" />
                <category android:name="android.intent.category.LAUNCHER" />
            </intent-filter>
        </activity>

 

 

아래 코드 추가해 준다 

 

아까 기억해준 네이티브 앱 키는 andorid:scheme에 들어가는 string 값이다 

kakao+ 네이티브앱키로 넣어주면 된다 EX -> kakao+1네2이3티4브4앱5키 

<!-- 여기서 부터 밑에 까지 전체 추가해주세요 추가-->
       <activity android:name="com.kakao.sdk.auth.AuthCodeHandlerActivity"
            android:exported="true">
            <intent-filter>
                <action android:name="android.intent.action.VIEW" />
                <category android:name="android.intent.category.DEFAULT" />
                <category android:name="android.intent.category.BROWSABLE" />

                <data android:host="oauth"
                    android:scheme="kakaoeb9903d80315be6042933ea840f8294d" />
            </intent-filter>
        </activity>

위 3개를 다 넣으면 이렇게 되어야 함 

       <!-- 인터넷 사용 권한 설정 추가 -->
    <uses-permission android:name="android.permission.INTERNET" />
   
   <application
        android:name=".KakaoApplication"
        android:allowBackup="true"
        android:dataExtractionRules="@xml/data_extraction_rules"
        android:fullBackupContent="@xml/backup_rules"
        android:icon="@mipmap/ic_launcher"
        android:label="@string/app_name"
        android:roundIcon="@mipmap/ic_launcher_round"
        android:supportsRtl="true"
        android:theme="@style/Theme.Kakao_login"
        tools:targetApi="31">
        <activity
            android:name=".MainActivity"
            android:exported="false" />

        <activity
            android:name=".KakaoLogin"
            android:exported="true" >
            <intent-filter>
                <action android:name="android.intent.action.MAIN" />
                <category android:name="android.intent.category.LAUNCHER" />
            </intent-filter>
        </activity>


       <!-- 여기서 부터 밑에 까지 전체 추가해주세요 추가-->
       <activity android:name="com.kakao.sdk.auth.AuthCodeHandlerActivity"
            android:exported="true">
            <intent-filter>
                <action android:name="android.intent.action.VIEW" />
                <category android:name="android.intent.category.DEFAULT" />
                <category android:name="android.intent.category.BROWSABLE" />

                <data android:host="oauth"
                    android:scheme="kakaoeb9903d80315be6042933ea840f8294d" />
            </intent-filter>
        </activity>

 

 

+ 클래스 및 레이아웃  설정 

 

레이아웃과 함께 클래스를 만들자 

클래스 이름은 KakaoLogin

import android.os.Bundle;
import android.util.Log;
import android.view.View;
import android.widget.ImageView;
import android.widget.TextView;

import androidx.appcompat.app.AppCompatActivity;

import com.bumptech.glide.Glide;
import com.kakao.sdk.auth.model.OAuthToken;
import com.kakao.sdk.user.UserApiClient;
import com.kakao.sdk.user.model.User;

import kotlin.Unit;
import kotlin.jvm.functions.Function1;
import kotlin.jvm.functions.Function2;

public class KakaoLogin extends AppCompatActivity {

private static final String TAG = "KakaoLogin";
private View loginButton, logoutButton;
private TextView nickName;
private ImageView profileImage;

@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_kakao_login);

loginButton = findViewById(R.id.login);
logoutButton = findViewById(R.id.logout);
nickName = findViewById(R.id.nickname);
profileImage = findViewById(R.id.profile);

// 카카오톡이 설치되어 있는지 확인하는 메서드 , 카카오에서 제공함. 콜백 객체를 이용합.
Function2<OAuthToken,Throwable,Unit> callback =new Function2<OAuthToken, Throwable, Unit>() {
@Override
// 콜백 메서드 ,
public Unit invoke(OAuthToken oAuthToken, Throwable throwable) {
Log.e(TAG,"CallBack Method");
//oAuthToken != null 이라면 로그인 성공
if(oAuthToken!=null){
// 토큰이 전달된다면 로그인이 성공한 것이고 토큰이 전달되지 않으면 로그인 실패한다.
updateKakaoLoginUi();

}else {
//로그인 실패
Log.e(TAG, "invoke: login fail" );
}

return null;
}
};

// 로그인 버튼 클릭 리스너
loginButton.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {

// 해당 기기에 카카오톡이 설치되어 있는 확인
if(UserApiClient.getInstance().isKakaoTalkLoginAvailable(KakaoLogin.this)){
UserApiClient.getInstance().loginWithKakaoTalk(KakaoLogin.this, callback);
}else{
// 카카오톡이 설치되어 있지 않다면
UserApiClient.getInstance().loginWithKakaoAccount(KakaoLogin.this, callback);
}
}
});

// 로그아읏 버튼
logoutButton.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
UserApiClient.getInstance().logout(new Function1<Throwable, Unit>() {
@Override
public Unit invoke(Throwable throwable) {
updateKakaoLoginUi();
return null;
}
});
}
});

updateKakaoLoginUi();
}

private void updateKakaoLoginUi() {

// 로그인 여부에 따른 UI 설정
UserApiClient.getInstance().me(new Function2<User, Throwable, Unit>() {
@Override
public Unit invoke(User user, Throwable throwable) {

if (user != null) {

// 유저의 아이디
Log.d(TAG, "invoke: id =" + user.getId());
// 유저의 이메일
Log.d(TAG, "invoke: email =" + user.getKakaoAccount().getEmail());
// 유저의 닉네임
Log.d(TAG, "invoke: nickname =" + user.getKakaoAccount().getProfile().getNickname());
// 유저의 성별
Log.d(TAG, "invoke: gender =" + user.getKakaoAccount().getGender());
// 유저의 연령대
Log.d(TAG, "invoke: age=" + user.getKakaoAccount().getAgeRange());


// 유저 닉네임 세팅해주기
nickName.setText(user.getKakaoAccount().getProfile().getNickname());
// 유저 프로필 사진 세팅해주기
Glide.with(profileImage).load(user.getKakaoAccount().getProfile().getThumbnailImageUrl()).circleCrop().into(profileImage);
Log.d(TAG, "invoke: profile = "+user.getKakaoAccount().getProfile().getThumbnailImageUrl());

// 로그인이 되어있으면
loginButton.setVisibility(View.GONE);
logoutButton.setVisibility(View.VISIBLE);
} else {
// 로그인 되어있지 않으면
nickName.setText(null);
profileImage.setImageBitmap(null);

loginButton.setVisibility(View.VISIBLE);
logoutButton.setVisibility(View.GONE);
}
return null;
}
});
}
}

 

 

 

먼저 (문서> 유용한 참고 정보 > 디자인 가이드) 로 가서 카카오 버튼 이미지를 다운받아 준다 

 

https://developers.kakao.com/docs/latest/ko/reference/design-guide

 

Kakao Developers

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

developers.kakao.com

 

 

밑에 이미지 그냥 다운해서 쓰면 되나? 잘 모르겠네 

kakao_login_medium_narrow

 

본인이 사용하고 싶은 언어, 크기, 너비를 설정 후 이미지를 다운로드하여 드로우블 파일에 넣어줍니다.

드로우블 파일에 넣어줍니다.
본인이 사용하고 싶은 언어, 크기, 너비를 설정 후 이미지를 다운로드하여 드로 우블 파일에 넣어줍니다.

 

 

 

 

 

activity_kakao_login.xml

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".KakaoLogin"
android:orientation="vertical">


<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:gravity="center"
android:orientation="vertical">

<ImageView
android:id="@+id/profile"
android:layout_width="200dp"
android:layout_height="200dp"
/>

<TextView
android:id="@+id/nickname"
android:textSize="20sp"
android:textColor="@color/black"

android:layout_width="wrap_content"
android:layout_height="wrap_content"/>

</LinearLayout>


<ImageView
android:id="@+id/login"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:src="@drawable/kakao_login_medium_narrow"
android:layout_marginBottom="30dp"
/>


<Button
android:id="@+id/logout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="로그아웃"
android:visibility="gone"
/>



</LinearLayout>

 

 

클래스 이름  KakaoApplication  

네이티브 앱 키 여기에도 넣어줍니다 

import android.app.Application;

import com.kakao.sdk.common.KakaoSdk;

public class KakaoApplication extends Application {
private static KakaoApplication instance;

@Override
public void onCreate() {
super.onCreate();
KakaoSdk.init(this,"NATIVE_APP_KEY");
}
}

 

 

이제 제가 만든 앱을 실행시켜보도록 하겠습니다.

만든 앱 실행 화면

 

 

아래 사진처럼 뜬다면 

여러분은 체크박스 동의하시고 로그인하시면 됩니다.

자 이제 Continue를 클릭해보겠습니다.

여러분은 체크박스 동의하시고 로그인하시면 됩니다.

 

 

자 이렇게 카카오에서 받은&nbsp;프로필 사진과 이름을 띄울 수 있었습니다.

자 이렇게 카카오에서 받은 프로필 사진과 이름을 띄울 수 있었습니다.

 

 

 

나 친절하게 만든 듯 인정?

제가 힘들게 로그인 성공시켜서 다른 분들은 편하게 했음 하네요 

편하게 안 되면 댓글 주세요 

 

좋은 하루 

 

좋하 ~