yeon's blog

[Kotlin] Firebase 회원가입, 로그인, 로그아웃, 익명로그인 기능 구현 본문

Kotlin/커뮤니티 앱

[Kotlin] Firebase 회원가입, 로그인, 로그아웃, 익명로그인 기능 구현

yeonii 2024. 1. 3. 14:40

Firebase 세팅 및 Authentication 이용 방법은 작성했던 글을 참고 해주세요!

➡️ https://hyeyeon-ii.tistory.com/46

 

1. Firebase 회원가입 구현

JoinActivity 전체코드

package com.example.mysololife.auth

import android.content.Intent
import androidx.appcompat.app.AppCompatActivity
import android.os.Bundle
import android.widget.Toast
import androidx.databinding.DataBindingUtil
import com.example.mysololife.MainActivity
import com.example.mysololife.R
import com.example.mysololife.databinding.ActivityJoinBinding
import com.google.firebase.auth.FirebaseAuth
import com.google.firebase.auth.ktx.auth
import com.google.firebase.ktx.Firebase

class JoinActivity : AppCompatActivity() {

    private lateinit var auth: FirebaseAuth

    private lateinit var binding : ActivityJoinBinding

    override fun onCreate(savedInstanceState: Bundle?) {

        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_join)

        auth = Firebase.auth

        binding = DataBindingUtil.setContentView(this, R.layout.activity_join)

        binding.joinBtn.setOnClickListener {

            var isGoToJoin = true

            val email = binding.emailArea.text.toString()
            val password1 = binding.passwordArea1.text.toString()
            val password2 = binding.passwordArea2.text.toString()

            // 값이 비어있는지 확인
            if (email.isEmpty()) {
                Toast.makeText(this, "이메일을 입력하세요", Toast.LENGTH_LONG).show()
                isGoToJoin = false
            } else if (password1.isEmpty()) {
                Toast.makeText(this, "패스워드를 입력하세요", Toast.LENGTH_LONG).show()
                isGoToJoin = false
            } else if (password2.isEmpty()) {
                Toast.makeText(this, "확인 패스워드를 입력하세요", Toast.LENGTH_LONG).show()
                isGoToJoin = false
            }

            // 비밀번호 & 확인 비밀번호가 같은지 확인
            if (!password1.equals(password2)) {
                Toast.makeText(this, "비밀번호가 다릅니다", Toast.LENGTH_LONG).show()
                isGoToJoin = false
            }

            // 비밀번호 6자리 이상인지 확인
            if (password1.length < 6) {
                Toast.makeText(this, "비밀번호를 6자리 이상 입력하세요", Toast.LENGTH_LONG).show()
                isGoToJoin = false
            }

            if (isGoToJoin) {
                auth.createUserWithEmailAndPassword(email, password1).addOnCompleteListener(this) { task ->
                        if (task.isSuccessful) {
                            Toast.makeText(this, "성공", Toast.LENGTH_LONG).show()

                            val intent = Intent(this, MainActivity::class.java)
                            startActivity(intent)

                        } else {
                            Toast.makeText(this, "실패", Toast.LENGTH_LONG).show()
                        }
                    }
            }
        }
    }
}

 

회원가입 관련 코드도 마찬가지로 Firebase 사이트에서 참고하면 된다. (*신규 사용자 가입 부분 참고)

https://firebase.google.com/docs/auth/android/start

 

isGoToJoin을 사용하여, 필요 조건들을 만족하지 못한 경우 값을 false로 설정해 회원가입 진행을 하기 못하도록 코드를 구현한다.

값을 모두 입력했는지, 비밀번호 두개가 일치한지 그리고 비밀번호가 6자 이상인지 모두 검증이 끝난 후에 회원가입이 진행된다.

 

실행 화면

 

 

문제점 ‼️

위와 같이 구현한 후에 실행을 돌려보면 회원가입 이후 Main 화면으로 이동하는 것까지 완벽하지만, 뒤로가기를 눌렀을 때 다시 회원가입 페이지로 돌아가게 된다.

 

JoinActivity 수정 코드

if (isGoToJoin) {
    auth.createUserWithEmailAndPassword(email, password1).addOnCompleteListener(this) { task ->
            if (task.isSuccessful) {
                Toast.makeText(this, "성공", Toast.LENGTH_LONG).show()

                val intent = Intent(this, MainActivity::class.java)
                intent.flags = Intent.FLAG_ACTIVITY_NEW_TASK or Intent.FLAG_ACTIVITY_CLEAR_TOP
                startActivity(intent)

            } else {
                Toast.makeText(this, "실패", Toast.LENGTH_LONG).show()
            }
        }
}

 

