プッシュ通知に必要な証明書の作り方2023

2023/01動作確認及び掲載内容の確認が完了しました🎉<br>手順を画像と共に紹介していますので、参考にしてください:+1:

# 概要
* アプリを作るとき「プッシュ通知機能があったらいいな！」と思いませんか？でもどうやったら良いんだろ？と思う方も多いはず！そこで、今回は必要な証明書周りの話を書いてみました^^*
* この Qiita 記事で必要な証明書類の作成ができます
  * ただしリリース用ではなく開発用の作成手順を書かせていただいています。リリース用も同じような手順でできますのでまずは開発用でチャレンジしてみてください
* プッシュ通知 ASP サービスには [__ニフクラ mobile backend__ ](https://mbaas.nifcloud.com/)を使っています
* mobile backend を利用してプッシュ通知機能の実装をする場合は以下ドキュメントを参考にしてください:pray:
   * Xcode > Swiftはこちら　
      * https://mbaas.nifcloud.com/doc/current/push/basic_usage_swift.html ※本家ドキュメント
      * __↓すぐ動作確認したい方におすすめのサンプルあります:point_up:__<br> [【Swift】iOSアプリにプッシュ通知を実装したサンプルアプリを作ってみた \- Qiita](https://qiita.com/natsumo/items/ebba9664494ce64ca1b8) ※オリジナルコンテンツ
   * Xcode > Objective-Cはこちら　
      * https://mbaas.nifcloud.com/doc/current/push/basic_usage_ios.html ※本家ドキュメント
   * Monaca はこちら　※オリジナルコンテンツ
      * https://github.com/natsumo/MonacaPushQuickStart
* [__ニフクラ mobile backend__ ](https://mbaas.nifcloud.com/)はBasicプランなら __無料__ で使えますので、気軽に使ってみてください:+1:

# プッシュ通知の仕組み

プッシュ通知を送るには __APNs__ と連携、さらにプッシュ通知の配信依頼には別途サーバーが必要です。サーバーを用意しなければいけないの？？…じゃあ無理だ、、という方に朗報！！ [ニフクラ mobile backend ](https://mbaas.nifcloud.com/about.htm)でサーバーの部分は解決！（詳しい使い方は上記[概要](https://qiita.com/natsumo/items/d5cc1d0be427ca3af1cb/#概要)に掲載のリンク先をご覧ください:pray:）

さて、ではAPNsと配信サーバー（ここでは mobile backend）の関わりと配信までの流れを見ていきましょう。

![Push仕組み_APNs.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/112032/61f01c27-da2d-b80f-013c-e85401b44f77.png)

* プッシュ通知の受信設定がされたアプリが起動されると、「①プッシュ通知の許可」依頼がAPNsにリクエストされます
* 許可依頼が通ると、レスポンスとしてAPNsから「②デバイストークンが発行」されます
* 配信サーバーとして mobile backend を利用している場合は、「②デバイストークンが発行」されたタイミングで、mobile backend に発行された「③デバイストークンの登録」処理がされます
* ここまでの処理がされている状態でプッシュ通知の配信依頼ができるようになります
* プッシュ通知の配信依頼を受けた配信サーバー（mobile backend）は「③デバイストークンの登録」で登録されたデバイストークン宛に「④プッシュ通知」の配信依頼をAPNsに向けてリクエストします
* APNsは該当の端末（アプリ）に向けて「⑤プッシュ通知」を届けます

ここでは省きましたが、上記①～⑤の流れを実現するには、APNsとの認証のために各種証明書を作成して、アプリ側及び配信サーバー側（mobile backend）に設定しておく必要があります。本ブログにて、必要な各種証明書を一式作成していきましょう。

# プッシュ通知を送るために準備するもの

※記載のバージョンは動作確認時に用いたものです。参考にしてください。

* macOS Monterey 12.6.1
* Xcode 14.0.1
* iOS 15.7 (iPhone 11 Pro)
  * Xcodeのバージョンと対応するバージョンである必要があります
* [Apple Developer Program](https://developer.apple.com/programs/jp/)の登録（:warning:__有償__：99米ドル/年または現地通貨の同等額）
  * または Apple Developer Enterprise Program （有償：299米ドル/年または現地通貨の同等額）の登録

# 作成するものと順序
プッシュ通知を送るために作成するもの・しておくことは以下の７つあります

1. CSRファイルの作成 _※初回作成すれば後は同じものを使いますので改めて作成不要です_
2. 開発用ビルド証明書(.cer)の作成 _※初回作成すれば後は同じものを使いますので改めて作成不要です_
3. AppIDの作成
4. 端末の登録
5. プロビショニングプロファイルの作成
6. APNs用証明書(.cer)の作成
7. APNs用証明書(.p12)の作成

それぞれ以下の関係で参照されています
![132.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/112032/ee637f3e-60b2-8d22-5882-bdb5fa6b7eab.png)


※サーバーには [ニフクラ mobile backend ](https://mbaas.nifcloud.com/)(無料) を使っています

# 作成方法
## 1. CSRファイルの作成　　
__※初回作成すれば後は同じものを使いますので改めて作成不要です__

* キーチェーンアクセスを開きます
* 「キーチェーンアクセス」＞「証明書アシスタント」＞「認証局に証明書を要求」をクリックします
* 「ユーザーのメールアドレス」を入力します<br>（「通称」はそのまま、「CAのメールアドレス」は空欄でOK）
* 「要求の処理」は「ディスクに保存」を選択し「鍵ペア情報を設定」にチェックを入れます
* 「続ける」をクリックします

<img src="https://qiita-image-store.s3.amazonaws.com/0/112032/60251020-5f5d-2da3-47f5-f29ac8bea467.png" alt="APNs_02.PNG" width="700px">

* 保存先の選択が出るので任意の場所を選択し「保存」をクリックします
* 「鍵ペア情報」画面を確認して「続ける」をクリックします
* 「設定結果」画面が出るので「完了」をクリックします

![APNs_03.PNG](https://qiita-image-store.s3.amazonaws.com/0/112032/af651129-816b-ba65-d7e4-a6704e02adaf.png)

## 2. 開発用ビルド証明書(.cer)の作成
__※初回作成すれば後は同じものを使いますので改めて作成不要です__

* [Apple Developer Program](https://developer.apple.com/account/) にログインします
* 「Certificates, Identifiers & Profiles」＞「Certificates」をクリックします

<img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/112032/c4cf644c-454a-077f-7fbf-f6826d751581.png" alt="APNs_04.PNG" width="300px">

* 「Certificates」の隣にある「+」をクリックします
* 「Create a New Certificate」画面が表示されるので設定していきます
* 「iOS App Development」にチェックをいれ、右上の方の「Continue」をクリックします

<img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/112032/25156ec7-8958-b5f3-2991-45e734276b27.png" alt="APNs_05.PNG" width="500px"/>

* 「Choose File」をクリックして、1.で作成した「CSRファイルの作成」を選択し、「Continue」をクリックします

<img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/112032/d1da8024-b38d-fd0d-9c86-6968288b1c7e.png" alt="APNs_06.PNG" width="500px">

* 開発者用証明書が作成されるので、「Download」をクリックして書き出しておきます

<img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/112032/71994c70-5642-3a3b-a48a-e1eda5875fdb.png" alt="APNs_07.PNG" width="550px">

* 開発用ビルド証明書(.cer)の作成は完了です
* 左上の「All Certificates」をクリックして「Certificates, Identifiers & Profiles」の画面に戻ります

## 3. App ID の作成
* 左のメニューから「Identifiers」をクリックします
  * 2.の作業がスキップだった場合は、[Apple Developer Program](https://developer.apple.com/account/)にログインして、「Certificates, Identifiers & Profiles」＞「Identifiers」をクリックします（※2.の画像参照）

* 「Identifiers」の右の「＋」をクリックします
* 「Register a New Identifier」が表示されるので「App IDs」にチェックをいれ、右上の方の「Continue」をクリックします

![3.1.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/112032/3a1d5235-e8c0-c038-431f-32a1e80d3baa.png)

* 「Selet a type」が表示されるので「App」を選択し、右上の方の「Continue」をクリックします

![3.0.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/112032/c715f831-d653-6cc3-ebd6-518731c13053.png)

* 「Description」にアプリの概要を記入します `例） TestPushApp`
* 「Bundle ID」では「Explicit」を選択し、「Bundle ID」を入力します
  * 「Wildcard」を選択するとプッシュ通知が利用できないので注意！
  * 「Bundle ID」は __アプリ側で同じものを設定します__ ので必ず控えておきましょう！

![3.2.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/112032/963e2768-6c55-ef73-8103-974c357312de.png)

* 下にスクロールして「Capabilities」の「Push Notifications」にチェックを入れます
  * これを忘れるとプッシュ通知が利用できないので注意！ 
* 「Continue」をクリックします

<img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/112032/b7ceaff4-0ee5-2f7a-0e3c-7f58fa390aac.png" alt="APNs_09.PNG" width="450px">

* 確認画面が表示されるので「Push Notifications」にチェックが入っている事を確認して「Register」をクリックします

<img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/112032/8bb5231e-9833-3979-a46e-2cf8ddfde274.png" alt="APNs_10.PNG" width="450px">

* これでApp ID 作成は完了です

## 4. 端末の登録

* 左のメニューから「Devices」をクリックして、「Devices」の隣にある「＋」をクリックします
* 「Platform」は「iOS, tvOS, WatchOS」に選択します
* 端末の「Device Name」と「Device ID(UDID)」を入力します

<img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/112032/a3d8fddd-c4a6-6a71-f517-cefb6bf74ed7.png" alt="APNs_11.PNG" width="400px">

* 「Device Name」は自由に設定できます
* 「Device ID(UDID)」はXcodeを使うと確認し易いです
  * Mac に端末を接続し、Xcodeを起動します
  * 「Window」＞「Devices and Simulators」をクリックします
  * 「identifier」としてUDIDが確認できます

![APNs_12.PNG](https://qiita-image-store.s3.amazonaws.com/0/112032/1e63be40-93eb-d7ca-4f56-64da7fa56ea9.png)

* 記入できたら「Continue」をクリックします
* 次の画面で端末情報を確認して「Register」をクリックします
* これで端末登録は完了です

## 5. プロビショニングプロファイルの作成
* 左のメニューから「Profiles」をクリックして、「Profiles」の隣にある「＋」をクリックします
* 「Development」の「iOS App Development」を選択し、「Continue」をクリックします

<img width="947" alt="スクリーンショット 2020-02-19 14.49.29.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/112032/409bbbb2-acf0-ae35-9c97-eb8cc1f84139.png">

* 利用する App ID、開発用ビルド証明書、端末をそれぞれ紐付けていきます
* 3.で作成したApp IDを選択し、「Continue」をクリックします

<img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/112032/6cac5fa4-09bb-3071-f733-8fff0d340b16.png" alt="APNs_13.PNG" width="550px">

* 2.で作成した（あるいは既存の） 開発用ビルド証明書 を選択し、「Continue」をクリックします

![5.2.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/112032/30429e9c-0294-72df-8913-5bc0bb264b81.png)

* 4.で登録した（あるいは既存の）端末を選択し、「Continue」をクリックします

![5_3.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/112032/34b40f2b-7c0b-9ec3-1236-5bc985adeb04.png)

* 最後に「Provisioning Profile Name」にファイル名入力します `例） TestPushApp Provisioning Profiles`
* 紐付けを確認し「Generate」をクリックします

![5_4.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/112032/9d29391d-f8f9-b82c-50e4-754ea609703f.png)

* プロビショニングプロファイルがが作成されるので、「Download」をクリックして書き出しておきます

![5_5.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/112032/9d744e77-8cc2-1aef-1e84-3ef7fc3a8ba5.png)

* プロビショニングプロファイルの作成は完了です
* 左上の「All Profiles」をクリックして「Certificates, Identifiers & Profiles」の画面に戻ります

## 6. APNs用証明書(.cer)の作成

* 左のメニューから「Certificates」をクリックして、「Certificates」の隣にある「＋」をクリックします
* 2.で開発用ビルド証明書を作成したときとは異なり、下にスクロールし、「Service」の「Apple Push Notification service SSL (Sandbox)」をチェックに入れます
* 「Continue」をクリックします

![6.1.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/112032/de570bfe-9c12-7dad-8209-dedcb8bbb036.png)

* 3.で作成した App ID を選択し、「Continue」をクリックします

![6_2.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/112032/7ea63d35-1a90-afec-df0f-e6dfe2d8cc98.png)

* 1.で作成した（あるいは既存の）CSRファイルを選択し、「Continue」をクリックします

![6.3.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/112032/4a73668a-4863-254f-f56a-0b0c2352f298.png)

* APNs用証明書(.cer) が作成されるので、「Download」をクリックして書き出しておきます

![6_4.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/112032/f581f18e-59c3-35c2-b0b7-19b014d4ec37.png)

* APNs用証明書(.cer) の作成は完了です
* 左上の「All Certificates」をクリックして「Certificates, Identifiers & Profiles」の画面に戻ります

## 7. APNs用証明書(.p12) の作成
* 6.で作成した「APNs用証明書(.cer)」をダブルクリックしてキーチェーンアクセスを開きます
* APNs用証明書(.cer) の左にある三角マークをクリックして開きます
  * APNs用証明書(.cer) ファイルには鍵がセットされています

![7-1.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/112032/4bd64ccb-ca02-e16a-92f1-c3f946f9465b.png)

### （参考）ここでもし「証明書が信頼されていません」と出た場合の対処方法

キーチェーンアクセスで「証明書が信頼されていません」と表示された場合は、下記の中間証明書を追加する必要のあります：

* Worldwide Developer Relations - G3 (Expiring 02/20/2030 00:00:00 UTC)
  * ビルド用証明書の信頼に必要（試しに2.で作成した「開発用ビルド証明書(.cer)」もダブルクリックしてみましょう！）
* Worldwide Developer Relations - G4 (Expiring 12/10/2030 00:00:00 UTC)
  * プッシュ通知証明書の信頼に必要

上記中間証明書は、下記のサイトでダウンロード可能です。ダウンロード後ダブルクリックでキーチェーンアクセスに反映することでエラーが解消されます。

* Apple PKI
  * https://www.apple.com/certificateauthority/
  * （参考）関連情報
    * https://ulog.sugiy.com/mac-keychain-certificate-trust/
https://developer.apple.com/jp/news/?id=5zb13auf

---

* APNs用証明書(.p12) を書き出すには、開いた状態で __鍵ではなく証明書の上で右クリック__ をして「～を書き出す…」をクリックします

![7-2.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/112032/6b1bad22-0b94-2ec4-3082-fb7692581e56.png)


* ファイル名「名前」と保存先「場所」を指定して「保存」をクリックします
* パスワードを求められますが、 __何も入力しない__ で「OK」をクリックします

![APNs_22.PNG](https://qiita-image-store.s3.amazonaws.com/0/112032/2a238ba1-1839-28f7-f5bf-f6e5baa14d91.png)

※この後、システム側にパスワードを求められる場合があります。対応してください。

* APNs用証明書(.p12) が書き出されます
* APNs用証明書(.p12) 作成は完了です

これですべて必要なファイルが作成できました！

# 早速プッシュ通知の動作確認に進みたい方へ

冒頭に本家ドキュメント載せていますが、すぐに動作確認したい場合はサンプルアプリの利用が便利です！続きはこちらのブログへどうぞ！

[【Swift】iOSアプリにプッシュ通知を実装したサンプルアプリを作ってみた \- Qiita](https://qiita.com/natsumo/items/ebba9664494ce64ca1b8)

# 終わりに
　証明書の作成は、少し間違えるだけでプッシュ通知が正しく配信されない可能性があります。この方法で証明書を作成したのに上手くいかないのだけど…という方は下記内容をもう一度確認してみてください！

* __書類の作成順序を間違えている__
 * 最初に図で説明した通り、書類には参照の関係があります。上手く参照されていない可能性があります
* __途中で作成した書類を編集した__
 * 正しく作っていると思っていて、これで失敗していたことがありましたので注意！
* __開発用ビルド証明書が複数作成されている__
 * 混在してしまうとどちらを使用しているのかわからなくなってしまい上手くいかないことがあるようです。
* __CSRファイルが複数作成されている__
 * 混在してしまうとどちらを使用しているのかわからなくなってしまい上手くいかないことがあるようです。
* __AppIDを作成時に「Push Notifications」にチェックを入れ忘れている__
 * 上にも書きましたが意外とあるあるです
* __他にも可能性は…__