コンテンツにジャンプ

Getting Started

GitHub

@capgo/capacitor-notifications is the first-party Capgo plugin for native iOS and Android push notifications. It is built for Capgo’s dashboard, public API, Analytics Engine device registry, campaign stats, badge updates, and silent live-update checks.

要件

要件
  • A Capacitor app already added to Capgo.
  • Access to the Capgo app’s Notifications tab.
  • A Capgo API key with write access for backend proof minting and API sends.
  • iOSおよび/またはAndroidプラットフォームのプッシュ権限がアプリに付与されていること。
  • @capgo/capacitor-updater silent push update checksを実行したい場合は。

1. Capgoプラットフォームのクレデンシャルを設定

セクション「1. Capgoプラットフォームのクレデンシャルを設定」

Capgoでアプリを開き、次に 通知.

各プラットフォームをサポートするために、1つのプラットフォームクレデンシャルエントリを追加します:

  • Android - アプリパッケージIDとAndroidプッシュプロジェクトメタデータ。
  • iOS - バンドルID、チームID、キーアイディ、そしてiOSプッシュキーのメタデータに一致するもの。

Capgoは、プラットフォームが設定済みとマークされる前に、APIワーカー内に存在する必要がある環境シークレット名を示します。ダッシュボードはメタデータと期待されるシークレット参照を保存します。プライベートクレデンシャルはワーカー環境内に残ります。

2. インストール

Section titled “2. Install”

最速のセットアップのために、Capgo CLI をアプリプロジェクトから実行してください。

ターミナル画面
npx @capgo/cli@latest notifications setup com.example.app

コマンドは通知パッケージをインストールし、Capacitor プラグインの設定を保存し、小さなヘルパーファイルを作成し、Capacitor シンクを実行します。このパスは、新しいアプリを作成する場合に使用してください。ファイルを手動で接続する必要がある場合は除きます。

手動インストール:

ターミナル画面
npm install @capgo/capacitor-notifications @capgo/capacitor-updater
npx cap sync

静音Capgo更新チェックを使用していない場合、次の行を省略できます。 @capgo/capacitor-updater.

アプリが起動したときに一度だけプラグインを設定してください。

import { CapgoNotifications } from '@capgo/capacitor-notifications'
await CapgoNotifications.configure({
appId: 'com.example.app',
autoUpdater: true,
updateInstallMode: 'next',
})

使用 updateInstallMode: 'next' 更新をダウンロードして、次の再起動またはバックグラウンドサイクルでインストールします。使用するには、__CAPGO_KEEP_0__をすぐにインストールできるようにアップデーターが安全にできる時点でインストールしたい場合のみです。 updateInstallMode: 'set' only when you want Capgo to install the update as soon as the updater can safely do it.

Do not put your Capgo API key in the mobile app. Your backend should ask Capgo for an identityProof クリップボードにコピー

__CAPGO_KEEP_0__の
curl -X POST 'https://api.capgo.app/notifications/recipients/proof' \
-H 'Content-Type: application/json' \
-H 'x-api-key: CAPGO_API_KEY' \
-d '{
"appId": "com.example.app",
"externalId": "customer-user-123"
}'

ターミナルウィンドウ identityProof クリップボードにコピー

5. デバイスの登録

「5. デバイスの登録」

利用者がサインインしていることを確認した後のみ、デバイスを登録してください。

const registration = await CapgoNotifications.register({
externalId: 'customer-user-123',
identityProof,
tags: ['paid', 'beta'],
attributes: {
plan: 'team',
locale: 'en-US',
},
consent: true,
})
console.log(registration.recipientKey, registration.deviceKey)

「{call}」 register 「再度呼び出す」

  • アプリが起動する
  • ネイティブプッシュトークンが変更される
  • サインインしている利用者が変更される
  • タグ、属性、または同意が変更される
  • 長い間更新されていない

6. イベントリスナを追加

6. イベントリスナーの追加

アプリ起動時にはリスナを登録し、JavaScriptでフォアグラウンド、オープン、バックグラウンドイベントを表示するようにします。

await CapgoNotifications.addListener('registrationChanged', () => {
void CapgoNotifications.register({
externalId: currentUser.id,
identityProof: currentUser.capgoNotificationProof,
tags: currentUser.notificationTags,
consent: currentUser.pushConsent,
})
})
await CapgoNotifications.addListener('notificationReceived', (notification) => {
console.log('Notification received', notification)
})
await CapgoNotifications.addListener('notificationOpened', (event) => {
console.log('Notification opened', event.notification.id)
})
await CapgoNotifications.addListener('backgroundNotification', async (event) => {
try {
console.log('Background notification', event.notification.data)
} finally {
await event.finish()
}
})

常に finish() バックグラウンド通知の後、作業が完了したら呼び出してください。作業は短く、idempotentでなければなりません。

