SDK: Expoプラグイン

ステップ1: PushSDKライブラリをインポートする

お好みのパッケージマネージャーを使ってPushSDKをインストールします。

yarn add @pushly/push-sdk-expo

このプラグインは、Pushly React Native SDKに必要なネイティブ設定を適用します

ステップ2: Expo設定にプラグインを追加する

ステップ2.1: Google Services

あなたの google-services.json ファイルを app ディレクトリに追加してください。

ステップ2.2: app.config.js

プラグインをExpo設定に追加し、App Group ID、AndroidアプリケーションID（次の中のパッケージと一致する必要があります google-services.json）、およびあなたの google-services.json ファイルへのパスを指定してください:

export default {
  expo: {
    ...,
    plugins: [
      [
        '@pushly/push-sdk-expo',
        {
          ios: {
            enableNse: true,
            nseTargetName: 'NotificationServiceExtension',
            nseBundleIdSuffix: '.NotificationServiceExtension',
            appGroupId: 'group.com.pushly.PushSdkReactNativeExample',
            iosDeploymentTarget: '15.0',
            swiftVersion: '5.0',
          },
          android: {
            applicationId: 'com.example.myapp',
            googleServicesFile: './app/google-services.json',
            applyGoogleServicesPlugin: true,
          },
        },
      ],
    ],
  },
};

プロパティ

定義

ios.enableNse

プラグインにNotificationServiceExtensionをインストールさせます

ios.nseTargetName

NotificationServiceExtensionのユーザー定義名。 デフォルト: NotificationServiceExtension

ios.nseBundleIdSuffix

NotificationServiceExtensionのバンドルIDサフィックス。値はPRODUCT_BUNDLE_IDENTIFIER環境変数に追加されます。 デフォルト: .NotificationServiceExtension

ios.appGroupId

PushSDKが情報を正しく取得できるようにするため、コンテナは次の名前にする必要があります group.{app-bundle-id}.push.

ios.DeploymentTarget

pbxprojファイルでNotificationServiceExtensionターゲットを設定するために使用されます

ios.swiftVersion

pbxprojファイルでNotificationServiceExtensionターゲットを設定するために使用されます

android.applicationId

Androidアプリケーションで使用されるアプリケーションID

android.googleServicesFile

app.plugin.jsから見たgoogle-services.jsonファイルの場所

android.applyGoogleServicesPlugin

gradleでgoogle servicesプラグインを適用する必要があります。

実行 expo prebuild --clean （またはEAS Build/カスタムdevクライアントを使用）して、Pushly設定が適用されたネイティブプロジェクトを生成します。

ステップ3: iOSのセットアップ

ステップ3.1: Podsをインストールする

あなたの <project_root>/ios ディレクトリ内で次を実行します: bundle exec pod install

ステップ4: SDKの初期化

あなたの index.tsx または app.tsx ファイルで、以下のサンプル実装コードを使ってPushSDKを初期化します。

次の REPLACE_WITH_SDK_KEY を setConfiguration メソッド内で、プラットフォーム設定ページのSDKキーに置き換えてください。

...
import { PushSDK, LogLevel } from '@pushly/push-sdk-react-native';

export const App = () => {
    ...

    // PushSDKはuseEffectブロック内で初期化することを推奨します
    // これにより、アプリケーションが次を呼び出そうとするのを防ぎます
    // 再レンダーのたびにPushSDK.setConfiguration()を呼び出す
    React.useEffect(() => {
        PushSDK.setLogLevel(LogLevel.INFO);
        PushSDK.setConfiguration({ appKey: 'REPLACE_WITH_SDK_KEY' });

        PushSDK.showNativeNotificationPermissionPrompt().then(({ granted }) => {
            console.log(`Permissions granted: ${granted}`);
        });
    }, []);
    
    // アプリの残りの部分
    ...
};

Androidデバイスまたはエミュレーターでアプリケーションを実行し（エミュレーターには Google Play Store Services がインストールされていることを確認してください）、またはiOS向けにビルドする場合はiOSデバイスで実行して、正しくビルドされることを確認してください。

前のステップで追加したコードにより、アプリを開くとプッシュ通知の許可ダイアログが表示されます。これは SDKメソッドを使用して、ダイアログを表示するタイミングを制御することでカスタマイズできます。

ダイアログを承認した後、プラットフォームにログインして Notifications > Create Notification に移動し、適切な ネイティブ: iOS または ネイティブ: Android チャネルを対象にして、最初の通知を送信してください。

次のステップ

SDKが正しく動作していることを確認できたら、次のような追加のオプション機能を引き続き追加できます:

前へReact Native Expoプラグイン次へExpoプラグイン変更履歴

最終更新 3 日前