Firebase (iOS) : Facebookログイン Xcodeの設定とログイン動作テスト編

広告:超オススメUnity Asset
  広告:超オススメUnity Asset

Xcodeの方で必要な設定を行い、その後、Facebookログインの動作テストをしてみます。FacebookとTwitterそれぞれのSDKでは、そこそこややこしい設定を行っておく必要があります。Firebaseのスタートガイドではこの部分は割愛されており、各SDKのガイドを参照する必要があります。

注意すべき点は、ここではFacebookログインボタンを設置し動作テストするものの、Firebaseとの紐付けはまだというところです。Facebookで認証した後、Firebaseのユーザへ紐付ける部分については、また別のMEMOで書こうと思います。(なかなか手間がかかるもんです・・)

00

Facebook SDK で必要な構成

Facebook SDK スタートガイドにある程度即してやってみます。

Swift Package Managerを使用して、iOS用Facebook SDKにフレームワークを実装できます。

ステップ1: iOS用にFacebookアプリ設定を構成する

  1. 次のボタンをクリックして、アプリケーションを選択し、Facebookのアプリダッシュボードを開きます。
    [Facebookアプリダッシュボードを開きます。]
  2. 左側のナビゲーションの[設定]を選択します。
  3. ページ下部の[プラットフォームを追加]をクリックし、[iOS]を選択します。

ここは書かれているとおり。

01

02

  1. XcodeのバンドルIDを調べて、クリップボードにコピーします。
  2. アプリダッシュボードに戻り、[バンドルID]フィールドに貼り付けます。
  3. [シングルサインオン]を有効にします。
  4. アプリダッシュボードウィンドウ下部の[変更を保存]をクリックします。

03

ステップ3は、SDKを手動でインストールする流れが書かれていますが、ここは、CocoaPodsですでにセットアップされていると思います。(まだの方はこちら

ステップ4 : Xcodeプロジェクトを構成する

  1. Xcodeでプロジェクトの.plistファイルを副ボタンでクリックし、[Open As] -> [Source Code]の順に選択します。
  2. 次のXMLスニペットを、ファイル本文の最後の</dict>の直前に挿入します。
ここは、Xcodeでの設定です。認証のためにFacebookアプリを起動したりする際に必要な記述ですね。(フォトライブラリへアクセスする理由を書く必要があるのはなぜかよくわからんです)
info.plistはソースコードとして開くとxmlとして書き込むことができ、そこへガイドの内容をそっくりペーストし、{}で囲まれた部分だけ内容を書き換えます。
04
  1. fb{your-app-id}は、自分のFacebookアプリIDの先頭にfbを付けたものと置き換えてください。fb123456のようになります。アプリIDはFacebookアプリダッシュボードで確認できます。
  2. {your-app-id}は自分のアプリIDに置き換えます。
  3. {your-app-name}は、アプリダッシュボードで指定した表示名に置き換えます。
  4. {human-readable reason for photo access}は、アプリが写真にアクセスする理由に置き換えます。
05
 

ステップ5: アプリデリゲートに接続する

FacebookログインやFacebookダイアログなど、ネイティブのFacebookアプリまたはSafariに切り替えが必要なアクション結果の後処理の際、AppDelegateクラスをFBSDKApplicationDelegateオブジェクトに連携させる必要があります。これには、次のコードをAppDelegate.mファイルに追加します。

 ログイン認証の際に、いったんFacebookアプリやSafariに切り替わったりしますが、その後に再度このアプリに戻ってきた時に、その情報を受け取る箇所を用意しておかねばいけませんね。これをやっておかないと、認証は得たもののその後ウンともスンとも言わない状態になってしまいます。

サンプルがObjective-Cで書かれているので、Swiftで書き直してみます。「AppDelegate.swift」を開き、まず「import FBSDKCoreKit」を追加、didFinishLaunchingWithOptionsreturnの直前くらいに

FBSDKApplicationDelegate.sharedInstance().application(application, didFinishLaunchingWithOptions: launchOptions)

の1行を加えておきます。

06

次に、デフォルトで用意されているメソッドにはないものを入れます。「open」と入力すると候補が出てくるので、選択して書き込みます。

07

08

code部分に

let handled:Bool = FBSDKApplicationDelegate.sharedInstance().application(app, open: url, options: options)
return handled

と書いておきました。(これで動くかな?)

09

ステップ6: App Eventsを追加する

これはついでだと思いますが、アプリを利用しているユーザのログを取るものですね。FirebaseのAnalytics機能でもこうしたカスタムイベントの記録は取れますが、Facebookでも独自のカスタムイベントを定義して記録することができるようです。

applicationDidBecomeActiveFBSDKAppEvents.activateApp()です。

10

ログインボタンを設置してFacebookログインの動作を確認

をSwiftで書いて試してみます。

11

ViewController.swiftのviewDidLoad内に

let loginButton:FBSDKLoginButton = FBSDKLoginButton()
loginButton.center = self.view.center
self.view.addSubview(loginButton)

と書くとFBSDKLoginButtonを中央に配置することができます。このボタンはFacebookログインに必要なことを一通りやってくれるボタンなので、テストとしてはちょうどいいですね。

ボタンを押すと、シミュレータでは、SFSafariViewControllerでFacebook認証ページが開きますね。このページは、一度ログインして許可すると、Facebookアカウントの方でアプリを削除するまで出てこなくなります。このログインボタンでのテストでは、「公開プロフィール」までで、Emailは取れていないところにも注目です。Emailを取得にはそれに必要なパーミッションで許可を要求する必要があります。

12

ログインして、許可すると、テストで配置した「Continue with Facebook」というボタンは、「Log out」というボタンに変化します。これはログインされている状態であることを示しています。アプリをいったん終了して再度アプリを起動すると、起動直後「Log out」となり、セッションが生きていることも確認できます。

これでFacebookログイン自体の動作は正常に動作していることを確認できました。冒頭でも書きましたが、この状態はあくまでもFacebookのログインであって、Firebaseとはまだ紐付いていません。Firebaseのコンソールで確認してもユーザは作成されていないことが確認できると思います。

14

次にこれと同様にTwitterログインの方の設定を行い、その後、Firebaseとの紐付けを行おうと思います。