Flutter SDK

ūüďė

A versão mais recente da SDK Flutter é a v3.0.0, que está disponível atualmente.

Passos da integração

1. Configuração do projeto no Firebase
2. Configuração no painel Inngage
3. Configuração nativa iOS
4. Configuração nativa Android

Instalação

Ambiente de desenvolvimento

Antes de começar a utilizar nossos SDKs, verifique se o seu ambiente de desenvolvimento possui o SDK do Dart e do Flutter instalados.

Importando o FCM Token (API Key)

Para aproveitar nossos SDKs, será necessário importar o FCM Token (API Key) do seu projeto Firebase em nossa plataforma. Siga o passo a passo neste link para executar essa ação.

Instalando o package utilizando o CLI do Flutter

Para adicionar o SDK Flutter da Inngage ao seu projeto, execute o seguinte comando utilizando o CLI do Flutter:

$ flutter pub add inngage_plugin

Este comando adiciona a seguinte linha no arquivo pubspec.yaml de seu pacote:

dependencies:
 inngage_plugin: ^3.0.0

Caso o pacote n√£o tenha sido instalado corretamente, certifique-se que o inngage_plugin est√° em seu arquivo pubspec.yaml e rode o flutter pub get manualmente.

Inclusão da dependência

Após configurar o SDK Flutter da Inngage, é simples importá-lo em seu projeto. Para isso, basta adicionar o pacote ao seu código Dart:

import 'package:inngage_plugin/inngage_sdk.dart';

ūüöß

Recomendamos que voc√™ utilize a vers√£o est√°vel mais recente do Flutter, definida no arquivo pubspec.yaml. A Inngage SDK foi verificada pela √ļltima vez na vers√£o Flutter 3.0.0 ‚ÄĘ canal est√°vel.

Vers√Ķes suportadas:

  • SDK: >=2.18.0 <4.0.0
  • Flutter: >=2.5.0"

Implementando a SDK

Notifica√ß√Ķes push

As notifica√ß√Ķes ser√£o enviadas do servidor da Inngage para um ou mais dispositivos m√≥veis, mesmo quando o aplicativo estiver em primeiro plano, segundo plano ou at√© mesmo fechado. Essas mensagens t√™m o objetivo de alertar o usu√°rio sobre informa√ß√Ķes importantes, atualiza√ß√Ķes ou qualquer outro dado relevante relacionado ao seu aplicativo.

As notifica√ß√Ķes push aparecem na tela de bloqueio ou na barra de notifica√ß√Ķes do dispositivo. Quando o usu√°rio toca na notifica√ß√£o, o aplicativo √© aberto e pode direcion√°-lo para uma p√°gina espec√≠fica ou exibir mais detalhes sobre o conte√ļdo da notifica√ß√£o.

InngageSDK.subscribe()

Esse m√©todo deve ser chamado para informar o usu√°rio sobre a chegada das notifica√ß√Ķes e inicializar o Inngage dentro do seu aplicativo. Geralmente, √© chamado no arquivo main.dart, mas, dependendo da arquitetura do seu aplicativo, pode ser chamado dentro do MyApp(). Essa fun√ß√£o √© respons√°vel por autorizar o acesso √† API da Inngage e ao Firebase Cloud Messaging, al√©m de ativar os listeners de notifica√ß√Ķes.

void main() async {
  WidgetsFlutterBinding.ensureInitialized();
  await InngageSDK.subscribe(
    appToken: 'Trocar pelo App Token do aplicativo',
    friendlyIdentifier: 'Trocar pelo objeto Identificador do usu√°rio',
    navigatorKey: navigatorKey,
    requestAdvertiserId: true,
    requestGeoLocator: true,
    blockDeepLink: true,
    firebaseListenCallback:(data) => print(data['additional_data']),
  );
  runApp(MyApp());
}

