Assinaturas e Rastreamento de Afiliados no React Native
Construir um modelo de assinatura em React Native exige conectar várias peças: as lojas de aplicativos nativas para processamento de pagamentos, um serviço de validação de recibos para gerenciamento de assinaturas e um sistema de rastreamento de afiliados para creditar os parceiros que trazem novos assinantes. Este guia percorre toda a configuração.
Visão Geral da Arquitetura
A pilha de assinatura típica para um aplicativo React Native com rastreamento de afiliados consiste em três camadas:
- Camada de pagamento: a Apple App Store e o Google Play lidam com as transações de pagamento reais por meio de seus sistemas nativos de IAP
- Camada de gerenciamento de assinaturas: o RevenueCat (ou Adapty) valida recibos, gerencia o status da assinatura e fornece uma API unificada entre plataformas
- Camada de rastreamento de afiliados: o Insert Affiliate conecta os cliques em links de afiliados às compras de assinatura, atribuindo a receita ao parceiro afiliado certo
Essas camadas se comunicam por meio de webhooks e callbacks do lado do servidor, o que significa que o trabalho de integração acontece tanto no seu código React Native quanto na configuração do seu backend.
Configurando o RevenueCat
Comece instalando o SDK do RevenueCat no seu projeto React Native. O RevenueCat fornece um pacote React Native que envolve as APIs de compra nativas do iOS e Android em uma única interface JavaScript.
Primeiro, configure seus produtos no App Store Connect e no Google Play Console — seus níveis de assinatura, preços e ofertas de teste gratuito. Em seguida, espelhe esses produtos no painel do RevenueCat como Offerings que seu aplicativo pode exibir.
No seu código React Native, inicialize o RevenueCat no início do ciclo de vida do aplicativo com sua chave de API. Use a API de Offerings para buscar os planos de assinatura disponíveis e exibi-los no seu componente de paywall. Quando um usuário tocar em assinar, chame o método de compra com o pacote selecionado.
O RevenueCat lida com a validação de recibos, o ciclo de vida da assinatura (renovações, cancelamentos, períodos de carência) e fornece uma fonte de verdade do lado do servidor para o status da assinatura.
Integrando o Insert Affiliate
O Insert Affiliate rastreia a jornada do clique no link de afiliado até a compra da assinatura. A integração tem duas partes: lidar com os links de afiliados que chegam ao seu aplicativo e conectar os eventos de compra às atribuições de afiliados.
Lidando com links de afiliados: quando um usuário toca em um link de afiliado, ele é direcionado para a App Store ou Play Store (se o aplicativo não estiver instalado) ou levado por deep link para dentro do aplicativo (se estiver instalado). Instale o SDK React Native do Insert Affiliate para capturar os dados de atribuição quando o aplicativo abrir.
O SDK captura o identificador de afiliado do deep link e o armazena localmente. Esse identificador persiste durante o fluxo de instalação — mesmo quando o usuário instala a partir da loja e abre o aplicativo pela primeira vez.
Conectando compras: configure o Insert Affiliate para receber notificações de webhook do RevenueCat. Quando um usuário assina, o RevenueCat envia um evento ao servidor do Insert Affiliate, que combina a compra com a atribuição de afiliado armazenada. O afiliado recebe o crédito pela conversão.
Construindo o Componente de Paywall
Seu paywall é onde a conversão acontece. Construa-o como uma tela React Native dedicada que exibe as ofertas de assinatura buscadas no RevenueCat.
Elementos-chave de um paywall eficaz:
- Proposta de valor clara acima da dobra
- Opções de níveis de assinatura com preços
- Destaque do teste gratuito, se aplicável
- Prova social ou destaques de avaliações
- Botão de assinar em destaque
Mantenha o componente focado. Cada elemento deve mover o usuário em direção à assinatura. Evite sobrecarregar a tela com recursos que distraem da decisão de compra.
Testando o Fluxo Completo
Teste a jornada completa do usuário no modo sandbox:
- Gere um link de afiliado de teste por meio do Insert Affiliate
- Clique no link em um dispositivo de teste
- Instale o aplicativo (ou abra-o, se já estiver instalado)
- Conclua uma compra de assinatura sandbox
- Verifique se a atribuição aparece no painel do Insert Affiliate
- Confirme se o afiliado é creditado com a comissão correta
Teste tanto no iOS quanto no Android. O comportamento do deep linking difere entre as plataformas, e cada loja de aplicativos tem seu próprio ambiente de compra sandbox.
Lidando com Casos Extremos
Vários cenários precisam de atenção:
Deep links diferidos: quando um usuário clica em um link de afiliado, mas não tem o aplicativo instalado, o deep linking diferido do Insert Affiliate preserva a atribuição durante o processo de instalação. Teste esse fluxo especificamente.
Restauração de assinatura: quando um usuário reinstala o aplicativo ou troca de dispositivo, o RevenueCat restaura sua assinatura. A atribuição original de afiliado permanece intacta porque é armazenada no lado do servidor.
Compartilhamento familiar: se um assinante compartilha sua assinatura por meio do Compartilhamento Familiar, os usuários adicionais não são novas conversões e não devem gerar comissões adicionais de afiliados. O sistema de entitlements do RevenueCat lida com essa distinção.
Entrando no Ar
Antes de lançar, verifique se suas conexões de webhook entre o RevenueCat e o Insert Affiliate estão configuradas para produção (não sandbox). Defina suas taxas de comissão, janela de atribuição e quaisquer termos promocionais para seus parceiros afiliados iniciais.
Com a integração técnica concluída, seu foco muda para recrutar afiliados e otimizar a taxa de conversão do seu paywall — as duas alavancas que determinam quanta receita seu canal de afiliados gera.