Capacitor SDK Schnellstart

Beginnen Sie mit dem Pushwoosh Capacitor SDK mit diesem schnellen und einfachen Beispiel.

Voraussetzungen

Um das Pushwoosh Capacitor SDK in Ihre App zu integrieren, benötigen Sie Folgendes:

Anforderungen

• Ein Pushwoosh-Konto.
• Ein in Ihrem Konto eingerichtetes Pushwoosh-Projekt.
• Für die iOS-Integration:
  • Eine iOS-Plattform, die für den Versand von Push-Benachrichtigungen konfiguriert ist. Wir empfehlen die Verwendung der Konfiguration für tokenbasierte Authentifizierung als einfachsten Ansatz.
  • Stellen Sie während der Einrichtung das Gateway auf Sandbox, um Push-Benachrichtigungen an einen Simulator zu senden.
• Für die Android-Integration:
  • Eine konfigurierte Android-Plattform
  • Die Projektnummer (auch als Sender-ID bekannt), die Datei google-services.json und der Paketname aus Ihrem Firebase-Projekt.
  • Ein Firebase-Projekt, das mit Ihrer Android-Anwendung verbunden ist. Folgen Sie bei Bedarf der Firebase-Einrichtungsanleitung.
• Ihr Pushwoosh Application Code und Ihr Pushwoosh Device API Token aus dem Pushwoosh Control Panel für Ihre Anwendung.

Das Beispielprojekt herunterladen

Klonen Sie das SDK-Repository:

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

Navigieren Sie zum Plugin-Verzeichnis:

cd pushwoosh-capacitor-plugin

Das Plugin erstellen

Bevor Sie die Beispiel-App ausführen, müssen Sie das Capacitor-Plugin erstellen.
Installieren Sie die Plugin-Abhängigkeiten:

npm i

Erstellen Sie das Plugin:

npm run build

Die Beispiel-App konfigurieren

Navigieren Sie zum Verzeichnis der Beispiel-App:

cd example

Installieren Sie die App-Abhängigkeiten:

npm i

Erstellen Sie die Web-Assets:

npm run build

Öffnen Sie src/js/example.js und aktualisieren Sie den Pushwoosh.onDeviceReady-Aufruf:

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

Wobei:

__YOUR_APP_CODE__ ist der Anwendungscode aus dem Pushwoosh Control Panel. __YOUR_FCM_SENDER_ID__ ist die Firebase-Projektnummer aus der Firebase Console.

iOS

1. CocoaPods-Abhängigkeiten installieren

Navigieren Sie zum iOS-Plattformverzeichnis und installieren Sie die CocoaPods-Abhängigkeiten:

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

2. Capacitor mit iOS synchronisieren

Nach der Installation von CocoaPods synchronisieren Sie die Capacitor-Konfiguration:

npx cap sync ios

3. Das iOS-Projekt öffnen

Öffnen Sie das Projekt in Xcode:

npx cap open ios

3. Den Bundle Identifier festlegen

Setzen Sie in Xcode den Bundle Identifier auf den Paketnamen Ihrer App (z. B. com.example.pushwoosh).

5. Fähigkeiten hinzufügen

Um Push-Benachrichtigungen zu aktivieren, müssen Sie bestimmte Fähigkeiten hinzufügen.

Fügen Sie im Abschnitt Signing & Capabilities die folgenden Fähigkeiten hinzu:

• Push Notifications
• Background Modes. Nachdem Sie diese Fähigkeit hinzugefügt haben, aktivieren Sie das Kontrollkästchen für Remote notifications.

6. Den API-Token festlegen

Öffnen Sie ios/App/App/Info.plist in Xcode und fügen Sie den folgenden Eintrag mit Ihrem Pushwoosh Device API Token hinzu:

Info.plist

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

Android

1. Capacitor mit Android synchronisieren

Synchronisieren Sie die Capacitor-Konfiguration mit der Android-Plattform:

npx cap sync android

2. google-services.json einrichten

Kopieren Sie Ihre google-services.json-Datei in das android/app-Verzeichnis.

3. Den Paketnamen festlegen

Öffnen Sie android/app/build.gradle und setzen Sie die applicationId auf den Paketnamen Ihrer App (z. B. com.example.pushwoosh).

4. Den API-Token festlegen

Öffnen Sie Ihre Datei android/app/src/main/AndroidManifest.xml und fügen Sie die folgenden Metadaten innerhalb des <application>-Tags hinzu:

AndroidManifest.xml

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

Ersetzen Sie __YOUR_PUSHWOOSH_DEVICE_API_TOKEN__ durch Ihren Pushwoosh Device API Token.

5. Das Android-Projekt öffnen

Öffnen Sie das Projekt in Android Studio:

npx cap open android

Das Projekt ausführen

1. Erstellen Sie das Projekt und führen Sie es aus.
2. Tippen Sie auf die Schaltfläche „Click Me!“.
3. Erteilen Sie die Berechtigung für Push-Benachrichtigungen. Das Gerät wird bei Pushwoosh registriert.

Eine Push-Benachrichtigung senden

Gehen Sie zurück zum Pushwoosh Control Panel und senden Sie eine Push-Benachrichtigung an Ihr registriertes Gerät.