[Kotlin] 페이스북 로그인 이용하기 (2020.08)

페이스북 로그인의 경우에는 Firebase와 연동할 수 있어 Analytic로 간편하게 활성 사용량 분석이 가능하다.

따라서 Firebase와 연동하는 페이스북 로그인을 구현해본다.

 

1. Facebook for Developer 설정

https://developers.facebook.com/apps/

위의 링크에서 새 앱 추가를 통해 페이스북 로그인을 위한 프로젝트를 생성한다.

표시할 앱 이름은 다른 앱들과 구분할 수 있는 임의의 프로젝트 이름을 입력하면되고,

앱 연락처 이메일에는 앱 복원 단계에서 연락을 받을 이메일을 입력한다.

단순히 로그인 기능만 구현하기 위해서는 비지니스 관리자 계정까지는 필요가 없다.

간단한 보안 확인 완료 후 제품 추가에서 Facebook 로그인을 선택한다.

앱의 플랫폼으로는 Android를 선택한 후, SDK는 다운받아도 되고, gradle로 설정을 해도 된다.

여기서는 gradle을 이용하기로 한다. (다운받지 않고 다음 버튼)

다음 과정은 Android의 AndroidManifest.xml에서 찾을 수 있으며, 패키지 이름에는 <manifest ... package="">를

기본 액티비티 클래스 이름은 패키지 이름 + <application android:name=""> 를 입력하면 된다. 

나의 경우는 Kakao SDK 초기화를 위해 GrobalApplication이라는 kotlin 파일을 만들어주었기 때문에 기본 액티비티 클래스 이름이 패키지 이름 + GlobalApplication이 된다.

개발 및 릴리즈 키 해시 추가를 위해서 아래의 함수를 사용한다.

fun printHashKey(context:Context): String? {

val TAG = "HASH_KEY"

var hashKey : String? = null

try {

val info : PackageInfo = context.packageManager().getPackageInfo(context.packageName, PackageManager.GET_SIGNATURES)

for (signature in info.signatures) {

var md : MessageDigest

md = MessageDigest.getInstance("SHA")

md.update(signature.toByteArray())

hashKey = String(Base64.encode(md.digest(), 0))

Log.d(TAG, hashKey)

}

} catch (e:Exception){

Log.e(TAG, e.toString())

}

return hashKey

}

MainActivity의 onCreate 함수에서 호출하면 손쉽게 해시키를 얻을 수 있다.

console(Run)창에 나타난 log에서 ctrl+f로 HASH_KEY를 검색하면 보다 쉽게 볼 수 있다.

위의 과정을 통해 얻은 해시 키를 개발 및 릴리즈 키 해시 추가에 복붙해주면 된다.

Android 알림에서 앱을 실행할 수 있도록 하는 앱에 대한 SSO 활성화는 선택과정이다.

2. Google Console에 App 수정

로그인 제공업체의 수정을 위해 Google 로그인에서 만들었던 Google Firebase 프로젝트로 접근한다.

