Firebaseとswiftでメールアドレスログインを実装する(メール認証有)

swift

はじめに

Firebaseを使用してswiftアプリにメールアドレスとパスワードでログインする機能を実装する方法をまとめました。

開発環境

・swift 5.4

・Xcode 13.1

想定

●Firebaseを使用する。

●アプリ起動時にメールアドレスとパスワードを使用してユーザー登録を行う。

●エラー時は内容をアラートで表示する。

●メールアドレスに認証メールを送信する。

●登録した情報でログインが出来る。

実装

podファイルの生成

ターミナルを開いて、cd ファイル名 でEnterを押す。

pod initと入力してEnter。

podファイルが生成されたらそれを開きます。

podファイルに以下を追加します。

pod 'Firebase/Auth' //ログイン
pod 'Firebase/Firestore' //データベース
pod 'Firebase/Storage' //画像の保存

そして、pod install と入力してEnter。

無事インストールが完了したら、一度Xcodeを閉じて、再起動させます。(白のxcworkspace)

Xcodeからbundle Identifierをコピーします。

Firebaseにプロジェクトを作成する

Firebaseを開いてプロジェクトを作成します。

作成できたら、続行 → iOS をクリックします。

そして先程コピーしたbundle IdentifierをbundleIDのところへ貼り付け、登録をクリックします。

次にGoogleService-Infoをダウンロードして、Xcodeのinfo.plistの下あたりに追加します。

その際、ファイル名が”−2”などになっていたらエラーになるので、”−2”の所を消してください。

Firebaseに戻って、次へを押していきコンソールへ移動します。

AuthenticationのSign-in methodの”メールアドレス/パスワード”を有効にして保存します。

databaseを作成する

Firestore Databaseを開きテストモードで作成します。

作成されたらルール設定で:if以下を削除して公開します。

次にStorageを開いて、こちらもルール設定で:if以下を削除して公開します。

新規ユーザー登録

①Authenticationへ保存(メールアドレス、uid、日時)

②”users”という名前でDBへ保存(ユーザーネーム、メールアドレス、uid、アイコン画像)

import Firebase
import FirebaseAuth
import FirebaseFirestore
import PKHUD

@IBAction func sendButton(_ sender: Any) {
  if emailTextField.text?.isEmpty != true && passwordTextField.text?.isEmpty != true && userNameTextField.text?.isEmpty != true{
     HUD.show(.progress)
       //空でなければAuthに登録
       Auth.auth().createUser(withEmail: self.emailTextField.text!, password: self.passwordTextField.text!){ [self] (result, error) in
     HUD.hide()
       //エラーなら内容を吐く
       if error != nil{
       //登録できなかったときのアラート
       let errorString = error!.localizedDescription
         switch errorString {
           case "The email address is badly formatted.":
             er = "正しいメールアドレスを入力してください"
           case "The password must be 6 characters long or more.":
             er = "パスワードは、6文字以上で入力してください"
           case "The email address is already in use by another account.":
             er = "このメールアドレスは既に使用されています"
           default:
             er = "入力を確認してください"
         }
       alertSystem.showAlert2(title: "登録できません", message: "\(er)", buttonTitle: "OK", viewController: self)
         //エラーログ
         print(errorString)
         print(error.debugDescription)
         return
       }else{
         //認証メールの送信
         Auth.auth().currentUser?.sendEmailVerification { error in
           return
         }
       }
         HUD.show(.progress)
           let data = self.userIconImage.image?.jpegData(compressionQuality: 0.5)
           //パスを準備
           let imageRef = Storage.storage().reference().child("client").child("\(UUID().uuidString + String(Date().timeIntervalSince1970)).jpg")
             imageRef.putData(data!,metadata: nil) {(metaData, error) in
               if error != nil{
                 print(error.debugDescription)
                 return
               }
             imageRef.downloadURL { [self] (url, error )in
               if error != nil{
                  print(error.debugDescription)
                  return
               }
             db.collection("users").document(Auth.auth().currentUser!.uid).setData(
               ["userName":userNameTextField.text as Any,"mail":emailTextField.text as Any,"uid":Auth.auth().currentUser?.uid as Any,"userIcon":(url?.absoluteString)! as Any]
             )
               userNameTextField.text = ""
               emailTextField.text = ""
               passwordTextField.text = ""
               userIconImage.image = UIImage(named: "usericon3")
           HUD.hide()
             alertSystem.showAlert(title: "仮登録完了!", message: "登録のメールアドレスに確認メールを送信しました。リンクをクリックして登録を完了してください。", buttonTitle: "OK", viewController: self)
            }
          }
        }
          HUD.hide()
          }
        }else{
            //登録できなかったときのアラート
            if userNameTextField.text == "" && emailTextField.text == "" && passwordTextField.text == ""{
                alertSystem.showAlert2(title: "登録できません", message: "名前、メールアドレス、パスワードを入力してください", buttonTitle: "OK", viewController: self)
            }else if emailTextField.text == ""{
                alertSystem.showAlert2(title: "登録できません", message: "メールアドレスを入力してください", buttonTitle: "OK", viewController: self)
            }else if userNameTextField.text == ""{
                alertSystem.showAlert2(title: "登録できません", message: "名前を入力してください", buttonTitle: "OK", viewController: self)
            }else if passwordTextField.text == ""{
                alertSystem.showAlert2(title: "登録できません", message: "パスワードを入力してください", buttonTitle: "OK", viewController: self)
            }
        }
    }

