Skip to content

Registre dados de mensagens no app

Saiba como registrar dados de mensagens no app (IAM) por meio do SDK do Braze.

Pré-requisitos

Antes de poder usar esse recurso, você precisará integrar o Web Braze SDK.

Envio de mensagens de registro de dados

O registro de impressões e cliques de mensagens no app é realizado automaticamente quando se usa o método showInAppMessage ou automaticallyShowInAppMessage.

Se não usar nenhum dos métodos e aceitar exibir a mensagem manualmente usando seu próprio código de interface do usuário, use os seguintes métodos para registrar análises de dados:

1
2
3
4
5
6
7
8

// Registers that a user has viewed an in-app message with the Braze server.
braze.logInAppMessageImpression(inAppMessage);
// Registers that a user has clicked on the specified in-app message with the Braze server.
braze.logInAppMessageClick(inAppMessage);
// Registers that a user has clicked a specified in-app message button with the Braze server.
braze.logInAppMessageButtonClick(button, inAppMessage);
// Registers that a user has clicked on a link in an HTML in-app message with the Braze server.
braze.logInAppMessageHtmlClick(inAppMessage, buttonId?, url?)

Pré-requisitos

Antes de poder usar esse recurso, você precisará integrar o Flutter Braze SDK.

Envio de mensagens de registro de dados

Para registrar análises de dados usando o BrazeInAppMessage, passe as referências de instância para a função de análises desejada:

  • logInAppMessageClicked
  • logInAppMessageImpression
  • logInAppMessageButtonClicked (juntamente com o índice de botões)

Por exemplo:

1
2
3
4
5
6

// Log a click
braze.logInAppMessageClicked(inAppMessage);
// Log an impression
braze.logInAppMessageImpression(inAppMessage);
// Log button index `0` being clicked
braze.logInAppMessageButtonClicked(inAppMessage, 0);

Acesso a dados de mensagens

Para acessar os dados de mensagens no app no seu aplicativo Flutter, o site BrazePlugin suporta o envio de dados de mensagens no app usando o Dart Streams.

O objeto BrazeInAppMessage é compatível com um subconjunto de campos disponíveis nos objetos do modelo nativo, incluindo uri, message, header, buttons, extras, entre outros.

Etapa 1: Ouça os dados de mensagens no app na camada Dart

Para receber os dados da mensagem no app na camada Dart, use o código abaixo para criar um StreamSubscription e chamar braze.subscribeToInAppMessages(). Lembre-se de cancel() a inscrição de fluxo quando ela não for mais necessária.

1
2
3
4
5
6
7
8
9

// Create stream subscription
StreamSubscription inAppMessageStreamSubscription;

