Inicio rápido del SDK de Capacitor

Comience a usar el SDK de Capacitor de Pushwoosh con este ejemplo rápido y sencillo.

Prerrequisitos

Para integrar el SDK de Capacitor de Pushwoosh en su aplicación, necesitará lo siguiente:

Requisitos

• Una cuenta de Pushwoosh.
• Un proyecto de Pushwoosh configurado en su cuenta.
• Para la integración con iOS:
  • Una plataforma iOS configurada para enviar notificaciones push. Recomendamos usar la configuración de autenticación basada en token (Token-Based Authentication) como el enfoque más simple.
  • Durante la configuración, establezca el Gateway en Sandbox para enviar pushes a un simulador.
• Para la integración con Android:
  • Una plataforma Android configurada
  • El project number (también conocido como Sender ID), el archivo google-services.json y el package name de su proyecto de Firebase.
  • Un proyecto de Firebase conectado a su aplicación de Android. Siga la guía de configuración de Firebase si es necesario.
• Su Pushwoosh Application Code y su token de API de dispositivo de Pushwoosh (Pushwoosh Device API Token) desde el Panel de Control de Pushwoosh para su aplicación.

Descargar el proyecto de ejemplo

Clone el repositorio del SDK:

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

Navegue al directorio del plugin:

cd pushwoosh-capacitor-plugin

Construir el plugin

Antes de ejecutar la aplicación de ejemplo, necesita construir el plugin de Capacitor.
Instale las dependencias del plugin:

npm i

Construya el plugin:

npm run build

Configurar la aplicación de ejemplo

Navegue al directorio de la aplicación de ejemplo:

cd example

Instale las dependencias de la aplicación:

npm i

Construya los activos web:

npm run build

Abra src/js/example.js y actualice la llamada Pushwoosh.onDeviceReady:

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

Donde:

__YOUR_APP_CODE__ es el código de la aplicación del Panel de Control de Pushwoosh. __YOUR_FCM_SENDER_ID__ es el número de proyecto de Firebase de la Consola de Firebase.

iOS

1. Instalar dependencias de CocoaPods

Navegue al directorio de la plataforma iOS e instale las dependencias de CocoaPods:

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

2. Sincronizar Capacitor con iOS

Después de instalar CocoaPods, sincronice la configuración de Capacitor:

npx cap sync ios

3. Abrir el proyecto de iOS

Abra el proyecto en Xcode:

npx cap open ios

4. Establecer el Bundle Identifier

En Xcode, establezca el Bundle Identifier con el nombre del paquete de su aplicación (p. ej., com.example.pushwoosh).

5. Añadir capacidades

Para habilitar las Notificaciones Push, necesita añadir ciertas capacidades.

En la sección Signing & Capabilities, añada las siguientes capacidades:

• Push Notifications
• Background Modes. Después de añadir esta capacidad, marque la casilla de Remote notifications.

6. Establecer el API Token

Abra ios/App/App/Info.plist en Xcode y añada la siguiente entrada con su Token de API de Dispositivo de Pushwoosh:

Info.plist

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

Android

1. Sincronizar Capacitor con Android

Sincronice la configuración de Capacitor con la plataforma Android:

npx cap sync android

2. Configurar google-services.json

Copie su archivo google-services.json al directorio android/app.

3. Establecer el nombre del paquete

Abra android/app/build.gradle y establezca el applicationId con el nombre del paquete de su aplicación (p. ej., com.example.pushwoosh).

4. Establecer el API Token

Abra su archivo android/app/src/main/AndroidManifest.xml y añada los siguientes metadatos dentro de la etiqueta <application>:

AndroidManifest.xml

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

Reemplace __YOUR_PUSHWOOSH_DEVICE_API_TOKEN__ con su Token de API de Dispositivo de Pushwoosh.

5. Abrir el proyecto de Android

Abra el proyecto en Android Studio:

npx cap open android

Ejecutar el proyecto

1. Construya y ejecute el proyecto.
2. Toque el botón “Click Me!”.
3. Conceda permiso para las notificaciones push. El dispositivo se registrará en Pushwoosh.

Enviar una notificación push

Vuelva al Panel de Control de Pushwoosh y envíe una notificación push a su dispositivo registrado.