iOS ) firebase로 로그인기능 만들어보기!

안녕하세요 :) 오늘은 오랜만에..firebase를 이용해 "로그인기능" 구현 방법을 알려드리고자 합니다!

하기전에 firebase를 프로젝트에 import해야하니, 

CocoaPods(코코아팟)사용법을 모르시는 분들은 여기

firebase가 뭔지 모르시는 분들은 여기

에 들어가주세요.

이 글을 위 두 글을 모두 읽고 오셨다고 생각하고 글을 쓸거에요!

꼭!! 읽고오시기 바랍니다.

firebase로 로그인기능 만들어보기(이메일계정/비밀번호)

---

먼저, 여기에 들어가시면 저보다 설명을 더 잘해놨을지도......크흠..

일단 시작할게요!!

1. 프로젝트에 코코아팟을 이용하여 firebase 추가해주기 

pod 'Firebase/Auth'

읽고 오라는 두 글을 읽고오셨다면, 위 사진 두장으로 모든것을 ...이해하셨을 거라고 생각합니다..ㅎㅎ

2. firebase에서 프로젝트를 만들자.

여기에 가셔서, 프로젝트를 만들어주자구요 ㅎㅎ

아니 왜 사진만 올려;;;;

....하는 방법은 여기에...다...있습니다...크흠..

이까지 다 하셨다면,

3. 이메일/비밀번호로 로그인 할 수 있도록 설정하자.

Authentication  > 로그인방법에 가주세요. 그리고,

이메일/비밀번호를 사용설정해주세요.

4. 원하는 사용자를 추가해주자.

물론 앱에서 새로운 사용자를 추가해줄 수 있어요. 그건 나중에 하고 ㅎㅎ firebase에서도 유저를 만들 수 있다는 것을 보여드리기위해...ㅎㅎ

다시 사용자 탭에 들어가서, 사용자추가를 눌러주세요.

아무 이메일이나..비밀번호를...ㅎㅎ 이거 보여줘도 되는거겠죠!?!?...

저렇게 하고 사용자 추가를 눌러주시면, 유저가 하나 추가된답니다ㅎㅎ

후...로그인 기능은..언제..구현하는 겁니까...그거 알려고 들어온건데....

앗..네..

5. 로그인 디자인

workspace에 가셔서, main.storyboard에 가주세요.

이메일과 비밀번호를 입력하는 텍스트필드가 있어야겠죠?

그리고 로그인 버튼도요!

회원가입 버튼은..그냥 만들어봤습니다..나중에 기회되면 회원가입도 쓸게요!

자, textField에 대해 IBOutlet을 해주시고, 로그인버튼을 누르면, 로그인이 되어야 하니까 IBAction을 만들어주세요.

6. 로그인을 위한 세팅

그리고 firebase를 써야하니, firebase를 import해줍시다. 

import Firebase

7. 로그인이 된 상태인지 ViewDidLoad에서 확인

한번 로그인을 하면, 다시 로그인 할 일이 없어야 겠죠?

ViewDidLoad()에, 

override func viewDidLoad() {
        super.viewDidLoad()
        if let user = Auth.auth().currentUser {
            emailTextField.placeholder = "이미 로그인 된 상태입니다."
            pwTextField.placeholder = "이미 로그인 된 상태입니다."
            LoginButton.setTitle("이미 로그인 된 상태입니다.", for: .normal)
        }
}

위 코드를 넣어주세요. Auth.auth().currentUser는 지금 유저가 로그인 상태인지 확인해주는 프로퍼티랍니다.

만약 로그인이 되어있으면, 이메일과 비밀번호 텍스트필드의 placeholder를 바꿔주고, 로그인 버튼의 text도 바꿔줄게요.

한번 실행해볼까요? 

현재는 로그인 상태가 아니니까, 텍스트필드도 활성화가 되어있고 로그인 텍스트도 바뀌지 않았네요. 로그인 기능을 구현하러 가봅시다.

7. IBAction구현. (로그인 기능 구현)

firebase홈페이지가 하라는대로

이걸 해줍시다.

그러면..

FIRAuth를 Auth로 바꾸렴^^하는 오류가 나옵니다. 

저는 이때 이런생각을 했죠..아니 구글이....이런 실수를 할리가...리네임 됐으면 홈페이지에서도 바꼈을텐데..

바꿔도 되나..?

이러고 한참 찾아봤는데..

결론은...바꿔도된다 ^^.....

여러분 리네임 된게 맞습니다!! 구글....얼른 홈페이지 업데이트 하시길...ㅎㅎ..

@IBAction func loginButtonTouched(_ sender: Any){
        Auth.auth().signIn(withEmail: emailTextField.text!, password: pwTextField.text!) { (user, error) in
            if user != nil{
                print("login success")
            }
            else{
                print("login fail")
            }
      }
}

최종적으로 IBAction에는 이런 코드가 들어가게됩니다. withEmail파라미터에는 email TextField의 값을, password파라미터에는 pw TextField의 값을 넣어주세요.

(사실 이 일이 컨트롤러에서 할 일은 아니죠 ㅎㅎ..로그인 모델을 따로 만들어서 하는게 좋습니다!)

그리고 만약 로그인이 성공한다면, 성공 메세지를, 실패하면 실패메세지를 띄워봅시다.

자, 이상한 이메일과 패스워드를 주면 실패메세지를 잘 띄워주네요.

하지만..

아까 우리가 만들었던 유저의 이메일과 비밀번호를 텍스트필드에 넣어봅시다. 

오오 로그인이 되었어요 :)

자, 앱을 "종료"하고, 다시 들어가볼까요? (시뮬레이터에서 앱을 종료하는 방법은 Command + shift + H를 빠르게 두번 눌러주시면 아이폰과 똑같이 앱을 종료할 수 있게 뜨는데, 해당 앱을 위로 슉 올리면 종료가 된답니다.)

오오...이미 로그인된 상태라고 합니다...ㅎㅎ

심지어...이 앱을 삭제하고..다시 설치해볼까요..?

앱을 "삭제"했음에도 불구하고 로그인 상태가 남아있네요.

"로그아웃"하지 않는 이상 로그인 상태가 사라지지 않는 것 같아요.

자!! 어떠신가요 ㅎㅎ 이 firebase로그인 관련 글들을 시리즈로 써볼생각이에요.

다음편은 회원가입으로 돌아오겠습니다. 

그럼 오늘도 도움이 되었길 바라며...! 

모두들 더위 조심하세요 :)