O trecho de c√≥digo menciona alguns par√Ęmetros e funcionalidades do Inngage SDK no contexto do Flutter. Aqui est√° uma explica√ß√£o das principais informa√ß√Ķes:

  • appToken: √Č o token do aplicativo na plataforma Inngage, essencial para a comunica√ß√£o com os servi√ßos da Inngage.
  • friendlyIdentifier: √Č usado para identificar o usu√°rio dentro do sistema. Esse par√Ęmetro deve ser preenchido para que o usu√°rio possa ser corretamente associado e receber as notifica√ß√Ķes push de forma personalizada.
  • navigatorKey: Uma Global Key no Flutter que pode ser usada para acessar o estado de um StatefulWidget. No caso do Inngage SDK, essa chave √© usada para identificar a inst√Ęncia do Navigator dentro do aplicativo e √© passada para o MaterialApp.
  • requestAdvertiserId: Um valor booleano que, quando definido como true, solicita o Advertising Id do Android e o IDFA (Identifier for Advertisers) no iOS. O valor padr√£o √© false.
  • requestGeoLocator: Um valor booleano que, quando definido como true, solicita a permiss√£o para acessar a localiza√ß√£o do usu√°rio antes de registr√°-lo. O valor padr√£o √© false.
  • blockDeepLink: √Č um valor booleano que permite bloquear a a√ß√£o do deep link de abrir um navegador. Ao definir como true, esse bloqueio √© efetivado. O valor padr√£o √© false.
  • firebaseListenCallback: Permite que uma fun√ß√£o seja passada para ser chamada no final do onBackgroundMessage do Firebase. Essa fun√ß√£o ser√° chamada quando o aplicativo estiver em segundo plano e receber uma notifica√ß√£o push. O par√Ęmetro 'data' √© um Map<String, dynamic> contendo informa√ß√Ķes da notifica√ß√£o push recebida do RemoteMessage message.data.

ūüöß

Os par√Ęmetros "appToken", "friendlyIdentifier" e "navigatorKey" s√£o requeridos ou obrigat√≥rios.

No main.dart, a GlobalKey é passada como navigatorKey para o MaterialApp, que é a mesma navigatorKey usada no método InngageSDK.subscribe(). Essa associação é feita para permitir a correta integração entre o Inngage SDK e a navegação do aplicativo no Flutter.

@override
Widget build(BuildContext context) {
  return MaterialApp(
    navigatorKey: navigatorKey,
    home: HomePage(),
  );
}

InngageNotificationMessage.subscribe()

Esse m√©todo deve ser chamado para realizar as configura√ß√Ķes de push no aplicativo e, principalmente, solicitar o acesso √†s notifica√ß√Ķes do usu√°rio. Ao executar esse m√©todo, o aplicativo informa ao sistema operacional que deseja receber notifica√ß√Ķes push e √© autorizado a faz√™-lo, desde que o usu√°rio conceda permiss√£o para receber tais notifica√ß√Ķes.

void main() async {
  // Chamada do método "await InngageSDK.subscribe();"
  InngageNotificationMessage.subscribe(); // Configura√ß√Ķes de push e solicita√ß√£o de acesso √†s notifica√ß√Ķes

  runApp(MyApp());
}

Essa solicita√ß√£o de acesso √© fundamental para garantir que o aplicativo possa receber e exibir notifica√ß√Ķes push enviadas pela plataforma Inngage. √Č importante garantir que o m√©todo InngageNotificationMessage.subscribe() seja chamado corretamente no aplicativo para habilitar as notifica√ß√Ķes push e configurar adequadamente o sistema de notifica√ß√£o do usu√°rio.

ūüďė

Caso seja necess√°rio registrar um usu√°rio em uma √°rea n√£o logada do aplicativo, o par√Ęmetro friendlyIdentifier deve ser fornecido como null. Nesse caso, o mesmo ser√° atribu√≠do com o valor do Device Token do usu√°rio automaticamente.

Personalização (para sua identidade)

Adicionando Campos Personalizados

A SDK permite que o desenvolvedor que est√° integrando a SDK adicione campos customiz√°veis (customFields), como nome, e-mail, g√™nero, etc. No entanto, esses par√Ęmetros devem ser configurados previamente na plataforma da Inngage.

final json = {
    "nome": "Leonardo",
    "dt_nascimento": "01/09/1970",
    "genero": "M"
  };

await InngageSDK.subscribe(
  // Outros par√Ęmetros do m√©todo
  customFields: json,
);

Modificando o Identificador e adicionando novos Campos Personalizados

Ao preencher o par√Ęmetro identifier no m√©todo addUserData, a API substitui o identifier fornecido na requisi√ß√£o e adiciona os demais campos personalizados (customFields).

await InngageUtils.addUserData(
   identifier: 'Trocar pelo novo objeto Identificador do usu√°rio',
   customFields: {
    	"nome": "Leonardo",
    	"dt_nascimento": "1970-09-10",
    	"genero": "M"
  	};
 );

O registration é preenchido automaticamente com o token FCM do aplicativo. Caso o campo identifier não for informado, a API realizará o registro dos campos personalizados sem alterar o respectivo valor.

Solicitação de permissão dos dados de localização

Ao integrar a SDK, você pode obter os dados de localização do usuário ao registrá-lo na Inngage.

Para isso, basta inserir como true o par√Ęmetro requestGeoLocator dispon√≠vel no InngageSDK.subscribe():

