Firebase Auth 系列 1：「郵件的 Authentication」
By: Cooper Hsieh
Tags: Swift, Xcode, Firebaseauthentication, Firebase, iOS App Development

Storyboard

我們將畫面拉好，會需要 3 個 viewController，分別為登入、註冊、忘記密碼，以及一個沒有拉線的已登入畫面。因這裡著重在 Firebase，這邊拉線的動作有點偷懶，後面會一直生成一頁新的「present modally」，而沒有使用其他 segue 方式回去。

圖 4

郵件註冊

我們來到「SignupViewController.swift」的檔案中，先「import Firebase」與「import FirebaseAuth」，並將 TextField 的 Outlet 拉好。

再來直接寫下判斷程式在 Button action 的函式中。首先先判斷 textField 裡面是否有值，如果沒有就跳出 alert。

if emailTextField.text == "" {



let alertController = UIAlertController(title: "錯誤", message: "請輸入郵件地址", preferredStyle: .alert)



let defaultAction = UIAlertAction(title: "OK", style: .cancel, handler: nil)

alertController.addAction(defaultAction)



present(alertController, animated: true, completion: nil)

Firebase 其實幫我們簡化了很多行程式，我們只需透過 Auth 物件來呼叫裡面的函式，就可以簡單進行註冊！

Auth.auth().createUser() //透過這裡直接呼叫，將 textField 的值帶入

透過 closure ，如果沒有錯誤時，使用者將成功註冊，並跳轉畫面至登入後的畫面。

if error == nil {

print("You have successfully signed up")



let vc = self.storyboard?.instantiateViewController(identifier: "Home")

self.present(vc!, animated: true, completion: nil)

如果錯誤則跳出 alert，告知使用者 Email 可能已被註冊。

} else {



let alertController = UIAlertController(title: "錯誤", message: error?.localizedDescription, preferredStyle: .alert)



let defaultController = UIAlertAction(title: "OK", style: .cancel, handler: nil)

alertController.addAction(defaultController)



self.present(alertController, animated: true, completion: nil)

實作：Email 註冊成功，以及檢查是否重複帳號。

我們也可在 Firebase 的中控台裡面的 Users 找到剛才所註冊的 Email 帳號。中控台也可以直接將帳號刪除，修改等動作。

圖 5

郵件登入

註冊成功之後，我們可以開始寫下登入的程式。來到「LoginViewController.swift」檔案，先「import Firebase」與「import FirebaseAuth」，並將 TextField 的 Outlet 拉好。

寫法也非常的簡單！一樣先判斷 textField 是否有值，跳出 alert

if emailTextField.text == "" || passwordTextField.text == "" {

let alertController = UIAlertController(title: "Error", message: "Please enter an email and password.", preferredStyle: .alert)

let defaultAction = UIAlertAction(title: "OK", style: .cancel, handler: nil)

alertController.addAction(defaultAction)



self.present(alertController, animated: true, completion: nil)

接著我們可以呼叫 Firebase 提供的方法：

Auth.auth().signIn()

與註冊的寫法雷同，一樣如果沒有錯誤的話就成功登入

if error == nil {

//Print into the console if successfully logged in

print("You have successfully logged in")



//Go to the HomeViewController if the login is sucessful

let vc = self.storyboard?.instantiateViewController(withIdentifier: "Home")

self.present(vc!, animated: true, completion: nil)

倘若有錯誤，則跳出 alert，像是郵件地址錯誤，或是沒在系統內等情況

} else {

//Tells the user that there is an error and then gets firebase to tell them the error

let alertController = UIAlertController(title: "Error", message: error?.localizedDescription, preferredStyle: .alert)



let defaultAction = UIAlertAction(title: "OK", style: .cancel, handler: nil)

alertController.addAction(defaultAction)



self.present(alertController, animated: true, completion: nil)

實作：Email 登入成功，以及檢查帳號是否有在 Firebase 中

會員登出

在「HomeViewController.swift」檔案中拉好 Button 的 Action 函式。登出也是依靠 Firebase 裡面的方法：

Auth.auth().signOut()

先檢查登入的狀態，如果是已登入的話，就會透過上述的方法將使用者登出並回到登入畫面。

if Auth.auth().currentUser != nil {

do {

try Auth.auth().signOut()

let vc = UIStoryboard(name: "Main", bundle: nil).instantiateViewController(identifier: "MemberLogin")

present(vc, animated: true, completion: nil)

再寫一個如果有錯誤時的方法

} catch let error as NSError {

print(error.localizedDescription)

實作：按下登出，即刻登出返回登入頁面

忘記密碼，系統發送修改密碼信件

我們因為有太多的帳號密碼，導致常常記不住，這時候也可以透過 Firebase 貼心的功能，直接發送修改密碼的郵件至我們所輸入的郵件地址中。

來到「ResetPasswordViewController.swift」，在 Button 的 Action 中寫入程式，呼叫下列方式

Auth.auth().sendPasswordReset()

先檢查 error 是否有錯誤，如沒錯誤會跳出 alert 告知使用者去信箱收郵件。

else {

title = "成功"

message = "請至郵箱收取修改密碼信件"

self.resetEmailAddressTestField.text = ""

}



let alertController = UIAlertController(title: title, message: message, preferredStyle: .alert)



let defaultAction = UIAlertAction(title: "OK", style: .cancel, handler: nil)

alertController.addAction(defaultAction)



self.present(alertController, animated: true, completion: nil)

實作：檢查郵件是否有誤，如正確可發送信件至郵箱修改密碼

接著我們來到信箱，發現 Firebase 已發送修改密碼的信件：

圖 6

點擊連結後，帶到修改密碼畫面，接著就可以進行修改！