Démarrage rapide du SDK Capacitor

Démarrez avec le SDK Capacitor de Pushwoosh en utilisant cet exemple simple et rapide.

Prérequis

Pour intégrer le SDK Capacitor de Pushwoosh dans votre application, vous aurez besoin des éléments suivants :

Prérequis

• Un compte Pushwoosh.
• Un projet Pushwoosh configuré dans votre compte.
• Pour l’intégration iOS :
  • Une plateforme iOS configurée pour envoyer des notifications push. Nous recommandons d’utiliser la configuration d’authentification basée sur un jeton comme approche la plus simple.
  • Lors de la configuration, réglez la passerelle sur Sandbox pour envoyer des notifications push à un simulateur.
• Pour l’intégration Android :
  • Une plateforme Android configurée.
  • Le project number (également connu sous le nom de Sender ID), le fichier google-services.json et le package name de votre projet Firebase.
  • Un projet Firebase connecté à votre application Android. Suivez le guide de configuration Firebase si nécessaire.
• Votre Pushwoosh Application Code et votre jeton d’API de l’appareil Pushwoosh depuis le panneau de contrôle Pushwoosh pour votre application.

Télécharger le projet d’exemple

Clonez le dépôt du SDK :

git clone https://github.com/Pushwoosh/pushwoosh-capacitor-plugin.git

Accédez au répertoire du plugin :

cd pushwoosh-capacitor-plugin

Compiler le plugin

Avant d’exécuter l’application d’exemple, vous devez compiler le plugin Capacitor.
Installez les dépendances du plugin :

npm i

Compilez le plugin :

npm run build

Configurer l’application d’exemple

Accédez au répertoire de l’application d’exemple :

cd example

Installez les dépendances de l’application :

npm i

Compilez les ressources web :

npm run build

Ouvrez src/js/example.js et mettez à jour l’appel Pushwoosh.onDeviceReady :

Pushwoosh.onDeviceReady({
    projectid: "__YOUR_FCM_SENDER_ID__",
    appid: "__YOUR_APP_CODE__"
});

Où :

__YOUR_APP_CODE__ est le code de l’application depuis le Panneau de Contrôle Pushwoosh. __YOUR_FCM_SENDER_ID__ est le numéro de projet Firebase depuis la Console Firebase.

iOS

1. Installer les dépendances CocoaPods

Accédez au répertoire de la plateforme iOS et installez les dépendances CocoaPods :

cd ios/App
pod install --repo-update
cd ../..

2. Synchroniser Capacitor avec iOS

Après avoir installé CocoaPods, synchronisez la configuration de Capacitor :

npx cap sync ios

3. Ouvrir le projet iOS

Ouvrez le projet dans Xcode :

npx cap open ios

4. Définir le Bundle Identifier

Dans Xcode, définissez le Bundle Identifier sur le nom de package de votre application (par ex., com.example.pushwoosh).

5. Ajouter des capacités

Pour activer les notifications Push, vous devez ajouter certaines capacités.

Dans la section Signing & Capabilities, ajoutez les capacités suivantes :

• Push Notifications
• Background Modes. Après avoir ajouté cette capacité, cochez la case Remote notifications.

6. Définir le jeton d’API

Ouvrez ios/App/App/Info.plist dans Xcode et ajoutez l’entrée suivante avec votre Jeton d’API d’appareil Pushwoosh :

Info.plist

<key>Pushwoosh_API_TOKEN</key>
<string>__YOUR_PUSHWOOSH_DEVICE_API_TOKEN__</string>

Android

1. Synchroniser Capacitor avec Android

Synchronisez la configuration de Capacitor avec la plateforme Android :

npx cap sync android

2. Configurer google-services.json

Copiez votre fichier google-services.json dans le répertoire android/app.

3. Définir le nom du package

Ouvrez android/app/build.gradle et définissez l’applicationId sur le nom de package de votre application (par ex., com.example.pushwoosh).

4. Définir le jeton d’API

Ouvrez votre fichier android/app/src/main/AndroidManifest.xml et ajoutez les métadonnées suivantes à l’intérieur de la balise <application> :

AndroidManifest.xml

<meta-data android:name="com.pushwoosh.apitoken" android:value="__YOUR_PUSHWOOSH_DEVICE_API_TOKEN__" />

Remplacez __YOUR_PUSHWOOSH_DEVICE_API_TOKEN__ par votre Jeton d’API d’appareil Pushwoosh.

5. Ouvrir le projet Android

Ouvrez le projet dans Android Studio :

npx cap open android

Exécuter le projet

1. Compilez et exécutez le projet.
2. Appuyez sur le bouton « Click Me! ».
3. Accordez l’autorisation pour les notifications push. L’appareil sera enregistré auprès de Pushwoosh.

Envoyer une notification push

Retournez au Panneau de Contrôle Pushwoosh et envoyez une notification push à votre appareil enregistré.