[안드로이드] 파이어베이스 / 로그인 만들기

https://github.com/lnjky/fashion_people

GitHub - lnjky/fashion_people: 패션 추천 어플

코드 전체를 보려면 위에 링크를 통해 확인할 수 있습니다.

---

이번에는 파이어베이스의 파이어스토어 / Authentication을 통해 로그인을 만들어 보려고 한다.

회원가입에 대한 내용은 아래의 링크를 통해 확인할 수 있다.

https://loasd.tistory.com/59

[안드로이드] 파이어베이스 / 회원가입 만들기

---

먼저 XML파일을 보도록 하자.

먼저 이렇게 XML을 만들었다.

이메일, 패스워드를 입력받아 로그인을 할 수 있게 하고 회원가입 버튼을 누르면 회원가입 화면으로 전환된다.

또한 아이디 기억하기를 체크해두면 다음에 로그인할 때 아이디를 기억하게 하려고 체크박스를 두었다.

 

전체 XML은 이렇다.

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout 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"
    android:background="#B388FF"
    tools:context=".LoginActivity">

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="패플"
        android:textSize="45dp"
        android:textColor="@color/black"
        app:layout_constraintBottom_toTopOf="@+id/et_login_id"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHorizontal_bias="0.49"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintVertical_bias="0.668"
        android:fontFamily="@font/koreanah1_r"></TextView>

    <Button
        android:id="@+id/btn_login"
        android:layout_width="230dp"
        android:layout_height="35dp"
        android:layout_marginTop="52dp"
        android:background="@drawable/button_round"
        android:foreground="?attr/selectableItemBackgroundBorderless"
        android:text="로그인"
        android:textAllCaps="false"
        app:layout_constraintEnd_toEndOf="@+id/et_login_pw"
        app:layout_constraintHorizontal_bias="0.0"
        app:layout_constraintStart_toStartOf="@+id/et_login_pw"
        app:layout_constraintTop_toBottomOf="@+id/et_login_pw" />

    <TextView
        android:id="@+id/textView"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginStart="8dp"
        android:layout_marginLeft="8dp"
        android:text="비밀번호"
        android:textColor="@color/black"
        android:textSize="11dp"
        app:layout_constraintBottom_toTopOf="@+id/et_login_pw"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHorizontal_bias="0.22"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintVertical_bias="1.0">

    </TextView>

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginStart="8dp"
        android:layout_marginLeft="8dp"
        android:text="아이디(이메일)"
        android:textColor="@color/black"
        android:textSize="11dp"
        app:layout_constraintBottom_toTopOf="@+id/et_login_id"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHorizontal_bias="0.239"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintVertical_bias="1.0">

    </TextView>

    <EditText
        android:id="@+id/et_login_id"
        android:layout_width="230dp"
        android:layout_height="30dp"
        android:layout_marginTop="280dp"
        android:background="@drawable/edit_bg"
        android:ems="10"
        android:hint=" ID"
        android:inputType="textEmailAddress"
        android:paddingLeft="5dp"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHorizontal_bias="0.49"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

    <EditText
        android:id="@+id/et_login_pw"
        android:layout_width="230dp"
        android:layout_height="30dp"
        android:layout_marginTop="32dp"
        android:background="@drawable/edit_bg"
        android:ems="10"
        android:fontFamily="sans-serif"
        android:hint=" PASSWORD"
        android:inputType="textPassword"
        android:paddingLeft="5dp"
        app:layout_constraintEnd_toEndOf="@+id/et_login_id"
        app:layout_constraintHorizontal_bias="0.666"
        app:layout_constraintStart_toStartOf="@+id/et_login_id"
        app:layout_constraintTop_toBottomOf="@+id/et_login_id" />

    <TextView
        android:id="@+id/textView3"
        android:layout_width="326dp"
        android:layout_height="45dp"
        android:layout_marginTop="28dp"
        android:gravity="center"
        android:text="|"
        android:textColor="@color/white"
        android:textSize="17dp"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHorizontal_bias="0.494"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/btn_login" />

    <Button
        android:id="@+id/btn_register2"
        android:layout_width="123dp"
        android:layout_height="48dp"
        android:layout_marginStart="76dp"
        android:layout_marginLeft="76dp"
        android:layout_marginTop="28dp"
        android:background="#00ff0000"
        android:text="비밀번호 찾기"
        android:textSize="13dp"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/btn_login" />

    <Button
        android:id="@+id/btn_register"
        android:layout_width="89dp"
        android:layout_height="48dp"
        android:layout_marginTop="28dp"
        android:layout_marginEnd="76dp"
        android:layout_marginRight="76dp"
        android:background="#00ff0000"
        android:text="회원가입"
        android:textSize="13dp"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHorizontal_bias="0.659"
        app:layout_constraintStart_toEndOf="@+id/btn_register2"
        app:layout_constraintTop_toBottomOf="@+id/btn_login" />

    <CheckBox
        android:id="@+id/login_chk"
        android:layout_width="131dp"
        android:layout_height="31dp"
        android:text="아이디 기억하기"
        android:textSize="13dp"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHorizontal_bias="0.325"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/et_login_pw" />

</androidx.constraintlayout.widget.ConstraintLayout>

 

다음은 액티비티에 대해 설명하려 한다.

