Integrando com SDK Flutter

Aqui estão os passos e dicas para conseguir fazer a integração da Dito dentro seu app.

Antes de fazer a instalação da SDK Flutter é importante entender os conceitos da integração e executar configurações de um projeto Firebase (caso for utilizar notificações mobile).

flutter pub add dito_sdk

Como implementar

Aqui estão exemplos práticos para usar esses métodos em Flutter:

import 'package:dito_sdk/dito_sdk.dart';

Depois de importado devemos fazer a autenticação da lib para sua conta Dito.

final dito = DitoSDK();

// Inicializa a SDK com suas chaves de API
dito.initialize(apiKey: 'sua_api_key', secretKey: 'sua_secret_key');

Substitua os valores 'sua_api_key' e 'sua_secret_key' pelos valores que pode-se encontrar no painel CRM da Dito clicanco no ícone engrenagem.

❗️

Mantenha a api key e a secrect key em uma arquivo .env

Agora está apto a utilizar todos os métodos da SDK

Identify

Para fazer o identify, chamar o método identify() passando os parâmetros necessários e em seguida enviar o evento para Dito através do identifyUser()

// Define o ID do usuário
dito.setUserId('id_do_usuario');
dito.identify( "[email protected]", 'João da Silva', '[email protected]', 'São Paulo');
await dito.identifyUser();

Enviar um Evento para a Dito

Para enviar um evento para Dito é simples

dito.trackEvent(
  eventName: 'comprou produto',
  revenue: 99.90,
  customData: {
    'produto': 'produtoX',
    'sku_produto': '99999999',
    'metodo_pagamento': 'Visa',
  },
);

O objeto custom data é um Dynamic Map, que registra qualquer parâmetro na ficha do usuário.


Notificações push

Para receber notificações push é necessário ter instalado o Firebase em seu projeto (aqui explicamos como configurar), em seguida precisamos executar algumas configurações no código para permitir
receber e mostrar as notificações.

Vamos inicializar o Firebase, a Dito e o serviço de Push no arquivo main.dart

void main() async {
  ...

  	await Firebase.initializeApp();
  
    DitoSDK dito = DitoSDK();
  	dito.initialize(apiKey: 'sua_api_key', secretKey: 'sua_secret_key');

  	await dito.initializePushService();
  ...
}

O método initializePushService irá configurar todo serviço de push, como serviço de leitura das notificações do Firebase quando o aplicativo está em execução, configuração da renderização da mensagem (modelo usando o ícone padrão do aplicativo, título e mensagem) e o serviço de captura do click para gerar estatísticas. Um parâmetro que pode ser informado neste método é o onTap, que é a callback que será executado logo após o usuário clicar na notificação. Esta callback recebe como parâmetro um Map<String, dynamic> com os dados do Deeplink, mensagem e título.

 await dito.initializePushNotificationService(onTap: (Map<String, dynamic> payload) {
    print(payload);
 });

Agora precisamos configurar o código para fazer leitura das notificações que pode chegar quando o aplicativo não estiver sendo executado (não estiver aberto).

No início do arquivo main.dart logo após os imports deve-se registrar o serviço de leitura em segundo plano

// Método para registrar um serviço que irá receber os push quando o app estiver totalmente fechado

@pragma('vm:entry-point')
Future<void> _firebaseMessagingBackgroundHandler(RemoteMessage message) async {
  final notification = DataPayload.fromJson(jsonDecode(message.data["data"]));

  dito.notificationService().showLocalNotification(CustomNotification(
      id: message.hashCode,
      title: notification.details.title || "O nome do aplicativo",
      body: notification.details.message,
      payload: notification));
}

Register mobile token

Para fazer o registro, primeiro o usuário deve estar identificado (indicamos chamar o método de registro logo após o identify) , na sequência execute

await dito.registryMobileToken(token: token);

O método registryMobileToken tem a possibilidade de indicar a plataforma caso necessário. Quando não informado, a SDK irá buscar irá buscar o padrão do sistema.
O esperado é 'Android' ou 'Apple iPhone'

await dito.registryMobileToken(token: token, platform: 'Apple iPhone');

O token pode ser extraído através do método

String? token = await FirebaseMessaging.instance.getToken();
// em alguns casos é necessário usar o  FirebaseMessaging.instance.getAPNSToken() para o iOS

Notificar abertura de notificação

Para notificar que uma notificação foi aberta pelo usuário:

dito.openNotification(
  notificationId: '1234',
  identifier: 'example-identifier',
  reference: '0000012345678912',
);

Os parâmetros notificationId, identifier e reference são fornecidos no momento do recebimento do push. Caso esteja utilizando o método initializePushService, não é necessário se preocupar com esse evento, pois ele é disparado automaticamente pelo SDK. A implementação manual desse evento só é necessária quando initializePushService não é utilizado e a renderização da notificação é feita diretamente pela aplicação.

Preparando o Fluter para mostrar as notificações

O SDK utiliza o pacote flutter_local_notifications para exibir as notificações recebidas. Recomendamos a leitura da documentação oficial para garantir a configuração correta tanto no Android quanto no iOS.

Configurando o Android

Configurando o iOS

Aplicativo de exemplo

No repositório do SDK, disponibilizamos um aplicativo de exemplo que demonstra a implementação e o uso do SDK na prática:
https://github.com/ditointernet/sdk_mobile_flutter/tree/main/example


What’s Next