[흡구오디] Swift - firebase Authentication로 이메일 로그인 구현하기

 

안녕ㅎㅏ세요

 

저는 그동안 로그인 기능을 구현하고 있었답니다?

 

그럼 오늘은 로그인 방법에 대해 정리해볼게요!

 

로그인 방법

이번 포스팅은 firebase의 가장 기본적인! Authentication의 이메일 / 비밀번호 방법으로 로그인 하는 법에 대해 알아보겠습니다.

 

제공업체 추가

먼저 콘솔 > Autentication > 로그인 방법 > 새 제공업체 추가 에 가서 [이메일/비밀번호]를 선택해주세요

 

그리고 앞으로 나오는 방법에 대한 내용은 모두 공식 문서를 기반으로 합니다.

 

신규 사용자 가입 방법

이렇게 설정을 해두고 나면, 이제 코드에서 createUser API를 호출해서 신규 유저를 만들 수 있아요

Auth.auth().createUser(withEmail: email, password: password) { authResult, error in
  // ...
}

 

저는 회원가입 페이지를 따로 만들었기 때문에 거기로 넘어가서

override func viewDidLoad() {
	// 중략
    self.bindAction()
  }

// 중략

private func bindAction() {  
// 중략
    self.signInButton.rx.tap
      .subscribe(onNext: { [weak self] in
        self?.signIn()
      })
      .disposed(by: disposeBag)
  }

private func signIn() {
    let signInVC = SignInViewController()
    self.present(signInVC, animated: true)
  }

 

전체 코드는 아래와 같습니다

//
//  SignInViewController.swift
//  SmokingAreaOdi
//
//  Created by 23ji on 9/18/25.
//

import FlexLayout
import Then
import RxSwift

import UIKit
import FirebaseAuth

class SignInViewController: UIViewController {
  
  private enum Metric {
    static let labelWidth : CGFloat = 300
    static let labelHeight : CGFloat = 50
    static let textFieldWidth : CGFloat = 300
    static let textFieldHeight : CGFloat = 50
    static let buttonWidth : CGFloat = 300
    static let buttonHeight : CGFloat = 50
  }
  
  private let disposeBag = DisposeBag()

  private let emailLabel = UILabel().then{
    $0.text = "Email"
  }
  
  private let emailTextFeild = UITextField().then{
    $0.borderStyle = .roundedRect
    $0.autocapitalizationType = .none
  }
  
  private let passwordLabel = UILabel().then{
    $0.text = "Password"
  }
  
  private let passwordTextFeild = UITextField().then{
    $0.borderStyle = .roundedRect
    $0.isSecureTextEntry = true
    $0.autocapitalizationType = .none
  }
  
  private let signInButtton = UIButton().then {
    $0.setTitle("회원가입", for: .normal)
    $0.backgroundColor = .systemGray
    $0.layer.cornerRadius = 10
    $0.layer.masksToBounds = true
  }
  
  override func viewDidLoad() {
    super.viewDidLoad()
    self.addSubviews()
    self.setupLayout()
    self.didTappedSignInButton()
  }
  
  private func addSubviews() {
    self.view.addSubview(self.emailLabel)
    self.view.addSubview(self.emailTextFeild)
    self.view.addSubview(self.passwordLabel)
    self.view.addSubview(self.passwordTextFeild)
    self.view.addSubview(self.signInButtton)
  }
  
  private func setupLayout() {
    self.view.backgroundColor = .white
    self.view.flex.direction(.column).define {
      $0.addItem(self.emailLabel).width(Metric.labelWidth).height(Metric.labelHeight).alignSelf(.center).marginTop(200)
      $0.addItem(self.emailTextFeild).width(Metric.textFieldWidth).height(Metric.textFieldHeight).alignSelf(.center)
      $0.addItem(self.passwordLabel).width(Metric.labelWidth).height(Metric.labelHeight).alignSelf(.center)
      $0.addItem(self.passwordTextFeild).width(Metric.textFieldWidth).height(Metric.textFieldHeight).alignSelf(.center)
      $0.addItem(self.signInButtton).width(Metric.buttonWidth).height(Metric.buttonHeight).alignSelf(.center).marginTop(50)
    }
    self.view.flex.layout(mode: .fitContainer)
  }
  
  
  private func didTappedSignInButton() {
    self.signInButtton.rx.tap
      .subscribe(onNext: { [weak self] in
        guard let self = self,
              let email = self.emailTextFeild.text,
              let password = self.passwordTextFeild.text else { return }
        
        Auth.auth().createUser(withEmail: email, password: password) { authResult, error in
          if let error = error {
            print("회원가입 실패", error)
          } else {
            print("회원가입 성공", authResult?.user.uid)
            self.goHome()
          }
        }
      })
      .disposed(by: self.disposeBag)
  }
}

 

 

회원가입은 그냥 텍스트 필드에서 값 받아서 createUer 해주면 돼요!

간단함

 

 

그럼 다음으로는

 

기존 사용자 로그인

 

위에서 만든 이메일과 비밀번호를 기반으로 사용자 로그인 기능을 만들어줄 수 있어요

Auth.auth().signIn(withEmail: email, password: password) { [weak self] authResult, error in
  guard let strongSelf = self else { return }
  // ...
}

 

 

그래서 저는 어떻게 했냐~~~면

 

버튼 탭 → login 함수 호출 → Firebase API 요청의 흐름으로 구성했어요

여기서 포인트는 bindAction()에서 버튼 탭 이벤트를 구독하고, 그 안에서 login() 함수를 불러주는 것

 override func viewDidLoad() {
   // 중략
    self.bindAction()
  }
  
// 중략

private func bindAction() {
    self.loginButtton.rx.tap
      .subscribe(onNext: { [weak self] in
        self?.login()
      })
      .disposed(by: disposeBag)
      
      // 중략
}

private func login() {
    
    guard let email = self.emailTextFeild.text else { return }
    guard let password = self.passwordTextFeild.text else { return }
    
    Auth.auth().signIn(withEmail: email, password: password) { [weak self] authResult, error in
      if authResult != nil {
        print("로그인 이메일: ", authResult?.user.email)
        self?.goHome()
      } else {
        print("❗️ 로그인 실패!", error)
        
        let alert = UIAlertController(title: "알림", message: "아이디 혹은 비밀번호가 잘못 입력되었습니다.", preferredStyle: .alert)
        let check = UIAlertAction(title: "확인", style: .destructive, handler: nil)
        alert.addAction(check)
        self?.present(alert, animated: true, completion: nil)
      }
    }
  }

 

login() 함수에서 이메일과 비밀번호를 꺼내서 Firebase의 signIn 메서드에 넘김

-> 성공하면 메인 화면으로 이동, 실패하면 Alert을 띄워줌

 

입니다.

 

 

간단하쥬?

 

참고로 저는 아직 로그아웃 기능을 구현안해서 로그아웃은 다음 포스팅 혹은 나중에 아래에 이어서 작성해보도록 할게요!

 

그럼 안녕히계세요