Amazon SNSを利用してモバイルプッシュ通知を送信するやり方ーコンソール利用

# 概要
モバイルプッシュ通知を送るのに、そのプッシュサービスを提供しているプラットフォームのAPIを直接に使うのが一番シンプルです。しかし、マルチプラットフォーム、たとえば、AndroidとiOSの同時対応の場合、実装の手間が倍になります。このような問題を解消するために、マルチプラットフォームに対応するプッシュサービスが現れてきました。Amazon SNSはその一つであり、AWSとの相性も抜群です。

# Amazon SNSを利用してモバイルプッシュ通知を送信するやり方
## 前準備
(1) <b>[Amazon SNS]</b> -> <b>[プッシュ通知]</b>に入ります。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/704548/92ff158e-756b-1bde-2950-5246fea04d60.png)

(2) <b>[プラットフォームアプリケーションの作成]</b>をクリックします。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/704548/886b1cf2-70ec-679e-9823-6c439c6764c9.png)

(3) <b>[アプリケーション名]</b>を入れ、<b>[プッシュ通知プラットフォーム]</b>で対象プラットフォームのを選び、右下の<b>[プラットフォームアプリケーションの作成]</b>ボタンをクリックします。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/704548/48166fca-7ac3-136b-bae9-3b222636ace5.png)

たとえば、もし<b>[Firebase Cloud Messaging (FCM)]</b>を選んだ場合、<b>[APIキー]</b>にFirebaseのサーバーキーを設定します。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/704548/c075373a-a8ef-0fab-0e7d-b3db7bde34f7.png)

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/704548/e78f51a6-900d-f2f1-4042-7a99857e8a4b.png)

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/704548/a02f609b-3a73-da70-2d5d-15789f8eedb6.png)

(4) 作成したプラットフォームアプリケーションに入り、<b>[アプリケーションエンドポイントの作成]</b>をクリックします。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/704548/4d0b49ca-80f8-f64d-6099-267a2195e1ed.png)

(5) ここに、送信先のモバイルデバイスのトークンを登録します。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/704548/96d38280-9ac9-e0ee-2b74-00fac7bbda2c.png)

(6) <b>[Amazon SNS]</b> -> <b>[トピック]</b>に入ります。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/704548/888275f1-195e-96d9-4f89-6966ed7cce59.png)

(7) <b>[トピック作成]</b>をクリックします。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/704548/80682119-6672-8f93-12b7-a2e98dbd888e.png)

(8) <b>[スタンダード]</b>を選び、<b>[名前]</b>にトピック名を入れてから、右下の<b>[トピック作成]</b>ボタンをクリックします。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/704548/abc6d071-c629-89db-b9d1-85942c8c9904.png)

(9) 作成したトピックの中で、<b>[サブスクリプションの作成]</b>をクリックします。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/704548/2f7eb722-2602-9177-ab1e-57e938dd1b43.png)

(10) <b>[プロトコル]</b>では<b>プラットフォームアプリケーションのエンドポイント</b>を選び、<b>[エンドポイント]</b>に<b>アプリケーションエンドポイント</b>の<b>ARN</b>を入れます。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/704548/7eec0267-e1c4-22c0-2492-5c2d3edf498f.png)

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/704548/cb0510be-9fc0-cce4-b536-212d01817192.png)

これで準備が完了です。

## コンソールでプッシュメッセージを送信
(1) トピックを選び、<b>[メッセージの発行]</b>ボタンをクリックします。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/704548/ce25b5a7-19fb-4d21-5bea-7a080f37252d.png)

(2) <b>[メッセージ構造]</b>を選び、<b>[エンドポイントに送信するメッセージ本文]</b>にデータを設定します。最後に右下の<b>[メッセージの発行]</b>ボタンをクリックすれば、モバイルプッシュ通知が発行されます。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/704548/efb88adc-c609-31ab-e4b3-72bc9b35a186.png)

### 通知メッセージ
<b>[メッセージ構造]</b>で<b>配信プロトコルごとにカスタムペイロード</b>を選びます。また、本文に<b>default</b>を忘れずに入れておきます。

ペイロードの例：

```json
{
	"default": "サンプルフォールバックメッセージ",
	"GCM": "{ \"notification\": { \"body\": \"AWSは楽しいです！\", \"title\":\"AWSをどう思いますか？\" } }"
}
```

### データ メッセージ
データメッセージの場合、<b>[メッセージ構造]</b>でどれを選んでもかまいません。<b>default</b>も入れておきます。

ペイロードの例：

```json
{
	"default": "サンプルフォールバックメッセージ",
	"GCM": "{\"data\":{\"message\":\"Check out these awesome deals!\",\"url\":\"www.amazon.com\"}}"
}
```

# 参考
[Amazon SNSを利用してモバイルプッシュ通知を送信するやり方ーコンソール利用](https://qiita.com/Rei_2020/items/ab1768c1a0191b73492e)
[Amazon SNSを利用してモバイルプッシュ通知を送信するやり方ー Node.js](https://qiita.com/Rei_2020/items/fd8c679f697b0e0f5ca7)
[Amazon SNSを利用してモバイルプッシュ通知を送信するやり方ー HMS対応（ソリューション）](https://qiita.com/Rei_2020/items/352a0b02d6eb13ab19da)
[Amazon SNSを利用してモバイルプッシュ通知を送信するやり方ー HMS対応（実装）](https://qiita.com/Rei_2020/items/ad4046b59d3e2cc7111c)