AWS Amplify로 Android 로그인 회원가입 10분만에 구현하기 - 2

아래 과정을 진행하기 위해서는 AWS계정과 안드로이드 개발 환경이 준비되어 있어야 합니다.

 

이 전 포스트에 이어 Android 앱에 aws amplify를 적용하는 과정을 보여드리겠습니다.👩‍🔧

이 포스트는 Android 앱 안에서만의 설정을 다루고 있으므로 나머지 설정은 1편을 참고해주세요!

 

 

2020/10/15 - [안드로이드 프로젝트 함께하기] - AWS Amplify로 Android 로그인 회원가입 10분만에 구현하기 - 1

AWS Amplify로 Android 로그인 회원가입 10분만에 구현하기 - 1

전체 프로젝트를 바로 보고 싶으시다면 깃헙 링크를 참고해주세요.

 

---

gradle 설정

1. 안드로이드 새 프로젝트를 생성하고 app 레벨의 build.gradle 파일에 아래 dependencies를 추가해줍니다.

implementation('com.amazonaws:aws-android-sdk-mobile-client:2.8.+@aar') { transitive = true }
implementation('com.amazonaws:aws-android-sdk-auth-userpools:2.8.+@aar') { transitive = true }
implementation('com.amazonaws:aws-android-sdk-auth-ui:2.8.+@aar') { transitive = true }

 

    2. 같은 파일에서 최소 sdk를 23으로 올려줍니다.

minSdkVersion 23

 

최소 sdk 버전이 23 미만일 경우 Run/Debug Configuration에서 아래와 같이 Default Acitivity not found 에러가 나게 되며 빌드를 할 수 없게됩니다.

실제 파일은 build.gradle 이 링크를 참고하세요!

 

---

 

AndroidManifest.xml에서 권한 설정

     3. AndroidManifest.xml 파일에 아래 두 권한을 추가해줍니다.

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

다행히 위 두 권한은 사용자에게 요청하여 받아야 하는 권한이 아니기 때문에 AndroidManifest에 추가 외에 다른 작업이 필요하지 않습니다.

 

역시 실제 파일은 AndroidManifest.xml 을 참고하세요. (단, 이후 과정도 완료한 파일이기 때문에 현재 파일과 상태가 다릅니다.)

 

---

 

AuthenticationAcitivity.java 추가

    4. Amplify가 제공하는 화면들을 보여주기 위해 빈 화면이 하나 필요합니다.

 

이를 위해 첫 번째로 app/src/main/res/layout/activity_authentication.xml을 추가해줍니다.

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout
	xmlns:android="http://schemas.android.com/apk/res/android"
	xmlns:tools="http://schemas.android.com/tools"
	xmlns:app="http://schemas.android.com/apk/res-auto"
	android:layout_width="match_parent"
	android:layout_height="match_parent"
	tools:context=".AuthenticationActivity">
</androidx.constraintlayout.widget.ConstraintLayout>

Amplify가 뷰를 그려주기 때문에 레이아웃 파일에 따로 설정해주어야 할 건 없습니다. 때문에 루트 레이아웃만을 두었습니다.

 

 

    5. 로그인 로직을 넣어 줄 AuthenticationActivity.java 파일을 생성해줍니다.

package com.example.yebon.amplify_login_android

import androidx.appcompat.app.AppCompatActivity
import android.os.Bundle
import android.content.Intent
import com.amazonaws.mobile.client.*

class AuthenticationActivity : AppCompatActivity() {

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_authentication)

        AWSMobileClient.getInstance().initialize(this, object: Callback<UserStateDetails>{
            override fun onResult(result: UserStateDetails?) {
                when (result?.getUserState()) {
                    UserState.SIGNED_IN -> {
                        val i = Intent(this@AuthenticationActivity, MainActivity::class.java)
                        startActivity(i)
                    }
                    UserState.SIGNED_OUT -> showSignIn()
                    else -> {
                        AWSMobileClient.getInstance().signOut()
                        showSignIn()
                    }
                }
            }

            override fun onError(e: java.lang.Exception?) {
                e?.printStackTrace()
            }
        })
    }

    private fun showSignIn() {
        try {
            AWSMobileClient.getInstance().showSignIn(this,
                SignInUIOptions.builder().nextActivity(MainActivity::class.java).build());
        } catch (e: Exception) {
            e.printStackTrace()
        }
    }
}

위 소스를 간단히 보면 AWSMobileClient를 initialize할 때 넘기는 콜백을 통해 로그인(sign in)이 되었을 때와 로그아웃 되었을 때의 상태 별로 각각 대응해주고 있는 것을 알 수 있습니다.

 

• UserState.SIGNED_IN : 이미 로그인이 되어있을 때 MainActivity로 이동합니다.

• UserState.SIGNED_OUT : 로그인 되어있지 않을 때 로그인 페이지로 이합니다.

마지막으로 showSignIn 함수를 통해 로그인 화면을 띄워주고 로그인이 성공했을 때 MainActivity로 보낸다는 것을 알 수 있습니다.

 

 

    6. AndroidManifestm.xml에 AuthenticationActivity.xml을 추가해줍니다.

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

저는 로그인 화면을 가장 먼저 띄워주기 위해 AuthenticationActivity를 intent-filter를 통해 Main으로 잡았습니다. 따라서 기존의 MainActivity 의 Main action은 제거하였습니다.

 

또 ActionBar제거를 위해 Application Theme를 아래와 같이 바꾸었습니다. 아래 설정은 선호에 따라 함께 하셔도, 스킵하셔도 좋습니다.

android:theme="@style/Theme.AppCompat.Light.NoActionBar"

 

실제 파일은 AndroidManifest.xml 을 참고하세요!

---

위 작업을 통해 안드로이드에서 해주어야 할 작업이 완료되었습니다.🎉🎉🎉

위 작업을 완료하면 아래와 같은 화면들을 볼 수 있습니다.

 

email vailidation, 중복 검사 등 다양한 기능들을 제공해주는 것을 알 수 있습니다.🥳

 

다음 포스팅에서는 Amplify ui customizing 등 더 자세한 내용을 알아보도록 하겠습니다.😙