Xcodeでアプリのターゲットを開き、次の設定を有効にします。

  • Push Notifications
  • コンテキスト: Capgo マーケティング ウェブサイト。役割: 短い UI ラベルまたはナビゲーション アイテム。メッセージ キー `push_notifications` (Push Notifications)。

Background Modes > Remote notifications ios/App/App/AppDelegate.swift:

func application(_ application: UIApplication, didReceiveRemoteNotification userInfo: [AnyHashable: Any], fetchCompletionHandler completionHandler: @escaping (UIBackgroundFetchResult) -> Void) {
NotificationCenter.default.post(name: Notification.Name("CapgoNotificationsRemoteNotification"), object: userInfo)
completionHandler(.newData)
}

次に、以下のコマンドを実行してください。

ターミナル画面
npx cap sync ios

iOSデバイスを使用してバックグラウンド通知をテストすることをお勧めします。シミュレータはUIの作業に便利ですが、実際のバックグラウンドプッシュの動作を表すものではありません。

8. Androidの設定

8. Androidの設定

次に、以下のコマンドを実行してください。

ターミナル画面
npx cap sync android

次に、以下を確認してください。

  • Androidプラットフォームの資格情報は、Capgoに設定されています。
  • アプリのパッケージIDは、プラットフォームプッシュの設定で使用したパッケージIDと一致しています。
  • Android 13以上の通知許可を求める必要があります。
  • アプリには通知アイコンとチャネル戦略があります。
  • Google Playサービスを搭載した物理デバイスまたはエミュレータでテストします。

アプリが起動したときにデフォルトのAndroidチャネルを作成します:

await CapgoNotifications.configure({ appId: 'com.example.app' })
await CapgoNotifications.register({
externalId: currentUser.id,
identityProof: currentUser.capgoNotificationProof,
consent: true,
})

プラグインはAndroidプッシュメッセージングサービスを宣言します。

ホストアプリでアプリバックアップ、データ抽出、ネットワークセキュリティ、通知アイコンポリシーを管理してください。

9. テスト通知を送信する

セクション「9. テスト通知を送信する」 使用 in Capgo, or call the public API from your backend:

ターミナルウィンドウ
curl -X POST 'https://api.capgo.app/notifications/send' \
-H 'Content-Type: application/json' \
-H 'x-api-key: CAPGO_API_KEY' \
-d '{
"appId": "com.example.app",
"target": { "externalId": "customer-user-123" },
"payload": {
"title": "Hello from Capgo",
"body": "This is a test notification.",
"data": { "screen": "inbox" }
}
}'

キャンペーンを作成するには、ダッシュボードで作成するか、呼び出す /notifications/campaigns、外部ID、タグ、セグメント、またはブロードキャストアウディエンスに送信します。

await CapgoNotifications.setBadge(4)
await CapgoNotifications.incrementBadge()
await CapgoNotifications.clearBadge()

バックエンドから:

ターミナル画面
curl -X POST 'https://api.capgo.app/notifications/badge' \
-H 'Content-Type: application/json' \
-H 'x-api-key: CAPGO_API_KEY' \
-d '{
"appId": "com.example.app",
"target": { "externalId": "customer-user-123" },
"badge": 4
}'

11. 静音アップデートチェックを有効にする

「11. 静音アップデートチェックを有効にする」のセクション

静音アップデートチェックは、このプラグインを @capgo/capacitor-updater.

アプリ内で:

await CapgoNotifications.enableUpdaterIntegration({
enabled: true,
installMode: 'next',
})

Capgoで ユーザーにプッシュ更新を送信 APIの通知設定で、

ターミナルウィンドウ
curl -X POST 'https://api.capgo.app/notifications/update-check' \
-H 'Content-Type: application/json' \
-H 'x-api-key: CAPGO_API_KEY' \
-d '{
"appId": "com.example.app",
"target": { "externalId": "customer-user-123" },
"installMode": "next"
}'

通知は静音で、コラプスIDを使用して、再帰的な更新チェックを置き換えます。

  • Capgoの受信者検索で、 externalId.
  • 許可は granted またはユーザーが通知の許可を承認した場合。
  • 登録されたプラットフォームは android または ios.
  • registrationChanged アップデートの後、トークンが再読み込みされます。
  • バックグラウンドのテストログ notificationReceived.
  • 通知を開くログ notificationOpened.
  • ダッシュボードの統計では、キューされ、送信されたイベントが表示され、受信された/開かれたイベントは、デバイスが報告したときに表示されます。
  • 静的更新のチェックは、結果をログします。 runUpdateCheck またはアップデーターの統合。

セットアップがうまくいかない場合は、 デバッグ アプリを変更する前に、codeを確認してください。多くの失敗は、アイデンティティの証明の不一致、プラットフォームの資格情報の設定、OSのパーミッションの状態、バックグラウンドのサスペンド、またはアプリ/パッケージIDの不一致によって引き起こされます。