여기서도 로그인을 위해서는 Authentication의 인스턴스를 생성해주어야 하기 때문에 아래의 코드를 추가해야한다.

private FirebaseAuth mAuth = FirebaseAuth.getInstance();

 

 

그리고 SNS어플을 사용하면서 편리한게 자동 로그인 기능이라 이를 추가하기 위해 아래의 코드를 넣었다.

    //자동로그인
    @Override
    protected void onStart() {
        super.onStart();

        FirebaseUser user = mAuth.getCurrentUser();
        if ( user != null) {
            Intent login_intent = new Intent(this, MainActivity.class);
            startActivity(login_intent);
            Toast.makeText(this, "자동 로그인 \n" + user.getEmail(), Toast.LENGTH_SHORT).show();
        }
    }

user가 로그인된 상태라면 자동으로 화면이 MainActivity로 전환되게 한다.

 

 

그리고 onCreate 안에서 XML과 각각 연결해준다.

    private EditText et_login_id, et_login_pw;
    private Button btn_login, btn_register;

	login_chk = findViewById(R.id.login_chk);
        et_login_id = findViewById(R.id.et_login_id);
        et_login_pw = findViewById(R.id.et_login_pw);
        btn_login = findViewById(R.id.btn_login);
        btn_register = findViewById(R.id.btn_register);

 

그리고 회원가입 클릭시 회원가입 Activity로 전환되는 코드이다.

        btn_register.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                Intent intent = new Intent(LoginActivity.this, RegisterActivity.class);
                startActivity(intent);
            }
        });

Activity간 Intent이기 때문에 간단히 작성할 수 있다.

 

그리고 가장 핵심인 로그인 기능이다.

        btn_login.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                String email = et_login_id.getText().toString().trim();
                String password = et_login_pw.getText().toString().trim();
                //String형 변수 email.pwd(edittext에서 받오는 값)으로 로그인하는것
                mAuth.signInWithEmailAndPassword(email, password)
                        .addOnCompleteListener(LoginActivity.this, new OnCompleteListener<AuthResult>() {
                            @Override
                            public void onComplete(@NonNull Task<AuthResult> task) {
                                if (task.isSuccessful()) {//성공했을때
                                    Intent intent = new Intent(LoginActivity.this, MainActivity.class);
                                    startActivity(intent);
                                } else {//실패했을때
                                    Toast.makeText(LoginActivity.this, "로그인 오류", Toast.LENGTH_SHORT).show();
                                }
                            }
                        });
                save();

            }
        });

파이어베이스의 Authentication에서 해당 기능을 지원해주기 때문에 쉽게 작성할 수 있다.

mAuth.signInWithEmail만 입력해도 자동완성으로 뒤의 내용이 나오기 때문에 어렵지 않게 작성할 수 있다.

if절에 로그인 성공시 화면이 MainActivity로 전환되게 하였고 else절은 실패시 토스트메시지가 뜨게 설정하였다.

 

그리고 save() 함수는 다음과 같다.

// 설정값을 저장하는 함수
private void save() {
    // SharedPreferences 객체만으론 저장 불가능 Editor 사용
    SharedPreferences.Editor editor = appData.edit();

    // 에디터객체.put타입( 저장시킬 이름, 저장시킬 값 )
    // 저장시킬 이름이 이미 존재하면 덮어씌움
    editor.putBoolean("SAVE_LOGIN_DATA", login_chk.isChecked());
    editor.putString("ID", et_login_id.getText().toString().trim());

    // apply, commit 을 안하면 변경된 내용이 저장되지 않음
    editor.apply();
}

이를 통해 로그인 한 id를 저장하고 이 저장된 id는 자동로그인을 할 때 사용된다.

 

그리고 아이디 기억하기 체크박스를 체크해놓은 경우 아이디가 유지되게 하기 위해 아래의 코드를 

OnCreate 안에 작성해 주었다.

        // 아이디 기억하기
        if(saveLoginData) {
            et_login_id.setText(id);             // 아이디가 입력된 상태로 유지
            login_chk.setChecked(saveLoginData); // 체크된 상태로 유지
        }

이 때 id는 SharedPreferences 객체를 통해 저장된다.

코드의 전문을 보면 onCreate 안에 아래의 코드가 있는 것을 확인할 수 있다.

appData = getSharedPreferences("appData", MODE_PRIVATE);
load();

이를 통해 id를 저장하고 load해서 로그인 성공시 다음에 로그인할 때 사용했던 이메일을 기억할 수 있게 하였다.

아래는 load함수이다.

private void load() {
    // SharedPreferences 객체.get타입( 저장된 이름, 기본값 )
    // 저장된 이름이 존재하지 않을 시 기본값
    saveLoginData = appData.getBoolean("SAVE_LOGIN_DATA", false);
    id = appData.getString("ID", "");
}

 

파이어베이스의 로그인 방법에 대해 알아보았다.

Authentication을 통해 로그인을 지원해 주기 때문에 복잡한 코드를 작성하지 않고도 기능을 구현할 수 있었다.

 

---

해당 내용은 아래의 파이어베이스 Developer에서도 확인할 수 있다.

https://firebase.google.com/docs/auth/android/password-auth?hl=ko 

Android에서 비밀번호 기반 계정을 사용하여 Firebase에 인증  |  Firebase 인증