Como Adicionar Deep Linking em Notificações Push de Aplicações Usando PushEngage

Envie os utilizadores da sua aplicação diretamente para um ecrã específico dentro da sua aplicação Android ou iOS quando tocam numa notificação push. Em vez de apenas abrir o ecrã inicial da aplicação, os deep links levam os utilizadores exatamente para onde pretende, podendo ser uma página de produto, um ecrã de estado de encomenda, uma oferta especial ou qualquer outro destino dentro da aplicação.

Este guia irá guiá-lo através da configuração de deep links utilizando o Painel PushEngage para Android e iOS.

Antes de Começar

Certifique-se de que o PushEngage está instalado e a funcionar na sua aplicação móvel (Android, iOS, Flutter ou React Native). Se ainda não o fez, siga o guia de configuração para a sua plataforma:

Guia de Configuração Flutter

Guia de Configuração iOS

Guia de Configuração React Native

Tenha o seu URL de deep link pronto. Este é o URL ou esquema URI que a sua aplicação utiliza para abrir um ecrã específico (por exemplo: myapp://products/123 ou https://suaapp.com/offers).

O que é um Deep Link?

Um deep link é um URL especial que aponta para uma página ou ecrã específico dentro da sua aplicação móvel. Quando um utilizador toca numa notificação push com um deep link, é levado diretamente para esse ecrã em vez de apenas para a página inicial da aplicação.

Exemplos:

• myapp://orders/456 : abre a encomenda #456 na aplicação
• https://sua_loja.com/sale : abre uma página de promoção na aplicação
• app://www.suaapp.com/trigger : abre um ecrã de fluxo de trabalho específico

Adicionar Deep Links através do Painel PushEngage

Para Push de Aplicação Android

1. Inicie sessão no seu Painel PushEngage.
2. Vá para App Push » Criar Campanha.
3. Selecione Android como plataforma.
4. Preencha o Título e a Mensagem da sua notificação.
5. Role para baixo até ao campo Deep Link.
6. Introduza o seu URL de deep link (por exemplo: myapp://products/123).
7. Clique em Enviar / Agendar para enviar a notificação.

Para Push de Aplicação iOS

1. Inicie sessão no seu Painel PushEngage.
2. Vá para App Push » Criar Campanha.
3. Selecione iOS como plataforma.
4. Preencha o Título e a Mensagem da sua notificação.
5. Role para baixo até ao campo Deep Link.
6. Introduza o seu URL de deep link (por exemplo: myapp://offers/summer-sale).
7. Clique em Enviar / Agendar para enviar a notificação.

Se nenhum deep link for definido no iOS, tocar na notificação simplesmente abrirá a aplicação. Tenha em atenção que os limites de caracteres para Deep links podem ser de até 1.600 caracteres em Android e iOS.

Tratamento de Deep Links no Código da Sua Aplicação

Depois de a notificação ser enviada com um deep link, a sua aplicação precisa de o escutar e navegar o utilizador para o ecrã correto. Veja como fazê-lo em cada plataforma:

Flutter

PushEngage.deepLinkStream.listen((data) {
  String? deepLink = data?['deepLink'];
  if (deepLink == null) return;
  Uri uri = Uri.parse(deepLink);
  if (uri.path == '/offers') {
    Navigator.pushNamed(context, '/offers');
  }
});

Além disso, certifique-se de que PushEngageAutoHandleDeeplinkURL está definido como NO no seu Info.plist do iOS se pretender que a sua aplicação trate do encaminhamento por si mesma.

React Native

PushEngage.onValueChanged((data) => {
  const { deepLink } = data;
  // Navigate based on the deep link value
  if (deepLink === '/orders') {
    navigation.navigate('Orders');
  }
});

iOS (Swift)

PushEngage.setNotificationOpenHandler { result in
  let deepLink = result.notificationAction.actionID
  // Route the user to the correct screen
}

Dica: Para iOS, se definir PushEngageAutoHandleDeeplinkURL como YES no seu Info.plist, o SDK abrirá automaticamente quaisquer URLs de deep link HTTP ou HTTPS no navegador. Defina como NO se pretender gerir o encaminhamento dentro da sua aplicação.

Android (Filtro de Intenção)

Para Android, adicione um filtro de intenção no seu AndroidManifest.xml para que a aplicação possa receber URLs de deep link:

<intent-filter>
    <action android:name="android.intent.action.VIEW" />
    <category android:name="android.intent.category.DEFAULT" />
    <data android:scheme="myapp" android:host="www.yourapp.com" />
</intent-filter>

Configurou agora o deep linking para as notificações push da sua aplicação utilizando o PushEngage. Os seus utilizadores serão direcionados diretamente para o ecrã correto quando tocarem numa notificação, quer a envie a partir do painel de controlo ou através da API.

Se encontrar algum problema, por favor contacte-nos clicando aqui. A nossa equipa de suporte terá todo o gosto em ajudá-lo.