[Android / Kotlin] SNS(카카오)로그인

이번에는 Kakao Developers에서 카카오 로그인 api를 활용하여 로그인 기능을 구현해 보겠습니다.

https://developers.kakao.com/

Kakao Developers

 

1.카카오 설정

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

카카오계정

위 링크에 들어가 카카오 계정으로 로그인 후 애플리케이션 추가하기를 눌러 카카오 로그인 api를 사용할 애플리케이션을 등록한다.

앱이름과 사업자명 등록 후 서비스 이용 약관에 동의한 후 확인 버튼을 누르게 되면 프로젝트 생성이 완료된다.

그 후 좌측 메뉴에 내 어플리케이션 > 앱설정 > 플랫폼에 들어가서 Android플랫폼 등록 클릭

 

패키지명(AndroidMainfest에서 확인 가능합니다.)과 위에서 추출한 해시키를 등록해 줍니다.

마켓 URL은 추후 앱 등록 후 추가해 주셔도 됩니다.

키 해시 부분은 안드로이드 코드상에서

import androidx.appcompat.app.AppCompatActivity
import android.os.Bundle
import android.util.Log
import com.kakao.sdk.common.util.Utility

class MainActivity : AppCompatActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)
        
        val keyHash = Utility.getKeyHash(this)
        Log.d("Hash", keyHash)

    }
}

위 처럼 코드를 작성하고 실행을 하면 로그에 키 해시가 나오게 되는데 그 키 해시를 적어주시면 됩니다.

 

내 어플리케이션 > 앱 설정 > 요약 정보 에서 [네이티브 앱 키]를 복사해줍니다.

프로젝트 마다 키가 다르며, 중요한 정보이므로 외부에 유출 되지 않게 관리하여 줍니다.

 

2. 앱 설정

1. Gradle

build.gradle(Module)

implementation "com.kakao.sdk:v2-user:2.0.1"

카카오 모듈을 추가해 줍니다.

 

2. mainfest.xml

mainfests -> AndroidMainfest.xml

<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools">
    <uses-permission android:name="android.permission.INTERNET" />
    <application
        android:name=".Application"
        android:allowBackup="true"
        ....

   <uses-permission android:name="android.permission.INTERNET" />

인터넷 권한을 추가해 줍니다.

 <activity android:name="com.kakao.sdk.auth.AuthCodeHandlerActivity">
            <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="kakao네이티브 앱 키" />
            </intent-filter>
        </activity>

data scheme 부분에 네이티브 앱 키는 프로젝트 적용 시점에 나와있는 네이티브 앱키를 사용하시면 됩니다.

ex) android:scheme="kakaoed66testtesttest"

 

3.코드

1. Application

import android.app.Application
import com.kakao.sdk.common.KakaoSdk

class Application : Application() {
    override fun onCreate() {
        super.onCreate()

        KakaoSdk.init(this, "네이티브 앱 키")
    }
}

여기서 네이티브 앱키는 위에 프로젝트 설정 부분 네이티브 앱 키를 그대로 복사 붙여넣기 해주시면 됩니다.

ex) KakaoSdk.init(this, "ed66testtesttest")

 

2. activity_login.xml

<?xml version="1.0" encoding="utf-8"?>
<layout xmlns:tools="http://schemas.android.com/tools">
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    xmlns:app="http://schemas.android.com/apk/res-auto">

    <LinearLayout
        android:layout_alignParentBottom="true"
        android:layout_width="match_parent"
        android:orientation="vertical"
        android:layout_height="wrap_content">
    <ImageButton
        android:id="@+id/kakao_login_button"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="@android:color/transparent"
        android:src="@drawable/kakao_login_medium_wide"/>


    <com.google.android.gms.common.SignInButton
        android:id="@+id/googleLoginBT"
        android:layout_marginTop="10dp"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginStart="55dp"
        android:layout_marginEnd="60dp"/>

    </LinearLayout>


</RelativeLayout>
</layout>

https://developers.kakao.com/tool/resource/login

Kakao Developers

위 사이트에 들어가면 카카오 버튼을 다운로드 할수 있습니다.

로그인 버튼 다운로드 후 xml구성을 해주시면 됩니다.

 

3. LoginActivity

import android.content.Intent
import androidx.appcompat.app.AppCompatActivity
import android.os.Bundle
import android.util.Log
import android.widget.ImageButton
import android.widget.Toast
import com.kakao.sdk.auth.LoginClient
import com.kakao.sdk.auth.model.OAuthToken
import com.kakao.sdk.common.util.Utility
import com.kakao.sdk.common.model.AuthErrorCause.*
import com.kakao.sdk.user.UserApiClient