inAppMessageStreamSubscription = braze.subscribeToInAppMessages((BrazeInAppMessage inAppMessage) {
  // Handle in-app messages
}

// Cancel stream subscription
inAppMessageStreamSubscription.cancel();

Para obter um exemplo, consulte main.dart em nosso app de amostra.

Etapa 2: Encaminhar dados de mensagens no app a partir da camada nativa

Para receber os dados na camada Dart da etapa 1, adicione o seguinte código para encaminhar os dados da mensagem no app a partir das camadas nativas.

Os dados das mensagens no app são encaminhados automaticamente da camada Android.

Você pode encaminhar dados de mensagens no app de duas maneiras:

  1. Implemente o delegado BrazeInAppMessageUIDelegate conforme descrito no artigo do iOS sobre o delegado de mensagens no app.

  2. Atualize a implementação do delegado willPresent para chamar BrazePlugin.process(inAppMessage).

  1. Certifique-se de ter ativado a interface do usuário de mensagens no app e defina o endereço inAppMessagePresenter como seu apresentador personalizado. 
    1
2

     let inAppMessageUI = CustomInAppMessagePresenter()
 braze.inAppMessagePresenter = inAppMessageUI
  2. Crie sua classe de apresentador personalizada e acesse BrazePlugin.process(inAppMessage) em present(message:). 
    1
2
3
4
5
6
7
8
9

    class CustomInAppMessagePresenter: BrazeInAppMessageUI {
  override func present(message: Braze.InAppMessage) {
 // Pass in-app message data to the Dart layer.
 BrazePlugin.processInAppMessage(message)

 // If you want the default UI to display the in-app message.
 super.present(message: message)
  }
}

Etapa 3: Repetição do retorno de chamada para mensagens no app (opcional)

Para armazenar mensagens no app disparadas antes que o retorno de chamada esteja disponível e reproduzi-las depois que ele for definido, adicione a seguinte entrada ao mapa customConfigs ao inicializar o BrazePlugin:

1

BrazePlugin braze = new BrazePlugin(customConfigs: {replayCallbacksConfigKey: true});

Pré-requisitos

Antes de poder usar esse recurso, você precisará integrar o React Native Braze SDK.

Métodos de registro

Você pode usar esses métodos passando sua instânciaBrazeInAppMessage para registro análise de dados e realizar ações:

Envio de mensagens de dados

Na maioria dos casos, você pode usar o método Braze.addListener para registrar ouvintes de eventos para lidar com dados provenientes de mensagens no app.

Além disso, você pode acessar os dados da mensagem no app na camada JavaScript chamando o método Braze.subscribeToInAppMessage para que os SDKs publiquem um evento inAppMessageReceived quando uma mensagem no app for acionada. Passe um retorno de chamada para este método para executar seu próprio código quando a mensagem no app for acionada e recebida pelo ouvinte.

Para personalizar a forma como os dados das mensagens são tratados, consulte os exemplos de implementação a seguir:

Para aprimorar o comportamento padrão, ou se você não tiver acesso para personalizar o código nativo do iOS ou do Android, recomendamos que você desative a interface do usuário padrão e, ao mesmo tempo, continue recebendo eventos de mensagens no app com código personalizado do Braze. Para desativar a interface do usuário padrão, passe false para o método Braze.subscribeToInAppMessage e use os dados da mensagem no app para construir sua própria mensagem em JavaScript. Note que será necessário registrar manualmente a análise de dados em suas mensagens se optar por desativar a IU padrão.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17

import Braze from "@braze/react-native-sdk";

// Option 1: Listen for the event directly via `Braze.addListener`.
//
// You may use this method to accomplish the same thing if you don't
// wish to make any changes to the default Braze UI.
Braze.addListener(Braze.Events.IN_APP_MESSAGE_RECEIVED, (event) => {
  console.log(event.inAppMessage);
});

// Option 2: Call `subscribeToInAppMessage`.
//
// Pass in `false` to disable the automatic display of in-app messages.
Braze.subscribeToInAppMessage(false, (event) => {
  console.log(event.inAppMessage);
  // Use `event.inAppMessage` to construct your own custom message UI.
});

Para incluir uma lógica mais avançada para determinar se deve ou não mostrar uma mensagem no app usando a interface do usuário integrada, implemente mensagens no app através da camada nativa.

Implemente o IInAppMessageManagerListener conforme descrito em nosso artigo do Android sobre Custom Manager Listener. Na sua beforeInAppMessageDisplayed implementação, você pode acessar os dados inAppMessage, enviá-los para a camada JavaScript e decidir mostrar ou não a mensagem nativa com base no valor de retorno.

Para mais informações sobre esses valores, consulte nossa documentação do Android.

1
2
3
4
5
6
7
8
9
10
11
12
13
14

// In-app messaging
@Override
public InAppMessageOperation beforeInAppMessageDisplayed(IInAppMessage inAppMessage) {
    WritableMap parameters = new WritableNativeMap();
    parameters.putString("inAppMessage", inAppMessage.forJsonPut().toString());
    getReactNativeHost()
        .getReactInstanceManager()
        .getCurrentReactContext()
        .getJSModule(DeviceEventManagerModule.RCTDeviceEventEmitter.class)
        .emit("inAppMessageReceived", parameters);
    // Note: return InAppMessageOperation.DISCARD if you would like
    // to prevent the Braze SDK from displaying the message natively.
    return InAppMessageOperation.DISPLAY_NOW;
}

Substituindo o delegate de interface do usuário padrão

Por padrão, BrazeInAppMessageUI é criado e atribuído quando você inicializa a instância braze. BrazeInAppMessageUI é uma implementação do protocolo BrazeInAppMessagePresenter e vem com uma propriedade delegate que pode ser usada para personalizar o tratamento de mensagens no app que foram recebidas.

  1. Implemente o BrazeInAppMessageUIDelegate conforme descrito em nosso artigo sobre iOS aqui.

  2. No método delegateinAppMessage(_:displayChoiceForMessage:), você pode acessar os dados inAppMessage, enviá-los para a camada JavaScript e decidir mostrar ou não a mensagem nativa com base no valor de retorno.

Para mais detalhes sobre esses valores, consulte nossa documentação do iOS.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16

- (enum BRZInAppMessageUIDisplayChoice)inAppMessage:(BrazeInAppMessageUI *)ui
                            displayChoiceForMessage:(BRZInAppMessageRaw *)message {
  // Convert the message to a JavaScript representation.
  NSData *inAppMessageData = [message json];
  NSString *inAppMessageString = [[NSString alloc] initWithData:inAppMessageData encoding:NSUTF8StringEncoding];
  NSDictionary *arguments = @{
    @"inAppMessage" : inAppMessageString
  };

  // Send to JavaScript.
  [self sendEventWithName:@"inAppMessageReceived" body:arguments];

  // Note: Return `BRZInAppMessageUIDisplayChoiceDiscard` if you would like
  // to prevent the Braze SDK from displaying the message natively.
  return BRZInAppMessageUIDisplayChoiceNow;
}

Para usar este delegate, atribua-o a brazeInAppMessagePresenter.delegate após inicializar a instância braze.

1
2
3
4
5
6
7
8

@import BrazeUI;

- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions {
  BRZConfiguration *configuration = [[BRZConfiguration alloc] initWithApiKey:apiKey endpoint:endpoint];
  Braze *braze = [BrazeReactBridge initBraze:configuration];
  ((BrazeInAppMessageUI *)braze.inAppMessagePresenter).delegate = [[CustomDelegate alloc] init];
  AppDelegate.braze = braze;
}

Substituindo a interface de usuário nativa padrão

Se você deseja personalizar totalmente a apresentação de suas mensagens no app na camada nativa do iOS, conforme o protocolo BrazeInAppMessagePresenter e atribua seu apresentador personalizado seguindo o exemplo abaixo:

1
2
3
4

BRZConfiguration *configuration = [[BRZConfiguration alloc] initWithApiKey:apiKey endpoint:endpoint];
Braze *braze = [BrazeReactBridge initBraze:configuration];
braze.inAppMessagePresenter = [[MyCustomPresenter alloc] init];
AppDelegate.braze = braze;

Pré-requisitos

Antes de usar este recurso, você precisará integrar o SDK Android Braze.

Envio de mensagens de registro de dados

Você precisará garantir que certas funções sejam chamadas para lidar com a análise de dados da sua campanha.

Envio de mensagens

Quando uma mensagem é exibida ou vista, registre uma impressão:

1

LogInAppMessageImpression(in_app_message.id, brazetask)

Envio de mensagens clicadas

Depois que um usuário clica na mensagem, registre um clique e então processe in_app_message.click_action:

1

LogInAppMessageClick(in_app_message.id, brazetask)

Botões clicados

Se o usuário clicar em um botão, registre o clique do botão e depois processe inappmessage.buttons[selected].click_action:

1

LogInAppMessageButtonClick(inappmessage.id, inappmessage.buttons[selected].id, brazetask)

Após o processamento de uma mensagem

Depois de processar uma mensagem no app, você deve limpar o campo:

1

m.BrazeTask.BrazeInAppMessage = invalid

Inscrevendo-se em mensagens no aplicativo

Você pode registrar objetos de jogo Unity para serem notificados sobre mensagens no app. Recomendamos configurar os ouvintes de objetos de jogo no editor de configuração do Braze. No editor de configuração, os ouvintes devem ser definidos separadamente para Android e iOS.

Se você precisar configurar o ouvinte do objeto do jogo em tempo de execução, use AppboyBinding.ConfigureListener() e especifique BrazeUnityMessageType.IN_APP_MESSAGE.

Analisando mensagens

As mensagens string recebidas em seu retorno de chamada de objeto de jogo de mensagem no app podem ser analisadas em nossos objetos de modelo pré-fornecidos por conveniência.

Use InAppMessageFactory.BuildInAppMessage() para analisar sua mensagem no app. O objeto resultante será uma instância de IInAppMessage.cs ou IInAppMessageImmersive.cs dependendo de seu tipo.

1
2
3
4
5
6
7
8
9
10

// Automatically logs a button click, if present.
void InAppMessageReceivedCallback(string message) {
  IInAppMessage inApp = InAppMessageFactory.BuildInAppMessage(message);
  if (inApp is IInAppMessageImmersive) {
    IInAppMessageImmersive inAppImmersive = inApp as IInAppMessageImmersive;
    if (inAppImmersive.Buttons != null && inAppImmersive.Buttons.Count > 0) {
      inAppImmersive.LogButtonClicked(inAppImmersive.Buttons[0].ButtonID);
    }
  }
}

Registrando dados de mensagens

Os cliques e impressões devem ser registrados manualmente para mensagens no app não exibidas diretamente pelo Braze.

Use LogClicked() e LogImpression() em IInAppMessage para registrar os cliques e as impressões da sua mensagem.

Use LogButtonClicked(int buttonID) on IInAppMessageImmersive para registrar os cliques nos botões. Observe que os botões são representados como listas de instânciasInAppMessageButton cada uma das quais contém um ButtonID.
Github   Editar esta página no GitHub
New Stuff!