await InngageSDK.subscribe(
    requestGeoLocator: true,
  );

Envio de eventos

A SDK permite que o desenvolvedor que est√° integrando a SDK envie eventos customizados. √Č importante configur√°-los na plataforma Inngage para garantir uma boa performance e integra√ß√£o.

await InngageEvent.sendEvent(
  eventName: 'compra',
  appToken: 'MyAppToken',
  identifier: '[email protected]',
  //registration: '', Firebase Token,
  conversion_event: true, //
  conversion_value: 1090.00, //Valor monet√°rio da convers√£o
  conversion_notid: "2314klbkf41bsgav4hg12ab24v1h41", //ID da mensagem
  eventValues: {
  	'produto': 'Bola de tenis',//Exemplo
    'valor': '40'//Exemplo
  },
);

Existem três valores obrigatórios para garantir o correto funcionamento:

  • eventName: Define o nome do evento, que ser√° usado para identific√°-lo rapidamente na plataforma.
  • appToken: √Č necess√°rio para validar suas credenciais.
  • identifier: √Č usado para identificar o usu√°rio dentro do sistema.

Voc√™ tamb√©m pode adicionar valores avan√ßados para esse evento usando o par√Ęmetro eventValues, que √© um array contendo chaves e valores com dados que ser√£o anexados ao evento.

A API de eventos também pode receber um evento de conversão, para isso, existem os seguintes campos:

  • conversion_event: Defina como True para indicar que √© um evento de convers√£o.
  • conversion_value: Esse campo permite inserir o valor monet√°rio da convers√£o. O valor padr√£o √© FLOAT 11000.00.
  • conversion_notid: Op√ß√£o para enviar o ID √önico da Notifica√ß√£o da Inngage (NOTID), que foi recebido pelo app no momento do Push. Isso possibilita atribuir uma convers√£o a um determinado Push."

In App Messages

A SDK Flutter da Inngage possibilita a exibi√ß√£o de Mensagens In App para os usu√°rios. Essas mensagens podem ser enviadas tanto pela plataforma quanto pela API e s√£o automaticamente apresentadas com base nas configura√ß√Ķes recebidas pelo payload do Firebase.

Para apresentar a mensagem In App, utilize o widget InngageInAppWidget nas p√°ginas em que deseja habilitar essa funcionalidade:

@override
Widget build(BuildContext context) {
  return MaterialApp(
    navigatorKey: navigatorKey,
    home: InngageInAppWidget(child: HomePage()),
  );
}

√Č poss√≠vel bloquear a abertura do deeplink e receber um callback com o link recebido na mensagem In App:

InngageInapp.blockDeepLink = true;
InngageInapp.deepLinkCallback = (link){
  print(link);
};

Essas configura√ß√Ķes permitem uma maior personaliza√ß√£o e controle sobre as Mensagens In App apresentadas ao usu√°rio em seu aplicativo Flutter.


ūüĎć

Você está pronto para começar!

Seguindo os passos acima da documentação você estará pronto para utilizar todas as ferramentas necessárias para as funcionalidades da SDK. :clap:

Possíveis incidentes

‚ĚóÔłŹ

"Estou com problemas para abrir URLs no Android"

Se o seu aplicativo Android estiver enfrentando problemas para abrir URLs a partir da API 31 (Android 12), é necessário listar explicitamente os aplicativos com os quais deseja interagir no AndroidManifest.xml. Isso é necessário devido a mudanças relacionadas à privacidade na API 31.

Para solucionar esse problema, adicione a seguinte configuração em seu AndroidManifest.xml:

<manifest xmlns:android="http://schemas.android.com/apk/res/android"
    package="com.example.yourapp">

    <!-- ... outras configura√ß√Ķes do manifesto ... -->

    <!-- Adicione a configuração para ignorar a listagem de aplicativos -->
    <queries>
        <package android:name="com.example.app1" />
        <package android:name="com.example.app2" />
        <!-- Adicione mais pacotes de aplicativos aqui, se necess√°rio -->
    </queries>

    <!-- ... outras configura√ß√Ķes do manifesto ... -->

</manifest>

Essa configuração permite que seu aplicativo liste explicitamente os aplicativos específicos com os quais deseja interagir. Dessa forma, o Android 12 não solicitará que seu aplicativo liste todos os aplicativos com os quais interage, proporcionando uma experiência mais controlada em dispositivos com a API 31 ou superior.

Para mais informa√ß√Ķes e detalhes sobre as mudan√ßas de visibilidade de pacotes no Android 12, consulte a documenta√ß√£o oficial do Android em: https://developer.android.com/about/versions/11/privacy/package-visibility.