> For the complete documentation index, see [llms.txt](https://ja.docs.monaca.io/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://ja.docs.monaca.io/tutorials/phonegap_push.md).

# Phonegap Push プラグイン

{% hint style="danger" %}
 非推奨プラグイン 
{% endhint %}

この Cordova プラグインでは、プッシュ通知の登録と受信を行います。

* Repo: <https://github.com/phonegap/phonegap-plugin-push>
* Plugin ID/Package Name: `phonegap-plugin-push`
* Tested Version: `2.3.0`

{% hint style="info" %}
カスタムビルドデバッガーでは、プッシュ通知を確認することはできません。\
&#x20;プッシュ通知を確認する場合は、デバッグビルドかリリースビルドにてご確認ください。
{% endhint %}

## デモ

[<img src="https://docs.monaca.io/images/common/import_img.png" alt="" data-size="line">プロジェクトをインポート](https://monaca.mobi/directimport?pid=5b2b3b4ce788850e4fdba6d4)

![](/files/-MgyF1kQMxbhEKPO75pd)

## IOSの準備

iOS 向けのプッシュ通知を使用する場合は、APNs の認証キーまたは APNs 証明書が必要になります。 ここでは、iOS デバッグビルド用の Development APNs 署名書の作成方法を説明します。

{% hint style="info" %}
リリースビルドでは、Production APNs 証明書が必要になります。
{% endhint %}

既に [Apple Developer Program](https://developer.apple.com/programs/) をお持ちの場合は、以下の手順に従って Development APNs 証明書を作成してください。

1\. [Apple Developer page](https://developer.apple.com/) から、`Account` に移動します。

2\. `Certificates, Identifiers & Profiles` を選択します。

![](https://docs.monaca.io/images/tutorials/11.png)

3\. APNs 証明書を作成する場合は、プッシュ通知を有効にした App ID が必要になります。`Identifiers` 項目の `App IDs` 選択し、右上隅の `+` ボタンをクリックします。

![](https://docs.monaca.io/images/tutorials/14.png)

4\. 次のような App ID 情報を入力します。

* `App Description`: アプリ名を入力します ( 例：Cordova Firebase Demo )
* `Explicit ID`: プッシュ通知では、ワイルドカードの App ID を使用できないため、このオプションを選択します。 アプリの固有の識別子（ io.monaca.firebase など ）を入力します。

![](https://docs.monaca.io/images/tutorials/15.png)

5\. `App Services` 項目の `Push Notifications` オプションをチェックし、`Continue`をクリックします。

![](https://docs.monaca.io/images/tutorials/16.png)

6\. `Confirm your App ID` ページにリダイレクトされます。 `Register` をクリックします。

7\. iOS App IDs ページで作成した App ID を選択し、`Edit` をクリックします。

8\. `Push Notifications` 項目にある `Development SSL Certificate` の `Create Certificate` をクリックします。

![](https://docs.monaca.io/images/tutorials/17.png)

9\. `Continue` をクリックします。

10\. `Choose File` をクリックし、CSR ファイルを選択します。 CSR ファイルは、Monaca クラウド IDE の **`設定 → iOS ビルド設定`** から取得することができます。 `秘密鍵と CSR の生成` をクリックし、CRSファイルを作成後 `エクスポート` ボタンをクリックしてダウンロードします。

11\. 次に、`Continue` をクリックします。 証明書の準備でき、ダウンロード可能になったら証明書をダウンロードします。

12\. ダウンロードした証明書を **`iOS ビルド設定`** の **`証明書のアップロード`** ボタンをクリックしてアップロードします。

13\. **`Monacaに登録された証明書`** に表示された証明書の **`エクスポー`ト** アイコンをクリックして **`p12`** ファイルをエクスポートします。次の項目の Firebase の設定に必要になります。

## Firebase ( プッシュ通知 ) の設定

&#x20;1\. [Firebase Console](https://firebase.google.com/) にアクセスします。

2\. Firebase Console にログインします。

3\. プロジェクトを追加 をクリックします。

![](https://docs.monaca.io/images/tutorials/1.png)

4\. プロジェクト情報を入力し、 `プロジェクトを作成` をクリックします。 その後、プロジェクト概要ページにリダイレクトされます。

![](https://docs.monaca.io/images/tutorials/2.png)

プロジェクトを作成後、各プラットフォーム用プッシュ通知の設定を行うことができます。

### iOS の場合

1\. `プロジェクトの設定`　を選択します。

![](https://docs.monaca.io/images/tutorials/3.png)

2\. \[全般] 項目で `アプリを追加` をクリックし、`iOS` を選択します。

3\. iOS のバンドル ID を入力します。( **`設定 → iOS アプリ設定`** ) で確認することができます)。 次に、`アプリの登録` をクリックします。

![](https://docs.monaca.io/images/tutorials/4.png)

4\. `GoogleService-Info.plist` ファイルをダウンロードし、プロジェクトのルートフォルダに配置します。 次に、 続行 をクリックします。

![](https://docs.monaca.io/images/tutorials/5.png)

5\. \[Firebase SDK の追加] では、Monacaで開発するアプリは、ネイティブアプリではないため、 `続行` をクリックします。 次に、`終了` をクリックして設定を完了します。その後、Firebase の概要ページに iOS アプリが表示されます。

![](https://docs.monaca.io/images/tutorials/6.png)

6\. 作成したプロジェクトに APNs 証明書を追加します。 `プロジェクトの設定` に移動し、 `クラウド メッセージング`を選択します。

![](https://docs.monaca.io/images/tutorials/3.png)

7\. **iOS アプリの設定** 項目で、APNs 認証キーまたは APNs 証明書をアップロードします。

![](https://docs.monaca.io/images/tutorials/7.png)

以上で、iOS 用の設定は完了です。

### Android の場合

1\. `プロジェクトの設定`　を選択します。

![](https://docs.monaca.io/images/tutorials/3.png)

2\. \[全般] 項目で `アプリを追加` をクリックし、`Android` を選択します。

3\. パッケージ名を入力します ( **`設定 → Android アプリ設定`**&#x3067;確認することができます) 。 次に、`アプリの登録` をクリックします。

![](https://docs.monaca.io/images/tutorials/8.png)

4\. `google-services.json` ファイルをダウンロードし、プロジェクトのルートフォルダに配置します。 次に、 `続行` をクリックします。

![](https://docs.monaca.io/images/tutorials/9.png)

5\. \[Firebase SDK の追加] では、Monacaで開発するアプリは、ネイティブアプリではないため、 `続行` をクリックします。 次に、`終了` をクリックして設定を完了します。その後、Firebase の概要ページに iOS アプリが表示されます。

![](https://docs.monaca.io/images/tutorials/10.png)

## Monaca クラウド IDE でプラグインを有効にする

1. IDE メニューから **`設定 → Cordova プラグインの管理`** へ移動します。
2. `Cordova プラグインのインポート`ボタンをクリックします。 次に、\[ZIP ファイル] または \[パッケージ名 / URL] を使用してプラグインをインポートします。

### 使い方 <a href="#i" id="i"></a>

プラグインをプロジェクトにインポート後、プッシュ通知の初期化を行います。 deviceready イベント後、プラグイン API 使用します。 例：

```javascript
document.addEventListener("deviceready", onDeviceReady, false);        
function onDeviceReady() {

    // Notification initialization
    push = PushNotification.init({
        ios: {
            badge: true
        }
    });
    
    // Checking notification permission
    $interval(checkNotifPermiss, 500);
    // Updating App Icon Badge Number
    $interval(updateAIBN, 500);  

    // When receiving a push notification
    push.on('notification', data => {
        receiveNotifCB(data);
    });
}
```

## API リファレンス

このページでは、[デモ](https://monaca.mobi/directimport?pid=5b2b3b4ce788850e4fdba6d4) で使用されている主な API についてのみ説明します。API リファレンスについては、[こちら](https://github.com/phonegap/phonegap-plugin-push) を参照してください。

### init()

プッシュ通知の初期化を行います。

```javascript
PushNotification.init(options)
```

**パラメーター**

| パラメーター名   | 型      | 説明                                      |
| --------- | ------ | --------------------------------------- |
| `options` | Object | すべての対象プラットフォームの関連する固有のオプションを記述するオブジェクト。 |

* iOS の場合

{% hint style="info" %}
すべての iOS の `Boolean` オプションは、`String` として指定することもできます。
{% endhint %}

| 属性               | 型       | 標準値     | 説明                                                                                                                                                                                |
| ---------------- | ------- | ------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| `ios.voip`       | Boolean | `false` | \[オプション] `true`に設定されている場合、VoIP プッシュ通知を受信するように端末が設定され、VoIP 通知は、`notification` イベントで処理されるサイレント通知のため、他のオプションは無視されます。                                                                 |
| `ios.alert`      | Boolean | `false` | \[オプション] `true` に設定されている場合、端末は通知の受信時にアラートを表示します。\*                                                                                                                                |
| `ios.badge`      | Boolean | `false` | \[オプション] `true` に設定されている場合、端末は通知の受信時にバッジ番号を設定します。\*                                                                                                                               |
| `ios.sound`      | Boolean | `false` | \[オプション] `true` に設定されている場合、端末は通知の受信時に音声を再生します。\*                                                                                                                                  |
| `ios.clearBadge` | Boolean | `false` | \[オプション] `true` に設定されている場合、アプリの起動時にバッジがクリアされます。                                                                                                                                   |
| `ios.categories` | Object  | `{}`    | \[オプション] iOS のアクションボタンを有効にするために必要なデータです。詳細については、[Action Buttons on iOS](https://github.com/phonegap/phonegap-plugin-push/blob/master/docs/PAYLOAD.md#action-buttons-1) を参照してください。 |

`*`: init メソッドが初めて実行されるときに設定されるオプションの値によって、アプリがどのように動作するかが決まります。 init メソッドで値が設定された場合でも、 **`設定 → 通知 → アプリ名`** からユーザが手動で設定を変更することができます。これは通常のiOSの動作になります。

* Android の場合

| 属性                           | 型       | 標準値       | 説明                                                                                                                                                                                                                      |
| ---------------------------- | ------- | --------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| `android.icon`               | String  |           | \[オプション] small-icon として使用する画像リソース名。 リソース名には、拡張子は含まれません。                                                                                                                                                                 |
| `android.iconColor`          | String  |           | \[オプション] Android 5.0 以降の small-icon の背景色を設定します。 [サポートされている形式](https://developer.android.com/reference/android/graphics/Color.html#parseColor\(java.lang.String\))                                                       |
| `android.sound`              | Boolean | `true`    | \[オプション] `true` に設定されている場合、プッシュデータで指定された音声またはデフォルトのシステム音が再生されます。                                                                                                                                                        |
| `android.vibrate`            | Boolean | `true`    | \[オプション] `true` に設定されている場合、端末は通知を受け取ると振動します。                                                                                                                                                                            |
| `android.clearBadge`         | Boolean | `false`   | \[オプション] `true` に設定されている場合、アイコンバッジは初期化時にクリアされ、プッシュメッセージが処理される前にクリアされます。                                                                                                                                                 |
| `android.clearNotifications` | Boolean | `true`    | \[オプション] `true` に設定されている場合、アプリが閉じられたときに保留中の通知をすべてクリアします。                                                                                                                                                                |
| `android.forceShow`          | Boolean | `false`   | \[オプション] アプリがフォアグラウンドにあるときの通知動作を制御します。true の場合、アプリがフォアグラウンドになると、アプリがバックグラウンドのときと同じように、通知領域に通知が表示されます ( on(‘notification’) コールバックは、ユーザーが通知をクリックしたときにのみ実行されます )。false で、アプリがフォアグラウンドの場合、on(‘notification’) コールバックが実行されます。 |
| `android.topics`             | Array   | `[]`      | \[オプション] 配列 に1 つ以上の文字列が含まれている場合、各文字列は FcmPubSub トピックの購読に使用されます。                                                                                                                                                         |
| `android.messageKey`         | String  | `message` | \[オプション] 通知のテキストを検索するためのキー。                                                                                                                                                                                             |
| `android.titleKey`           | String  | `title`   | \[オプション] 通知のタイトルを検索するためのキー。                                                                                                                                                                                             |

**戻り値**

* `pushObject`

**例**

```javascript
const push = PushNotification.init({
  android: {},
  browser: {
    pushServiceURL: 'http://push.api.phonegap.com/v1/push'
  },
  ios: {
    alert: 'true',
    badge: true,
    sound: 'false'
  },
  windows: {}
});
```

### hasPermission()

プッシュ通知許可が端末で許可されているか確認します。

```
PushNotification.hasPermission(successHandler)
```

**パラメーター**

| パラメーター名          | 型        | 説明                           |
| ---------------- | -------- | ---------------------------- |
| `successHandler` | Function | API がアクセス許可を正常に取得した際に実行されます。 |

**Callback パラメーター**

* successHandler

| パラメーター名          | 型       | 説明                  |
| ---------------- | ------- | ------------------- |
| `data.isEnabled` | Boolean | プッシュ通知の許可の状態を取得します。 |

**戻り値**

* `Promise`

**例**

```
PushNotification.hasPermission(data => {
  if (data.isEnabled) {
    console.log('isEnabled');
  }
});
```

### getApplicationIconBadgeNumber()

アプリが実行されていないときに表示されている現在のバッジの数を取得します。

```
push.getApplicationIconBadgeNumber(successHandler, errorHandler)
```

**パラメーター**

| パラメーター名          | 型        | 説明                                        |
| ---------------- | -------- | ----------------------------------------- |
| `successHandler` | Function | API がアイコンバッジ番号を正常に取得した際に実行されます。           |
| `errorHandler`   | Function | アイコンのバッジ番号を取得する際に API がエラーを検出したときに実行されます。 |

**Callback パラメーター**

* successHandler

| パラメーター名 | 型      | 説明             |
| ------- | ------ | -------------- |
| `n`     | Number | 現在のバッジカウントの整数。 |

**戻り値**

* `Promise`

**例**

```javascript
push.getApplicationIconBadgeNumber(
    n => {
        $scope.aibn = n;
    },
    () => {
        console.log('Error getting the number');
    }
);
```

### setApplicationIconBadgeNumber()

アプリが実行されていないときに表示されるバッジの数を設定します。

```
push.setApplicationIconBadgeNumber(successHandler, errorHandler, count) 
```

**パラメーター**

| パラメーター名          | 型        | 説明                                                                                                             |
| ---------------- | -------- | -------------------------------------------------------------------------------------------------------------- |
| `successHandler` | Function | API がアイコンバッジ番号を正常に取得した際に実行されます。                                                                                |
| `errorHandler`   | Function | アイコンのバッジ番号を取得する際に API がエラーを検出したときに実行されます。                                                                      |
| `count`          | Number   | バッジに表示する数を指定します。`0` を指定した場合は、バッジがクリアされます。 各 `notification` イベントには、バッジを正しい数に設定するために使用できる data.count の値が含まれています。 |

**戻り値**

* `Promise`

**例**

```javascript
push.setApplicationIconBadgeNumber(
    () => {
        alert("Successfully setting the badge number!");
    },
    () => {
        alert("Fail to set the badge number. Something went wrong...");
    },
    badgeNum
);
```

### push.on()

`notification` イベントは、プッシュ通知サービスから送信されたプッシュ通知を受信した際に実行されます。

```
push.on('notification', callback)
```

**Callback パラメーター**

| パラメーター名                          | 型       | 説明                                                                                             |
| -------------------------------- | ------- | ---------------------------------------------------------------------------------------------- |
| `data.message`                   | String  | プッシュ通知サービスから送信されたプッシュメッセージのテキスト。                                                               |
| `data.title`                     | String  | \[オプション] プッシュ通知サービスから送信されたプッシュメッセージのタイトル。                                                      |
| `data.count`                     | String  | iOS / Android のバッジに表示されるメッセージ数、または Android の通知領域のメッセージ数。Windows の場合、数またはステータスグリフのバッジ通知の値を表します。 |
| `data.sound`                     | String  | 通知の受信時に再生される音声ファイルの名前。                                                                         |
| `data.image`                     | String  | 通知に表示されるイメージファイルのパス。                                                                           |
| `data.launchArgs`                | String  | プッシュ通知からの起動時にアプリに渡される引数。これは通知がバックグラウンドで受信されたときに機能します。( Windows のみ )                            |
| `data.additionalData`            | Object  | \[オプション] 上記のプロパティに適合しないプッシュ通知サービスによって送信されたデータのコレクション。                                          |
| `data.additionalData.foreground` | Boolean | アプリがフォアグラウンドでプッシュ通知を受け取ったかどうか。                                                                 |
| `data.additionalData.coldstart`  | Boolean | プッシュ通知をクリックしてアプリを起動する場合は true、アプリがすでに起動されている場合は false になります。                                   |
| `data.additionalData.dismissed`  | Boolean | プッシュ通知がユーザによって却下された場合は true が設定されます。                                                           |

**戻り値**

* `Promise`

**例**

```javascript
push.on('notification', data => {
  console.log(data.message);
  console.log(data.title);
  console.log(data.count);
  console.log(data.sound);
  console.log(data.image);
  console.log(data.additionalData);
});
```