Firebase Cloud MessagingをつかってiOSアプリにプッシュ通知を送ろう（後編）

## 前編のあらすじ

この記事は、iOSアプリにプッシュ通知を送りたいので、Firebase Cloud Messagingでプッシュ通知を送ってみたときの手順を紹介するものです。

[前編](https://qiita.com/toshi586014/items/5dea32faab94828fae75)では、XcodeとFirebaseのプロジェクト作成からはじまり、長い手順を通り抜けてプッシュ通知証明書（APNs証明書）を作成することができました。

後編では、Xcodeのプロジェクトにプッシュ通知対応を実装し、Firebaseに証明書を登録して、実際にプッシュ通知を送るところまでをお送りします。

## Xcodeプロジェクトのプッシュ通知対応

Xcodeのプロジェクトをプッシュ通知に対応します。

FirebaseTest.xcworkspaceをダブルクリックしてXcodeを開きましょう。

画面左のナビゲーターエリアの一番上にある「FirebaseTest」を選択します（フォルダアイコンのではなく、Xcodeマークの入った青いアイコンのほうです）。
画面真ん中のエディタエリアのアウトラインペインにある「TARGETS」の「FirebaseTest」を選択します（PROJECTのほうではないのでご注意ください）。画面上のタブにある「Capabilities」をクリックして、「Push Notifications」をONにします。

<img width="1512" alt="057.png" src="https://qiita-image-store.s3.amazonaws.com/0/38924/a270f212-e4e5-549f-f695-444e51fa5507.png">


AppDelegate.swiftに通知の許可を表示するコードと、プッシュ通知を受信するコードを追加します。

``` Swift
import FirebaseMessaging
import UserNotifications
```

``` Swift
        if #available(iOS 10.0, *) {
            // For iOS 10 display notification (sent via APNS)
            UNUserNotificationCenter.current().delegate = self
            
            let authOptions: UNAuthorizationOptions = [.alert, .badge, .sound]
            UNUserNotificationCenter.current().requestAuthorization(
                options: authOptions,
                completionHandler: {_, _ in })
        } else {
            let settings: UIUserNotificationSettings =
                UIUserNotificationSettings(types: [.alert, .badge, .sound], categories: nil)
            application.registerUserNotificationSettings(settings)
        }
        
        application.registerForRemoteNotifications()
```

<img width="1512" alt="058.png" src="https://qiita-image-store.s3.amazonaws.com/0/38924/d19b4fa1-766f-c4e9-bccd-56a57856363a.png">


``` Swift
    func application(_ application: UIApplication, didReceiveRemoteNotification userInfo: [AnyHashable: Any]) {
        // Print message ID.
        if let messageID = userInfo["gcm.message_id"] {
            print("Message ID: \(messageID)")
        }
        
        // Print full message.
        print(userInfo)
    }
    
    func application(_ application: UIApplication, didReceiveRemoteNotification userInfo: [AnyHashable: Any],
                     fetchCompletionHandler completionHandler: @escaping (UIBackgroundFetchResult) -> Void) {
        // Print message ID.
        if let messageID = userInfo["gcm.message_id"] {
            print("Message ID: \(messageID)")
        }
        
        // Print full message.
        print(userInfo)
        
        completionHandler(UIBackgroundFetchResult.newData)
    }
```

<img width="1512" alt="059.png" src="https://qiita-image-store.s3.amazonaws.com/0/38924/912d44e4-a59a-33c2-06f9-286b55c1086e.png">


``` Swift
@available(iOS 10, *)
extension AppDelegate : UNUserNotificationCenterDelegate {
    func userNotificationCenter(_ center: UNUserNotificationCenter,
                                willPresent notification: UNNotification,
                                withCompletionHandler completionHandler: @escaping (UNNotificationPresentationOptions) -> Void) {
        let userInfo = notification.request.content.userInfo
        
        if let messageID = userInfo["gcm.message_id"] {
            print("Message ID: \(messageID)")
        }
        
        print(userInfo)
        
        completionHandler([])
    }
    
    func userNotificationCenter(_ center: UNUserNotificationCenter,
                                didReceive response: UNNotificationResponse,
                                withCompletionHandler completionHandler: @escaping () -> Void) {
        let userInfo = response.notification.request.content.userInfo
        if let messageID = userInfo["gcm.message_id"] {
            print("Message ID: \(messageID)")
        }
        
        print(userInfo)
        
        completionHandler()
    }
}
```

<img width="1512" alt="060.png" src="https://qiita-image-store.s3.amazonaws.com/0/38924/0aceb4cc-c737-2d25-0ec3-3fc68bd48865.png">


Device登録した実機をMacに接続して、実行してみましょう。
通知の許可を求めるアラートが表示されるので、許可をタップします。

<img width="414" alt="060-01.PNG" src="https://qiita-image-store.s3.amazonaws.com/0/38924/ac2cb92d-af10-543b-bd33-578edee656fe.png">


Xcodeプロジェクトのプッシュ通知対応はこれで完了です。

## Firebaseへの証明書登録

次に、Firebaseにプッシュ通知用の証明書を登録します。

FirebaseのConsole画面を開いて、画面左上の歯車ボタンをクリックして、「プロジェクトの設定」をクリックします。

![061.png](https://qiita-image-store.s3.amazonaws.com/0/38924/6d523d96-cf95-682d-1693-2e7aec7e4848.png)


画面上のタブで「クラウドメッセージング」をクリックします。

![062.png](https://qiita-image-store.s3.amazonaws.com/0/38924/3267c05f-8e58-3a30-1ab4-7163c7e87be5.png)


iOSアプリのなかに、さきほど登録した「FirebaseTest」があるので、これをクリックします。APNs証明書の「開発用APNs証明書がありません」と書かれた横にある「アップロード」をクリックします。

![063.png](https://qiita-image-store.s3.amazonaws.com/0/38924/ec3d8af2-62a9-927b-40e2-78c2cd910589.png)


アップロード画面が表示されるので、「参照」ボタンをクリックしてさきほど作成して「プッシュ通知証明書.p12」を選択します。証明書のパスワード欄には、p12ファイルを作成するときに設定したパスワードを入力します。

![064.png](https://qiita-image-store.s3.amazonaws.com/0/38924/09e0c2de-c439-f661-6bd3-1d50791d580e.png)


準備ができたら、「アップロード」ボタンをクリックします。

![065.png](https://qiita-image-store.s3.amazonaws.com/0/38924/b46d0d57-0cf5-cded-fbd1-7fa94ddd8f94.png)


アップロードが終わって、開発用APNs証明書が登録されました。

![066.png](https://qiita-image-store.s3.amazonaws.com/0/38924/0b59df05-0e24-b295-7cbf-40bff9e9e09c.png)


これで、Firebaseに証明書を登録できました。

## プッシュ通知を送信

いよいよプッシュ通知を送信します。

FirebaseのConsole画面を開いて、画面左の「拡大」をクリックして、「Cloud Messaging」をクリックします。右側にCloud Messaging画面が表示されるので、「最初のメッセージを送信」をクリックします。

![067.png](https://qiita-image-store.s3.amazonaws.com/0/38924/2af136a3-d533-9933-7ad7-c5bbfb4ba0ad.png)


メッセージ文にプッシュ通知で送りたい文章を入力して、配信日は「今すぐ送信」にします。

![068.png](https://qiita-image-store.s3.amazonaws.com/0/38924/2160e40b-7d49-bec2-4bd3-83e1946684cf.png)


ターゲットは「ユーザーセグメント」にして、「アプリ」の横をクリックしてプッシュ通知を送信したいアプリを選択します。
内容を確認して、「メッセージを送信」ボタンをクリックします。

![069.png](https://qiita-image-store.s3.amazonaws.com/0/38924/df940ddc-576b-1f59-a625-a7a1d6368a67.png)


無事にプッシュ通知が届きました！

<img width="414" alt="070.jpeg" src="https://qiita-image-store.s3.amazonaws.com/0/38924/bf4a3ede-ddf1-62b8-cc52-44bc8c476991.jpeg">


## 終わりに

おつかれさまでした。
プッシュ通知を送るだけなのに手順が多くて大変！　と感じたかもしれません。
しかし、自前でサーバーを用意したり、サーバーサイドのプログラムを書いたりしなくてもいいので、プッシュ通知を導入するための敷居はとても低いです。
個人や小さなチームで開発するアプリでプッシュ通知を送りたいときには、ぜひFirebaseをご検討ください。

今回使用したp12証明書には、一年間の有効期限があります。
有効期限が切れると証明書を送れなくなるので、必ず期限内に新しい証明書を作成して、もう一度登録しましょう。

それでは、良いプッシュ通知ライフを！

## 追記

[Firebaseの管理画面からプッシュ通知を送る方法](https://qiita.com/toshi586014/items/63ef8eed6387634bc22c)を書きました。