[ios][swift2]FacebookSDKを使ってFacebookログインするサンプルを動かす


[まとめ] 現在開催中のKindleセール情報はこちら

少し前に、Amazon Cognitoが東京リージョンで使えるようになったので使ってみようと思いました。

「とりあえずFacebookSDKを使ってiOSでFacebookログインするところをさくっと作ろう」と思い試してみたら、思った以上にハマったのでメモしておきます。

なお今回はFacebookログインできるようになったところまでで、Cognitoを使うところまでたどり着いていません。

FacebookログインできるようになったところまでのソースコードはGithubに上げてあります。

Swift2, FacebookSDK v4.7.0で確認

hilotter/swift2-facebook-login-sample

サンプルコードの動かし方

上記のサンプルコードを動かす際は、ご自身のFacebookアカウントでFacebookアプリを作っていただく必要があります。(公開前のFacebookアプリは本人もしくは許可したアカウントしか認証できないため)

まずはFacebook Developersにアクセスし、Facebookアプリの作成を行ってください。

アプリ作成後に、Facebook SDKをダウンロードし、解凍したSDKを「~/Documents/FacebookSDK」に配置してください。

その後、ソースコードをcloneし、Info.plistをエディタで開いて、FacebookAppIDとFacebookDisplayNameを適宜書き換えてください。

# fblogin/Info.plist

<key>FacebookAppID</key>
<string>Your Facebook App ID</string>
<key>FacebookDisplayName</key>
<string>Your Facebook App Display Name</string>

ここまで設定した状態で、「fblogin.xcodeproj」を開いてビルドを行うと、以下のようにFacebookログインボタンが表示され、ログインができるようになると思います。

fbsdk0

ログインが成功すると、デバッグエリアにログイン時に取得したユーザ名とメールアドレスが表示されます。

fbsdk2

これでFacebookログインができるようになったのですが、ここに至るまで色々ハマったのでメモを残しておきます。

以下、やったこととハマったこと

1. Facebookアプリの作成

Facebook DevelopersからiOS用のFacebookアプリ作成を行います。

するとSDKの導入方法等の解説が見れるのでまずはこの解説に沿って進めることにしました。

しかし、解説はObjective-Cの場合の導入手順だったので、以下のサイトの記事も参考にしながら進めました。

Tutorial: How To Use Facebook SDK 4.1.x in Swift

2. FacebookSDKを読み込む

Facebook SDK for iOSをダウンロードし、解凍したSDKを「~/Documents/FacebookSDK」に設置します。

その後Xcode側で「Framework」グループを作成し、そこに「FBSDKCoreKit.framework」と「FBSDKLoginKit.framework」、「FBSDKShareKit.framework」をドラッグアンドドロップします。

解説記事では、Bridge-Header.hを用意してライブラリを読み込む方法が解説されていましたが、現在はブリッジヘッダーを用意しなくても大丈夫になったようです。

最初、AppDelegate.swiftに「import FBSDKCoreKit」を追加してビルドを行ってみたところ、

No such module 'FBSDKCoreKit'

とエラーになってしまいました。(まずここでハマりました)

Stack Overflowの記事を発見し、「Build Settings」の「Framework Search Paths」に「~/Documents/FacebookSDK」を指定するようにしたところビルドできました。

3. ログインボタンの表示

SDKのパスを通すことができたので、解説記事を参考にAppDelegate.swiftとViewController.swiftを記述します。

解説記事からいじった部分としては、swift2ではprintlnがprintにrenameされたのでその修正をしています。

これで、ビルドを行うとFacebookログインボタンが表示されました。

ただ、ログインボタンを押すとアプリが落ちてしまいました。

4. カスタムURLスキームの内容をinfo.plistに記載

ログを見ると以下のようなエラーが残っていました。

Terminating app due to uncaught exception 'InvalidOperationException', reason: 'fbauth2 is missing from your Info.plist under LSApplicationQueriesSchemes and is required for iOS 9.0'

調べてみるとiOS9からはカスタムURLはあらかじめ許可したものだけが使えるようになったようで、Facebook DevelopersにもiOS9の場合の対応方法がまとめられていました。

ということでInfo.plistに以下を追加しました。

# fblogin/Info.plist

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

これで再度ビルドを行ったところ、Facebookログインダイアログが表示され、ログインすることができました。

5. ログイン後にユーザ情報を取得してみる

無事にログインすることはできたのですが、ログイン後にユーザ情報が正しく取得できているかが分からないので、ログにユーザ名とメールアドレスを表示するようにしてみます。

解説記事にreturnUserDataメソッドが用意されていたので、ログイン後にこのメソッドを呼び出すようにしてみます。

# ViewController.swift

if result.grantedPermissions.contains("email")
{
    // Do work
    returnUserData()
}

この状態で再度ビルドを行いFacebookログインしてみると、emailがnilとなってしまいアプリが落ちてしまいました。

調べてみるとreturnUserDataメソッドの

let graphRequest : FBSDKGraphRequest = FBSDKGraphRequest(graphPath: "me", parameters: nil)

の部分が問題らしく、これまではパラメータに何も指定しなくてもemailが含まれていたのですが、GraphAPI v2.4以降はemailは明示的に指定すべきパラメータとなったため、nilが返ってきていました。

以下のようにfieldsパラメータを明示的に指定するように修正しました。

let graphRequest : FBSDKGraphRequest = FBSDKGraphRequest(graphPath: "me", parameters: ["fields": "name,email"])

これで再度アプリを立ち上げ、ログインを行うとデバッグエリアにユーザ情報が表示されるようになりました。

fbsdk2

さくっと動かすつもりが、かなりハマってしまいましたが、これでFacebookログインを動かすことができました。

これでようやくCognitoが試せそうです。

参考

[まとめ] 現在開催中のKindleセール情報はこちら