# Guia de integração básica do SDK Cordova
Esta seção contém informações sobre como integrar o SDK Cordova do Pushwoosh em seu aplicativo.
## Pré-requisitos
Para integrar o SDK Cordova do Pushwoosh em seu aplicativo, você precisará do seguinte:
## Passos de integração
### 1. Adicionar Dependência do SDK Cordova do Pushwoosh
Adicione a dependência do SDK Cordova do Pushwoosh ao seu projeto:
```bash
cordova plugin add pushwoosh-cordova-plugin
```
### 2. Inicialização do SDK Cordova
No componente raiz do seu arquivo `index.js`, adicione o seguinte código dentro do manipulador de eventos `deviceready`. Siga os passos na ordem exata:
```javascript title="index.js"
document.addEventListener('deviceready', function() {
var pushwoosh = cordova.require("pushwoosh-cordova-plugin.PushNotification");
// 1. Registre os callbacks de notificação antes da inicialização
document.addEventListener('push-receive', function(event) {
var notification = event.notification;
console.log("Push received: " + JSON.stringify(notification));
});
document.addEventListener('push-notification', function(event) {
var notification = event.notification;
console.log("Push opened: " + JSON.stringify(notification));
});
// 2. Inicialize o Pushwoosh
pushwoosh.onDeviceReady({
appid: "__YOUR_APP_ID__"
});
// 3. Registre o dispositivo para receber notificações push
pushwoosh.registerDevice(
function(status) {
var pushToken = status.pushToken;
// Lidar com o registro bem-sucedido
},
function(status) {
// Lidar com o erro de registro
}
);
}, false);
```
Onde:
- `__YOUR_APP_ID__` é o código do aplicativo do Painel de Controle Pushwoosh.
### 3. Configuração Nativa do iOS
#### 3.1 Capabilities
Para habilitar as Notificações Push em seu projeto, você precisa adicionar certas capabilities.
Na seção Signing & Capabilities, adicione as seguintes capabilities:
- `Push Notifications`
- `Background Modes`. Após adicionar esta capability, marque a caixa para `Remote notifications`.
Se você pretende usar Notificações Sensíveis ao Tempo (iOS 15+), adicione também a capability `Time Sensitive Notifications`.
#### 3.2 Info.plist
No seu `Runner/Info.plist`, defina a chave `__PUSHWOOSH_DEVICE_API_TOKEN__` para o [Token de API de Dispositivo Pushwoosh](/pt/developer/api-reference/api-access-token/#device-api-token):
```swift title="info.plist"
Pushwoosh_API_TOKEN__PUSHWOOSH_DEVICE_API_TOKEN__
```
#### 3.3 Rastreamento de entrega de mensagens
Você deve adicionar um alvo de Notification Service Extension ao seu projeto. Isso é essencial para o rastreamento preciso da entrega e para recursos como Rich Media no iOS.
Siga os [passos do guia nativo](/pt/developer/pushwoosh-sdk/ios-sdk/setting-up-pushwoosh-ios-sdk/basic-integration-guide/#4-message-delivery-tracking) para adicionar o alvo da extensão e o código Pushwoosh necessário dentro dele.
### 4. Configuração Nativa do Android
#### 4.1 Instalar dependências
Certifique-se de que as dependências e plugins necessários sejam adicionados aos seus scripts Gradle:
Adicione o plugin Google Services Gradle às dependências do seu `build.gradle` de nível de projeto:
```groovy title="android/build.gradle"
buildscript {
dependencies {
classpath 'com.google.gms:google-services:4.3.15'
}
}
```
Aplique o plugin no seu arquivo `build.gradle` de nível de aplicativo:
```groovy title="app/build.gradle"
apply plugin: 'com.google.gms.google-services'
```
#### 4.2 Adicionar arquivo de configuração do Firebase
Coloque o arquivo `google-services.json` na pasta `android/app` do diretório do seu projeto.
#### 4.3 Adicionar metadados do Pushwoosh
No seu `main/AndroidManifest.xml`, adicione o [Token de API de Dispositivo Pushwoosh](/pt/developer/api-reference/api-access-token/#device-api-token) dentro da tag ``:
```xml title="AndroidManifest.xml"
```
> **Importante:** Certifique-se de dar ao token acesso ao aplicativo correto no seu Painel de Controle Pushwoosh. [Saiba mais](/pt/developer/api-reference/api-access-token/#edit-token)
### 5. Executar o Projeto
1. Compile e execute o projeto.
2. Vá para o Painel de Controle Pushwoosh e [envie uma notificação push](/pt/product/messaging-channels/push-notifications/send-push-notifications/one-time-push).
3. Você deve ver a notificação no aplicativo.
## Integração estendida
Neste ponto, você já integrou o SDK e pode enviar e receber notificações push. Agora, vamos explorar a funcionalidade principal
### Ouvintes de eventos de notificação push
No SDK Pushwoosh, existem dois ouvintes de eventos, projetados para lidar com notificações push:
- O evento `push-receive` é acionado quando uma notificação push é recebida enquanto o aplicativo está em primeiro plano
- O evento `push-notification` é acionado quando um usuário abre uma notificação
Esses ouvintes de eventos **devem** ser registrados **antes** de chamar `onDeviceReady()`, como mostrado no [passo de inicialização acima](#2-cordova-sdk-initialization). Você pode personalizar a lógica do manipulador para atender às suas necessidades:
```javascript title="index.js"
// Registre antes de onDeviceReady()
document.addEventListener('push-receive', function(event) {
var message = event.notification.message;
var payload = event.notification.userdata;
console.log("Push received: " + message);
// Adicione sua lógica personalizada aqui
});
document.addEventListener('push-notification', function(event) {
var message = event.notification.message;
var payload = event.notification.userdata;
console.log("Push accepted: " + message);
// Adicione sua lógica personalizada aqui (por exemplo, navegar para uma tela específica)
});
```
### Configuração do usuário
Ao focar no comportamento e nas preferências individuais do usuário, você pode entregar conteúdo personalizado, levando a um aumento da satisfação e lealdade do usuário
```javascript
class Registration {
afterUserLogin(user) {
// Definir ID do usuário
pushwoosh.setUserId(user.getId());
// Definindo informações adicionais do usuário como tags para o Pushwoosh
pushwoosh.setTags({
"age": user.getAge(),
"name": user.getName(),
"last_login": user.getLastLoginDate()
});
}
}
```
### Tags
Tags são pares de chave-valor atribuídos a usuários ou dispositivos, permitindo a segmentação com base em atributos como preferências ou comportamento, possibilitando o envio de mensagens direcionadas.
```javascript
class UpdateUser {
afterUserUpdateProfile(user) {
// Definir lista de categorias favoritas
pushwoosh.setTags({
"favorite_categories": user.getFavoriteCategoriesList()
});
// Definir informações de pagamento
pushwoosh.setTags({
"is_subscribed": user.isSubscribed(),
"payment_status": user.getPaymentStatus(),
"billing_address": user.getBillingAddress()
});
}
}
```
### Eventos
Eventos são ações ou ocorrências específicas do usuário dentro do aplicativo que podem ser rastreadas para analisar o comportamento e acionar mensagens ou ações correspondentes
```javascript
class Registration {
// Rastrear evento de login
afterUserLogin(user) {
pushwoosh.postEvent("login", {
"name": user.getName(),
"last_login": user.getLastLoginDate()
});
}
// Rastrear evento de compra
afterUserPurchase(product) {
pushwoosh.postEvent("purchase", {
"product_id": product.getId(),
"product_name": product.getName(),
"price": product.getPrice(),
"quantity": product.getQuantity()
});
}
}
```
## Solução de problemas
Se você encontrar algum problema durante o processo de integração, consulte a seção de [suporte e comunidade](/pt/developer/pushwoosh-sdk/support-and-community).