[Android] Facebook 로그인(1) 셋팅 in Kotlin

[Android] Facebook 로그인(1) 셋팅 in Kotlin

1. 페이스북 앱 만들기

페이스북 로그인을 구현하기 위해서는 Meta for Developers페이지에서 개발자 계정으로 페이스북 앱을 만들어야 한다.

페이스북 앱 만들기 과정은 간단하니 아래 과정을 천천히 따라하면 된다.

1. 앱 만들기

Meta for Developers에 접속하여 먼저 로그인을 한다.

그리고 아래 이미지에서와 같이 오른쪽 상단 [내 앱]으로 접속한다.

그러면 다음 이미지처럼 내 앱의 목록과 [앱 만들기] 버튼을 확인할 수 있다.

기존에 만든 앱을 사용할 수 있지만, 새로운 앱을 만들어 사용하도록 한다.

[앱 만들기] 버튼을 클릭한다.

2. 앱 유형 입력

아래와 같은 앱 유형 선택 화면에서는 페이스북 로그인을 위한 간단한 앱이기 때문에, [없음]을 선택한다.

3. 앱 상세정보 입력

다음으로는 앱 상세 정보를 입력한다.

[앱 이름], [앱 연락처 이메일]에 정보를 입력하고 [비지니스 계정]은 특별히 작성할 필요는 없다.

4. 앱 상세 이동

다시 개발제 폐이지로 이동하여 [내 앱]을 클릭한다.

그러면 다음과 같이 위 과정에 생성한 앱을 확인할 수 있다.

해당 앱을 클릭하여 앱 대시보드로 이동한다.

5. 페이스북 로그인 설정

아래 이미지처럼 만든 앱에 대한 대시정보를 확인할 수 있다.

[제품 추가] 카테고리에서 [Facebook 로그인] > [설정]으로 이동한다.

그리고 [Android]을 선택해준다.

2. Facebook SDK 등록

페이스북 로그인을 사용할 프로젝트에 Facebook SDK를 등록한다.

1. 프로젝트에서 build.gradle(Project:..) 또는 settings.gradle에서 다음과 같이 repositories {} 섹션에 mavenCentral() 저장소가 입력되어 있는지 확인한다.

   pluginManagement {
    repositories {
        gradlePluginPortal()
        google()
        mavenCentral()
    }
   }
   dependencyResolutionManagement {
    repositoriesMode.set(RepositoriesMode.FAIL_ON_PROJECT_REPOS)
    repositories {
        google()
        mavenCentral()
    }
   }
   rootProject.name = "FbLoginWebViewSample"
   include ':app'
   

2. 프로젝트에서 `build.gradle(Module:..)`에서 `dependencies{}` 섹션에 ` implementation 'com.facebook.android:facebook-login:latest.release'
` 구현문을 추가하여 최신 버전의 Facebook 로그인 SDK 종속성을 추가한다. [최신버전확인](https://developers.facebook.com/docs/android/)
``` kotlin

dependencies {
    ...
    // Facebook Login SDK
    implementation 'com.facebook.android:facebook-login:15.1.0'
}

3. 리소스 및 Manifest 설정

1. /app/res/values/strings.xml에 다음과 같이 문자열을 저장한다.

    <string name="facebook_app_id">534473875260631</string>
    <string name="fb_login_protocol_scheme">fb1234</string>
    <string name="facebook_client_token">de63a367348bba44f51fbf1ae48ce9d2</string>

각각의 정보는 아래 이미지처럼 페이스북 개발자 계정으로 만든 앱의 [설정] > [고급 설정]에서 확인할 수 있다.

2. /app/manifest/AndroidManifest.xml설정
   2.1. meta-data 요소를 앱 ID와 클라이언트 토큰을 application 요소에 다음과 같이 추가한다.

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

   2.2. Facebook Login 관련 Activity와 Chrome Custom Tab 관련 Activity를 추가한다.

    <application ...>
        <activity android:name="com.facebook.FacebookActivity"
            android:configChanges=
                    "keyboard|keyboardHidden|screenLayout|screenSize|orientation"
            android:label="@string/app_name" />
        <activity
            android:name="com.facebook.CustomTabActivity"
            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:scheme="@string/fb_login_protocol_scheme" />
            </intent-filter>
        </activity>
    </applicaton>

   2.3. 인터넷 권한 설정을 추가한다.

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

이렇게 리소스 및 Manifest를 설정하고 앱을 빌드해본다.

4. 패키지 이름 및 기본 Activity, 페이스북 앱과 연결

1. 프로젝트의 패키지 이름을 등록한다.
   프로젝트 패키지 이름과 Activity를 등록하기 위해서는 [페이스북 앱] > [설정] > [기본 설정] 에서 아래와 같이 + 플랫폼 추가 버튼을 이용하여 Google Play를 추가한다.

프로젝트에서 AndroidManifest.xml에서 <manifest package="..."/> package를 가져와 다음과 같이 저장한다.

그리고 앱 시작의 기본 Activity인 MainActivity를 패키지명 뒤에 붙여 저장한다.

5. 개발용(디버그) 해시 키 등록

안드로이드 앱과 Facebook 간의 통신의 진실성 보장을 위해 개발 환경(ex. Android Studio)에 대한 Android 키 해시를 제공해야한다.

개발(디버그) 키 해시 생성을 위해서는 개발 환경의 운영체제에 따라 다음과 같다.

[Mac OS]

• Java Development Kit의 키 및 인증 관리 도구인 Keytool이 필요하다.
• 개발(디버그) 키 해시 생성을 위해서는 Android Studio에서 터미널 창을 열고 다음 명령어를 입력하여 실행한다.

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

[Windows]

• Java Development Kit의 키 및 인증 관리 도구 Keytool이 필요하다.
• Google Code Archive의 Windows용 OpenSSL 라이브러리 openssl-for-windows가 필요하다.
• 개발 키 해시 생성을 위해서는 Android Studio에서 터미널 창을 열고 다음 명령어를 입력하여 실행한다.

keytool -exportcert -alias androiddebugkey -keystore "C:\Users\USERNAME\.android\debug.keystore" | "PATH_TO_OPENSSL_LIBRARY\bin\openssl" sha1 -binary | "PATH_TO_OPENSSL_LIBRARY\bin\openssl" base64     

명령어를 실행하면 개발 환경에 고유한 28자 키 해시가 생성된다.

생성된 해시를 복사하여 다음과 같이 페이스북 앱 [설정] > [기본 설정]에서 [Android] > [키 해시]에 등록한다.