Edited at

iOSでfirebase + facebookログイン(SwiftSDK)の実装

More than 1 year has passed since last update.

Firebaseを使ったiOSアプリでfacebookログインを実装しようとした所、
Firebase AuthenticationのドキュメントSwiftSDKでなくiOS用SDK (ObjC SDK) でのやり方のようだったので、
SwiftSDKでの実装を以下にまとめます。

※ 2017/8/21追記

現時点ではSwiftSDKはBeta段階のSDKで、iOS用SDK (ObjC SDK)の方がバージョンが進んでますのでご注意下さい。


全体的なログイン処理の流れ


  • facebookのSDKに用意されたログインボタンが押下されるとsafariでfacebookのログイン画面を表示
    → ログインに成功したら(制御がiOSアプリに戻り)tokenからcredentialを取り出してFirebaseに渡して認証
    (既存ユーザはログイン、新規ユーザは新たにfirebase上でユーザが作られる)
    という感じです。


前提


  • Xcode8.3.3

  • Swift3.1

  • Firebaseのconsole上でアプリは作成済みとする


実装手順


プラットフォーム側の設定


  1. facebook上でアプリを作成



  2. Firebaseでfacebookログインを有効化する



    • Firebase consoleでアプリを選択肢、左タブの「Authentication」→ ログイン方法 にてfacebookを有効化し、(1で確認した)App ID, App Secretを入力

    • App Secret入力欄直下の「OAuthリダイレクトURI」を確認しておく



  3. facebookのアプリ設定画面にリダイレクトURIを設定


    • facebookアプリ設定画面の左タブの「Facebookログイン」→ 「有効なOAuthリダイレクトURI」に入力




iOSアプリの実装



  1. Podファイルに必要ライブラリを追加


    Podfile

      pod 'Firebase/Core'
    
    pod 'Firebase/Auth'
    pod 'FacebookCore'
    pod 'FacebookLogin'



  2. ライブラリインストール

    pod install



  3. info.plistにfacebookの情報を追加



    • facebook iOS SDKのページ にコピペ用の以下のようなコードが表示されている(はず)ので、
      info.plistの<dict>...</dict>に貼る

    <key>FacebookAppID</key>
    
    <string>XXXXX</string>
    <key>FacebookDisplayName</key>
    <string>XXXXX</string>
    <key>LSApplicationQueriesSchemes</key>
    <array>
    <string>fbapi</string>
    <string>fb-messenger-api</string>
    <string>fbauth2</string>
    <string>fbshareextension</string>
    </array>



  4. AppDelegate.swiftの修正


    AppDelegate.swift

    // 1. import文を追加
    
    import Firebase
    import FirebaseAuth
    import FacebookCore
    import FacebookLogin
    // 2. class宣言に LoginButtonDelegate を追加
    class AppDelegate: UIResponder, UIApplicationDelegate, LoginButtonDelegate {
    // 3. application:didFinishLaunchingWithOptions: に以下を追加
    FirebaseApp.configure()
    SDKApplicationDelegate.shared.application(application, didFinishLaunchingWithOptions: launchOptions as? [UIApplicationLaunchOptionsKey : Any])
    // 4. application:openUrl:options:を追加
    @available(iOS 9.0, *)
    func application(_ application: UIApplication, open url: URL, options: [UIApplicationOpenURLOptionsKey : Any])
    -> Bool {
    return SDKApplicationDelegate.shared.application(application,
    open: url,
    sourceApplication: options[UIApplicationOpenURLOptionsKey.sourceApplication] as? String,
    annotation: [:])
    }
    //5. loginButtonDidCompleteLogin:result:を追加
    func loginButtonDidCompleteLogin(_ loginButton: LoginButton, result: LoginResult) {
    switch result {
    case let LoginResult.failed(error):
    // いい感じのエラー処理
    break
    case let LoginResult.success(grantedPermissions, declinedPermissions, token):
    let credential = FacebookAuthProvider.credential(withAccessToken: token.authenticationToken)
    // Firebaseにcredentialを渡してlogin
    Auth.auth().signIn(with: credential) { (fireUser, fireError) in
    if let error = fireError {
    // いい感じのエラー処理
    return
    }
    // ログイン用のViewControllerを閉じるなど
    if let loginVC = self.window?.rootViewController?.presentedViewController{
    loginVC.dismiss(animated: true, completion: nil)
    }
    }
    default:
    break
    }

    }
    // 6. loginButtonDidLogOutを追加
    func loginButtonDidLogOut(_ loginButton: LoginButton) {
    // いい感じの処理
    }





  5. ログイン用のViewControllerの実装


    LoginViewController.swift

    import UIKit
    
    import FacebookLogin
    class LoginViewController: UIViewController {
    override func viewDidLoad() {
    super.viewDidLoad()

    let loginButton = LoginButton(readPermissions: [ .email ])
    loginButton.delegate = UIApplication.shared.delegate as! AppDelegate
    loginButton.center = view.center
    view.addSubview(loginButton)
    }





備考



  • FirebaseにログインしていればAuthオブジェクトからユーザ情報が取れるため、ログイン画面の表示については


    HogeViewController.swift

        if Auth.auth().currentUser == nil {
    
    self.performSegue(withIdentifier: "hogeToLogin", sender: nil)
    }

    こんな感じでアプリ起動時のViewControllerでチェック&ログイン画面に遷移するようにしてみました。