class LoginActivity : AppCompatActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)

        // 로그인 정보 확인
        UserApiClient.instance.accessTokenInfo { tokenInfo, error ->
            if (error != null) {
                Toast.makeText(this, "토큰 실패", Toast.LENGTH_SHORT).show()
            }
            else if (tokenInfo != null) {
                Toast.makeText(this, "토큰 성공", Toast.LENGTH_SHORT).show()
                val intent = Intent(this, SecondActivity::class.java)
                startActivity(intent.addFlags(Intent.FLAG_ACTIVITY_CLEAR_TOP))
                finish()
            }
        }

		//로그인버튼
        val kakao_login_button = findViewById<ImageButton>(R.id.kakao_login_button)
        kakao_login_button.setOnClickListener {
            if(LoginClient.instance.isKakaoTalkLoginAvailable(this)){
                LoginClient.instance.loginWithKakaoTalk(this, callback = callback)
            }else{
                LoginClient.instance.loginWithKakaoAccount(this, callback = callback)
            }
        }

		//로그인 callBack
        val callback: (OAuthToken?, Throwable?) -> Unit = { token, error ->
            if (error != null) {
                when {
                    error.toString() == AccessDenied.toString() -> {
                        Toast.makeText(this, "접근이 거부 됨(동의 취소)", Toast.LENGTH_SHORT).show()
                    }
                    error.toString() == InvalidClient.toString() -> {
                        Toast.makeText(this, "유효하지 않은 앱", Toast.LENGTH_SHORT).show()
                    }
                    error.toString() == InvalidGrant.toString() -> {
                        Toast.makeText(this, "인증 수단이 유효하지 않아 인증할 수 없는 상태", Toast.LENGTH_SHORT).show()
                    }
                    error.toString() == InvalidRequest.toString() -> {
                        Toast.makeText(this, "요청 파라미터 오류", Toast.LENGTH_SHORT).show()
                    }
                    error.toString() == InvalidScope.toString() -> {
                        Toast.makeText(this, "유효하지 않은 scope ID", Toast.LENGTH_SHORT).show()
                    }
                    error.toString() == Misconfigured.toString() -> {
                        Toast.makeText(this, "설정이 올바르지 않음(android key hash)", Toast.LENGTH_SHORT).show()
                    }
                    error.toString() == ServerError.toString() -> {
                        Toast.makeText(this, "서버 내부 에러", Toast.LENGTH_SHORT).show()
                    }
                    error.toString() == Unauthorized.toString() -> {
                        Toast.makeText(this, "앱이 요청 권한이 없음", Toast.LENGTH_SHORT).show()
                    }
                    else -> { // Unknown
                        Toast.makeText(this, "기타 에러", Toast.LENGTH_SHORT).show()
                    }
                }
            }
            else if (token != null) {
                Toast.makeText(this, "로그인에 성공하였습니다.", Toast.LENGTH_SHORT).show()
                val intent = Intent(this, SecondActivity::class.java)
                startActivity(intent.addFlags(Intent.FLAG_ACTIVITY_CLEAR_TOP))
                finish()
            }
        }

    }

}

코드상세

Activity를 실행 후 토큰값이 있는지 없는지 여부를 통하여 토근값이 있으면 다음 프로세스 실행(현재는 startActivity)해줍니다.

  // 로그인 정보 확인
        UserApiClient.instance.accessTokenInfo { tokenInfo, error ->
            if (error != null) {
                Toast.makeText(this, "토큰 실패", Toast.LENGTH_SHORT).show()
            }
            else if (tokenInfo != null) {
                Toast.makeText(this, "토큰 성공", Toast.LENGTH_SHORT).show()
                val intent = Intent(this, SecondActivity::class.java)
                startActivity(intent.addFlags(Intent.FLAG_ACTIVITY_CLEAR_TOP))
                finish()
            }
        }

로그인 버튼 클릭 시 카카오톡이 설치 되어있는지 여부를 판단하여 카카톡을 실행하거나, 웹페이지로 로그인 창을 띄워줍니다.

로그인 실행은 callBack을 실행하여 오류가 있을경우 오류 토스트를 띄워주며, 토큰값이 null이 아니면 로그인 성공으로 판단 하여, 다음 프로세스를 실행하여 줍니다.