【Swift】アプリとFirebaseの連携方法

#はじめに

アプリを作成するにあたり、ログインの機能はよく使用します。
AppleIDを使ったログインやTwitter、Facebookを使ったログインの方法があります。

今回は、それらの実装の簡略化やログイン後のアカウント管理を
行うことができるFirebaseと、アプリを連携するまでの手順を記載していきます。

実際のログインの実装は別記事で紹介しています。
・[FirebaseUIを使ってTwitterログイン機能を実装する](https://qiita.com/Kai_82/items/629050db71731aeffef5)


環境
・Swift version 5.3
・XCode version 12.3
CocoaPods version 1.10.1


#実装方法

Qiitaでは一ヶ月に投稿できる画像の容量が決まっているらしいので、
なるべく節約した最小限の画像にしたいと思います。申し訳ございません・・・。

##アプリ作成
ログイン機能を実装するアプリを作成します。
今回は、**SampleAppleLogin**というプロジェクト名で作成しました。

画像の**Bundle Identifier**をコピーしておいてください。
![スクリーンショット 2021-01-14 16.28.22.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/797483/ee36acf0-0daf-04c6-4ed4-1d2b2b6b623a.jpeg)

##Firebase 新規プロジェクト作成
Firebaseで新規プロジェクトを作成します。

Firebase consoleにアクセスしたら、`+ プロジェクトを追加`をクリック
-> プロジェクト名を指定して「続行」をクリック
-> `このプロジェクトで Google アナリティクスを有効にする`は無効にしてプロジェクトを作成
-> `プロジェクトを作成できました。`と表示されたら「続行」をクリック

##Firebaseとアプリの連携
`プロジェクトの概要`からiOSのボタンをクリックしてアプリを追加します。
![スクリーンショット 2021-01-14 16.39.37.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/797483/ed8cc38a-d7e5-84fd-8bf0-9cf4703e7f1a.jpeg)

①アプリの登録にて`iOS バンドル ID`を入力するフィールドがあるので、
こちらに先ほど作成したアプリのBundle Identifierをコピペしてください。

その他の入力は任意なので「次へ」をクリックします。

`GoogleService-Info.plist`をクリックしてダウンロードして「次へ」をクリック
![スクリーンショット 2021-01-14 16.43.12.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/797483/09c12f5b-683d-a257-f876-655b4233fabc.jpeg)

以降の項目の設定は後ほど行うので、
「次へ」 -> 「次へ」 -> 「コンソールへ進む」と進んでください。

これでFirebase側にアプリの登録をすることができたので、
アプリ側でFirebaseと連携するための処理を行います。

画面右上の虫眼鏡マークをクリックしてください。（もしくはcommand + スペースキー）
![スクリーンショット 2021-01-14 16.47.05.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/797483/9d1cf9d9-cf93-b3f1-cc14-74f6175cde4e.jpeg)
検索欄が出てくるので「ターミナル」と入力Enterを押します。

まず、ディレクトリの移動を行います。

cdコマンドでディレクトリを移動するのですが、
移動先は先ほど作成したアプリのPATHを入力してください。
私の場合は下記のようなコマンドになります。

よくわからない方は、作成したアプリのフォルダをドラッグ＆ドロップしてください。

```
$ cd Desktop/project/SampleAppleLogin 
```

次にPodfileの作成を行います。

```
$ pod init
```
念のためPodfileが作成されていることを確認します。
私の場合は、Podfileが作成され下記の状態になりました。

```
$ ls
Podfile				SampleAppleLogin		SampleAppleLogin.xcodeproj
```
Podfileの編集を行います。

```
$ vi Podfile
```
インストール対象を追記します。
追記するものは下記の２つになります。

```
pod 'FirebaseUI'
pod 'Firebase'
```

まず編集モードにする必要があるので、`i`を押します。
すると左下に`-- INSERT --`と表紙されると思います。

その状態ですと文字を入力することができます。

追記すると次のようになると思います。
（バージョンによって記載内容は多少異なります。）

```
# Uncomment the next line to define a global platform for your project
# platform :ios, '9.0'

target 'SampleAppleLogin' do
  # Comment the next line if you don't want to use dynamic frameworks
  use_frameworks!

  # Pods for SampleAppleLogin
  pod 'FirebaseUI'   // 追加
  pod 'Firebase'   // 追加

end
```
追記後にファイルを保存する必要があるので、
`esc`を押し編集モードを解除後、`:wq`を順に押し保存します。

その後、インストールを行います。

```
$ pod install
```

エラーが発生しなければOKです！

発生した場合はエラー内容でググってみてください。
（基本的にエラーは出ないはずです。）

Xcodeを一度閉じて、Finderからアプリを開くのですが、
この時`プロジェクト名.xcworkspace`のファイルを開いてください。

次に、Firebaseでプロジェクトを作成する際にダウンロードした、
`GoogleService-Info.plist`をアプリ内に置きます。

ViewController.swiftなどと同じ階層に置きます。
![スクリーンショット 2021-01-14 17.11.29.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/797483/968416b0-9170-beb3-684a-52e7015899a9.jpeg)

`GoogleService-Info.plist`クリックすると真ん中の画面が変わると思います。
その中の、`REVERSED_CLIENT_ID`の行のvalueの列の値をコピーしてください。

`com.googleuser 〜`といった内容だと思います。

一番上の階層のプロジェクト名をクリックすると真ん中の画面が変わると思います。
![スクリーンショット 2021-01-14 17.17.13.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/797483/4262d20c-490f-a3eb-d899-24f872077053.jpeg)
タグの中からInfoを選択してください。
一番下の`URl Types`を開き、`+`を押して追加します。

右上のURL Schemesに先ほどコピーしたものを貼り付けます。

次にAppDelegate.swiftを開き、下記のように編集します。
※ application( )メソッドは複数あるので間違えないようにしてください。

```swift:AppDelegate.swift

import Firebase    // 追加

func application(_ application: UIApplication, didFinishLaunchingWithOptions launchOptions: [UIApplication.LaunchOptionsKey: Any]?) -> Bool {
    // Override point for customization after application launch.
    FirebaseApp.configure()    // 追加
    return true
}
```
#さいごに

本記事は、FirebaseUIでログイン機能を実装する予定でしたので、
CocoaPodsでFirebaseUIをインストールしました。

別の方法でログインする場合はインストールする必要がない可能性があるので、
その方法にしたがってください。

また、ここまででは連携までしか終わっていないので、
実際のログイン機能の実装を行う必要があります。

そちらに関しての記事は下記になります。
・[FirebaseUIを使ってTwitterログイン機能を実装する](https://qiita.com/Kai_82/items/629050db71731aeffef5)

以上、最後までご覧いただきありがとうございました。