🔑

SwiftUI × Firebase Authで認証機能を追加する ~準備編~(1/2)

に公開

1. はじめに

個人開発しているiOSアプリに認証機能を追加する機会があったので、手順を残しておくことにしました。

2. 手順

今回は「メール認証」と「Google認証」の2つを追加することを前提とし、手順を記載します。

2.1. Firebase環境での準備

以下のリンクからFirebaseプロジェクトを作成します。

https://console.firebase.google.com/

2.1.1. プロジェクトの作成

リンク先からFirebaseプロジェクトを作成するをクリックする

プロジェクト作成手順01

プロジェクト名に任意のプロジェクト名を入力する

プロジェクト作成手順02

Geminiの有効/無効設定に関しては、デフォルト設定のままにする

プロジェクト作成手順03

Googleアナリティクスに関しても、デフォルト設定のままにする

プロジェクト作成手順04

Googleアナリティクスアカウントは任意のアカウントを選択する

プロジェクト作成手順05

2.1.2. アプリの登録

今回はiOSアプリに対して機能追加するため、iOSアプリを登録します。

ホーム画面からiOS+をタップする

アプリ登録手順01

AppleバンドルIDを入力する

アプリ登録手順02

設定ファイルをダウンロードし、Xcodeプロジェクトのルートフォルダに追加する

アプリ登録手順03

「Firebase SDKの追加」と「初期コードの追加」は飛ばして、手順を終了する

アプリ登録手順04

2.1.3. Firebase Authのセットアップ

※今回はメール認証/Google認証の2つをセットアップします。

Authenticationの追加

Firebase Authのセットアップ01

Firebase Authのセットアップ02

メール認証のセットアップ

メール/パスワードをクリックする

メール認証のセットアップ手順01

設定を有効にし保存する

メール認証のセットアップ手順02

Google認証のセットアップ

新しいプロバイダを追加をクリックする

Google認証のセットアップ01

Googleをクリックする

Google認証のセットアップ02

プロジェクトの公開名プロジェクトのサポートメールを入力する

Google認証のセットアップ03

メール認証/Google認証の2つのセットアップが完了していることを確認する

Google認証のセットアップ04

2.2. Xcode環境での準備

Xcodeプロジェクトにライブラリを追加します。

2.2.1. メール認証用のライブラリ追加

以下のリンクを参考にメール認証用のライブラリを追加します。

Appleプラットフォームでパスワードベースのアカウントを使用してFirebase認証を行う

2.2.2. Google認証用のライブラリ追加

以下のリンクを参考にGoogle認証用のライブラリを追加します。

AppleプラットフォームでGoogleログインを使用して認証する

2.2.3 手順

ライブラリを追加手順は「メール認証」「Google認証」共に同じ手順になるので、以下にまとめて記載します。

XcodeプロジェクトにてAdd Package Dependenciesをクリックする

ライブラリ追加手順01

検索窓に以下2種類のリポジトリURLを入れてライブラリを追加する

Firebase AppleプラットフォームSDKリポジトリ

https://github.com/firebase/firebase-ios-sdk.git

GoogleログインSDKリポジトリ

https://github.com/google/GoogleSignIn-iOS

※1つずつ追加する必要があります。
ライブラリ追加手順01

Info.plistに「GIDClientID」と「CFBundleURLTypes」を追加する

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">
<plist version="1.0">
<dict>
    <!-- クライアントID -->
    <key>GIDClientID</key>
    <string>YOUR-CLIENT-ID.apps.googleusercontent.com</string>
    
    <!-- Google認証のためのURLスキーム設定 -->
    <key>CFBundleURLTypes</key>
    <array>
        <dict>
            <key>CFBundleTypeRole</key>
            <string>Editor</string>
            <key>CFBundleURLSchemes</key>
            <array>
                <string>com.googleusercontent.apps.YOUR-CLIENT-ID</string>
            </array>
        </dict>
    </array>
</dict>
</plist>

実装編に続く

https://zenn.dev/jnch/articles/57a170bcbb6fa6

Discussion