Firestoreでログイン画面を作ろう！

今回はFirestoreのログイン機能を作って行きます！

新規登録の前に

前回作ったxcodeのプロジェクトを開いてもらい,App Delegateファイルを開いてください！
以下のようにimport Firebaseと FirebaseApp.configure()を記入しましょう！

これはXcodeでFirebaseを使う際に必ず必要になります。

新規登録機能

では、Firebaseのサイトに行きましょう。そこで、左のメニューからAuthenticationを選びましょう。ここでユーザー管理を行えます。

一番上のEmaliを選択し、有効にしてください。こうすることでメールアドレスを使った新規登録・ログインができるようになります！

では Xcodeに戻りましょう。
そのためにまず新規登録画面とログイン画面を作りましょう。
新規登録、ログイン画面はこんな感じ

それでは新規登録をするためにSignUpViewControllerを作りその中にコードを書いて行きます！
ではまず、importのところに

SignUpViewController

import FirebaseAuth

と書きましょう！これで会員管理の設定が行えます！

そして、emailTextFieldとpasswordTextField の@IBOutletと新規登録ボタンを押されたときの@IBActionを用意してあげましょう。

新規登録ボタンが押された時に、以下のコードを書いてあげると、Eメールを使った新規登録が可能になります。

SigunUpViewContoroller

@IBAction func SignUp() {
        let email = emailTextField.text
        let password = passwordTextField.text
        if let email = emailTextField.text,let password = passwordTextField.text {
        Auth.auth().createUser(withEmail: email, password: password) { authResult, error in
            if error != nil {
                print("エラー")
            }  else {
                //新規等速成功した時
                self.performSegue(withIdentifier: "toHome", sender: nil)
            }
        }
        }
    }

解説すると,emailTextField とpasswordTextFieldにテキストが入力されたら、ユーザー登録が行われるということになります。

ユーザー登録は

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

で行われるので新規登録する際はこのコードを書きましょう！

全体はこんな感じ

SignUpViewContoroller

import UIKit
import FirebaseAuth

class SignUpViewController: UIViewController {

    @IBOutlet var emailTextField : UITextField!
    @IBOutlet var passwordTextField : UITextField!

    override func viewDidLoad() {
        super.viewDidLoad()

    }

    @IBAction func SignUp(){
        if let email = emailTextField.text,let password = passwordTextField.text {
            Auth.auth().createUser(withEmail: email, password: password) { authResult, error in
                if error != nil {
                    print("エラー")
                }  else {
                    //新規等速成功した時
                    self.performSegue(withIdentifier: "SignUptoHome", sender: nil)
                }
            }
        }
    }
}

では実際に新規登録をしてみると、、、
おおおおおお！
ちゃんとデータベースに保存さてます！

ログイン機能

では次は、ログイン機能を実装して行きましょう！
ログイン機能も新規登録と同じくemailTextFieldとpasswordTextField の@IBOutletと新規登録ボタンを押されたときの@IBActionを用意してあげましょう。

ログインボタンが押された時に、以下のコードを書いてあげると、Eメールを使った新規登録が可能になります。

SignInViewContoroller

@IBAction func SignIn() {
        let email = emailTextField.text
        let password = passwordTextField.text
        if let email = emailTextField.text,let password = passwordTextField.text {
        Auth.auth().createUser(withEmail: email, password: password) { authResult, error in
            if error != nil {
                print("エラー")
            }  else {
                //新規等速成功した時
                self.performSegue(withIdentifier: "SignIntoHome", sender: nil)
            }
        }
        }
    }

解説すると,emailTextField とpasswordTextFieldにテキストが入力されたら、ユーザー登録が行われるということになります。

ユーザー登録は

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

で行われるので新規登録する際はこのコードを書きましょう！[weak self]とguard let strongSelf = self else { return }は消してもらって大丈夫です！

全体はこんな感じ

SignInViewContoroller

import UIKit
import FirebaseAuth
class SignInViewController: UIViewController {

    @IBOutlet var emailTextField : UITextField!
    @IBOutlet var passwordTextField : UITextField!


    override func viewDidLoad() {
        super.viewDidLoad()


    }

    @IBAction func SignIn() {
        if let email = emailTextField.text,let password = passwordTextField.text {
        Auth.auth().signIn(withEmail: email, password: password) { authResult, error in
            if error != nil {
                       print("エラー")
                   }  else {
                       //ログイン成功した時
                       self.performSegue(withIdentifier: "SignIntoHome", sender: nil)
                   }

        }
        }
    }

}

お疲れ様でした！

今回は、新規登録・ログインを実装しました！
次回は実際に投稿する機能をつけて行きます！