문제점 해결을 위해 'intent.flags = Intent.FLAG_ACTIVITY_NEW_TASK or Intent.FLAG_ACTIVITY_CLEAR_TOP' 코드를 추가해주면 된다!


2. Firebase 로그인 구현

LoginActivity 전체코드

package com.example.mysololife.auth

import android.content.Intent
import androidx.appcompat.app.AppCompatActivity
import android.os.Bundle
import android.widget.Toast
import androidx.databinding.DataBindingUtil
import com.example.mysololife.MainActivity
import com.example.mysololife.R
import com.example.mysololife.databinding.ActivityLoginBinding
import com.google.firebase.auth.FirebaseAuth
import com.google.firebase.auth.ktx.auth
import com.google.firebase.ktx.Firebase

class LoginActivity : AppCompatActivity() {

    private lateinit var auth: FirebaseAuth

    private lateinit var binding : ActivityLoginBinding

    override fun onCreate(savedInstanceState: Bundle?) {

        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_login)

        auth = Firebase.auth

        binding = DataBindingUtil.setContentView(this, R.layout.activity_login)

        binding.loginBtn.setOnClickListener {

            val email = binding.emailArea.text.toString()
            val password = binding.passwordArea.text.toString()

            auth.signInWithEmailAndPassword(email, password)
                .addOnCompleteListener(this) { task ->
                    if (task.isSuccessful) {
                        Toast.makeText(this, "로그인 성공", Toast.LENGTH_LONG).show()

                        val intent = Intent(this, MainActivity::class.java)
                        intent.flags = Intent.FLAG_ACTIVITY_NEW_TASK or Intent.FLAG_ACTIVITY_CLEAR_TASK
                        startActivity(intent)

                    } else {
                        Toast.makeText(this, "로그인 실패", Toast.LENGTH_LONG).show()
                    }
                }
        }

    }
}

 

로그인은 회원가입처럼 추가적으로 조건을 추가하지 않는다.

위의 사이트에서 Firebase '기존 사용자 로그인' 부분을 참고하여 코드를 작성하면 쉽게 로그인을 할 수 있기 때문이다!

 


3. Firebase 로그아웃 구현

MainActivity 전체코드

package com.example.mysololife

import android.content.Intent
import androidx.appcompat.app.AppCompatActivity
import android.os.Bundle
import android.widget.Button
import com.example.mysololife.auth.IntroActivity
import com.google.firebase.auth.FirebaseAuth
import com.google.firebase.auth.auth
import com.google.firebase.auth.ktx.auth
import com.google.firebase.ktx.Firebase

class MainActivity : AppCompatActivity() {

    private lateinit var auth : FirebaseAuth

    override fun onCreate(savedInstanceState: Bundle?) {

        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)

        auth = Firebase.auth

        findViewById<Button>(R.id.logoutBtn).setOnClickListener {

            auth.signOut()

            val intent = Intent(this, IntroActivity::class.java)
            intent.flags = Intent.FLAG_ACTIVITY_NEW_TASK or Intent.FLAG_ACTIVITY_CLEAR_TASK
            startActivity(intent)

        }
    }
}

 

로그아웃 버튼은 보통 로그인 후에 Main 화면에 위치한다.

LogoutActivity를 따로 만들 필요 없이, activity_main.xml에 로그아웃 버튼 생성 후 MainActivity에서 로그아웃 기능을 구현해주면 된다.

 


4. Firebase 익명로그인 구현

IntroActivity 추가코드

binding.noAccountBtn.setOnClickListener {
    auth.signInAnonymously()
        .addOnCompleteListener(this) { task ->
            if (task.isSuccessful) {

                val intent = Intent(this, MainActivity::class.java)
                intent.flags = Intent.FLAG_ACTIVITY_NEW_TASK or Intent.FLAG_ACTIVITY_CLEAR_TASK
                startActivity(intent)

            } else {
                Toast.makeText(this, "로그인 실패", Toast.LENGTH_LONG).show()
            }
        }
}

 

익명 로그인의 경우 화면이 로그인을 위한 화면이 따로 필요하지 않다.

Intro 화면에서 '비회원 가입' 버튼을 누르면 Main 화면으로 들어갈 수 있다.

 

우리가 평소에 앱을 사용할 때 로그인을 하지 않아도 이용할 수 있는 서비스들이 분명히 있을 것이다.

그러한 상태를 비회원 가입이라고 칭하고 있는 것이다.

 

 

실행 화면

로그인 화면 → 로그인 후 main 화면 → 로그아웃 후 intro 화면

 

 

 

'Kotlin > 커뮤니티 앱' 카테고리의 다른 글

[Kotlin] 팁 페이지  (2) 2024.01.12
[Kotlin] 메인화면 레이아웃 (Navigation)  (0) 2024.01.06
[Kotlin] 레이아웃 구현  (1) 2024.01.02