(참고 : https://doqtqu.tistory.com/121)

개발>Authentication>Sign-in method>로그인 제공업체에 facebook을 눌러 사용 설정을 허용해준다. 

 

앱의 아이디와 비밀번호는 1번에서 작업했던 Facebook for Developer에서 가져올 수 있다.

https://developers.facebook.com/apps/

설정>기본설정에서 앱 ID와 앱 시크릿 코드가 각각 앱 ID와 앱 비밀번호에 해당한다.

3. Android 소스코드 수정

1-2번 과정에서 SDK를 다운받지 않고 넘어갔기 때문에 Facebook SDK 이용을 위해서는 Gradle 설정이 필요하다.

Facebook SDK를 사용하기 위해서는 Minimun SDK가 API 15: Android 4.0.3(IceCreamSandwich) 이상이어야 한다.

build.gradle(Project)의 buildscript { repositories {}} 섹션에 mavenCentral()가 있는지 확인한다. (없으면 추가)

build.gradle(Module:app)의 dependencies{} 에 implementation 'com.facebook.android:facebook-android-sdk:[5,6)' 를 추가한다.

res>values>string.xml에 아래와 같은 코드를 하나 추가해준다.

fb_login_protocol_scheme는 앱 Id 앞에 f를 붙인 값을 넣어준다.

<string name="facebook_app_id">[2번의 앱 Id]</string> <string name="fb_login_protocol_scheme">f[2번의 앱 Id]</string>

AndroidManifest.xml의 <application> 사이에 코드를 추가한다.

<meta-data android:name="com.facebook.sdk.ApplicationId" android:value="@string/facebook_app_id"/>

로그인을 위해서는 앱에서 인터넷 연결이 허용되어야 한다. 따라서 manifest에 아래와 같은 코드가 없으면 <application> 코드 밖에다 추가한다.

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

가한다.

아래의 코드를 Facebook 로그인 버튼이 있는 액티비티의 create 함수에서 호출하거나, Application을 상속받는 Activity의 create에 작성한다.

facebook 로그인 버튼 액티비티 or 상위 액티비티

FacebookSdk.setApplicationId(getString(R.string.facebook_app_id))

FacebookSdk.sdkInitialize(this)

if (BuildConfig.DEBUG) {

FacebookSdk.setIsDebugEnabled(true)

FacebookSdk.addLoggingBehavior(LoggingBehavior.INCLUDE_ACCESS_TOKENS)

}

로그인 버튼을 구현하는 방법에는 여러가지가 있는데, 그 중 가장 간편한 것은 페이스북에서 기본으로 지원하는 LoginButton을 이용하는 것이다. 이 방법은 api에 잘 설명되어 있으니 아래와 같은 Custom Button을 만들어본다.

UI 설정은 넘어가고 xml에서 Button을 하나 만들어준다. (id는 facebook_login으로 만들었음)

private val FB_SIGN_IN = 64206

private lateinit var loginManager: LoginManager

private lateinit var callbackManager:CallbackManager

.

.

.

// facebook login Activity create method

callbackManager = CallbackManager.Factory.create() // CallbackManager 초기화

val facebook_login = root.findViewById<Button>(R.id.facebook_login) // button resource get

facebook_login.setOnClickListener { // button의 clickListener 설정

loginManager = LoginManager.getInstance() // LoginManager instance 얻어오기

loginManager.logInWithReadPermissions( // 권한 설정하기(사용자의 어떤 항목을 조회할 수 있는지)

this,

Arrays.asList("public_profile", "email")

)

loginManager.registerCallback(callbackManager, object : // callback 등록

FacebookCallback<LoginResult> { // 파일로 따로 만들어도 되고, 내부 클래스로 구현해도 된다.록

override fun onSuccess(loginResult: LoginResult) { // 로그인 성공 시

Log.d(TAG, "facebook:onSuccess") 

handleFacebookAccessToken(loginResult.accessToken) // 아직 구현 X 에러 발생

}

override fun onCancel() { // 로그인 취소 시 

Log.d(TAG, "facebook:onCancel")

// ...

}

override fun onError(error: FacebookException) { // 로그인 에러 시

Log.d(TAG, "facebook:onError", error)

// ...

}

})

}

그리고 onActivityResult 함수를 override하여 callbackManager에 연결해준다.

override fun onActivityResult (requestCode: Int, resultCode: Int, data: Intent?) {

if (requestCode==FB_SIGN_IN){

callbackManager.onActivityResult(requestCode, resultCode, data);

}

super.onActivityResult(requestCode, resultCode, data)

}

위의 create 함수에서 호출한 handleFacebookAccessToken를 아래와 같이 구현해준다.

private fun handleFacebookAccessToken(token: AccessToken) {

Log.d(TAG, "handleFacebookAccessToken:$token")

val credential = FacebookAuthProvider.getCredential(token.token)

val auth = FirebaseAuth.getInstance()

     auth.signInWithCredential(credential)

.addOnCompleteListener(activity!!) { task ->

if (task.isSuccessful) {

// Sign in success, update UI with the signed-in user's information

Log.d(TAG, "signInWithCredential:success")

val user = auth.currentUser

user?.let {

Log.d(user.name, user.email, ... )

// Firebase 함수로 user 정보 호출 가능

}

} else {

// If sign in fails, display a message to the user.

Log.w(TAG, "signInWithCredential:failure", task.exception)

}

}

}

위의 과정을 통해서 Firebase와 Facebook을 연동한 로그인 구현이 가능하다.

.

.

.

+) 로그아웃 방법

로그아웃 버튼에 다음과 같은 소스코드를 추가한다.

val user:FirebaseUser? = FirebaseAuth.getInstance().currentUser

val accessToken:AccessToken = AccessToken.getCurrentAccessToken()

if(user!=null){

val isLoggedIn:Boolean = accessToken != null && !accessToken.isExpired

if(isLoggedIn){

FirebaseAuth.getInstance().signOut()

LoginManager.getInstance().logOut()

}

}

그리고 처음 로그인 시에만 다음과 같은 UI가 뜨고 두번째부터는 자동 로그인으로 넘어간다.

만약 로그인, 권한 확인 화면을 다시 확인하고 싶다면 

https://www.facebook.com/settings?tab=applications&section=active

에서 로그인 시 입력한 계정 정보로 로그인 후 설정>앱 및 웹사이트에서 활성화 된 해당 어플을 삭제해주면 된다.

참고자료 : https://developers.facebook.com/docs/facebook-login/android/?locale=ko_KR