ログイン

メール認証が完了していればログインできます。

メール認証では、メールアドレスに送られたURLをタップすることで、Firebase側で認証が完了します。

認証が完了しているかどうかは、

if let user = result?.user

if user.isEmailVerified

で取得できます。

@IBAction func login(_ sender: Any) {
   HUD.show(.progress)
     //ログイン
     Auth.auth().signIn(withEmail: emailTextField.text!, password: passwordTextField.text!) { (result, error) in
   HUD.hide()
     if error != nil{
     print(error.debugDescription)
     //エラー時ダイアログを出す
     print(error.debugDescription)
       if self.emailTextField.text == "" && self.passwordTextField.text == ""{
         self.alertSystem.showAlert2(title: "確認してください", message: "メールアドレスとパスワードを入力してください", buttonTitle: "OK", viewController: self)
       }else if self.emailTextField.text == ""{
         self.alertSystem.showAlert2(title: "確認してください", message: "メールアドレスを入力してください", buttonTitle: "OK", viewController: self)
       }else if self.passwordTextField.text == ""{
         self.alertSystem.showAlert2(title: "確認してください", message: "パスワードを入力してください", buttonTitle: "OK", viewController: self)
       }else{
         self.alertSystem.showAlert2(title: "確認してください", message: "メールアドレスまたはパスワードを正しく入力してください", buttonTitle: "OK", viewController: self)
       }
     }

    if let user = result?.user {
      if user.isEmailVerified {
        print("メールアドレス確認済み")
        self.emailTextField.text = ""
        self.passwordTextField.text = ""
        //画面遷移
        let tagBarVC = self.storyboard?.instantiateViewController(withIdentifier: "tagBarVC")
          self.present(tagBarVC!, animated: true, completion: nil)
        } else {
          print("メールアドレス未確認")
          self.alertSystem.showAlert2(title: "確認してください", message: "メールアドレスの認証を完了させるまではログインができません。", buttonTitle: "OK", viewController: self)
        }
      }
   }
}

注意点

Firebaseを使うときは

AppDelegate.swiftにimport Firebase

didFinishLaunchingWithOptions内にFirebaseApp.configure()

を記述しないと使用できません。

おわりに

Firebaseを使用すると新規ユーザー登録、メール認証、ログイン機能が簡単に実装できます。

コメント

タイトルとURLをコピーしました