Skip to main content

Visão geral

Se você tem um site mobile-friendly e quer convertê-lo em um aplicativo mobile para download na Apple App Store ou Google Play Store, Median.co é uma solução poderosa. Ele também oferece uma integração perfeita com OneSignal para habilitar notificações push.

Configuração

1. Crie seu aplicativo com Median.co

  1. Siga o Guia de Introdução do Median.co.
  2. Construa um aplicativo em <https://median.co/app>.

2. Configure o OneSignal

  1. Vá para onesignal.com e crie uma conta.
  2. Configure seu Aplicativo e Plataforma OneSignal.

Configure seu app e plataforma OneSignal

Configuração obrigatória para notificações push Para começar a enviar notificações push com OneSignal, você deve primeiro configurar seu app OneSignal com todas as plataformas que você suporta—Apple (APNs), Google (FCM), Huawei (HMS) e/ou Amazon (ADM).
Se sua organização já tem uma conta OneSignal, peça para ser convidado como função admin para configurar o app. Caso contrário, cadastre-se para uma conta gratuita para começar.
Você pode gerenciar múltiplas plataformas (iOS, Android, Huawei, Amazon, Web) sob um único app OneSignal.
1

Crie ou selecione seu app

  • Para adicionar plataformas a um app existente, vá para Settings > Push & In-App no dashboard OneSignal.
  • Para começar do zero, clique em New App/Website e siga as instruções.

Exemplo mostrando criação de um novo app.

2

Configure e ative uma plataforma

  • Escolha um nome claro e reconhecível para seu app e organização.
  • Selecione a(s) plataforma(s) que você quer configurar (iOS, Android, etc.).
  • Clique em Next: Configure Your Platform.

Exemplo configurando seu primeiro app OneSignal, org e canal.

3

Configure credenciais da plataforma

Siga as instruções baseadas nas suas plataformas:Clique em Save & Continue após inserir suas credenciais.
4

Escolha o SDK alvo

Selecione o SDK que corresponde à sua plataforma de desenvolvimento (por exemplo, iOS, Android, React Native, Unity), depois clique em Save & Continue.

Selecione qual SDK você está usando para navegar à documentação.

5

Instale o SDK e salve seu App ID

Uma vez que sua plataforma está configurada, seu OneSignal App ID será exibido. Copie e salve este ID—você precisará dele ao instalar e inicializar o SDK.Se estiver colaborando com outros, use o botão Invite para adicionar desenvolvedores ou membros da equipe, depois clique em Done para completar a configuração.

Salve seu App ID e convide membros adicionais da equipe.

Uma vez completo, siga o guia de instalação do SDK para sua plataforma selecionada para finalizar a integração OneSignal.

3. Vincule o OneSignal ao seu aplicativo Median

Cole o OneSignal App ID na configuração do seu aplicativo Median.co (GoNative).

Testando a integração do SDK OneSignal

Este guia ajuda você a verificar se sua integração do SDK OneSignal está funcionando corretamente testando notificações push, registro de assinatura e mensagens in-app.

Verificar assinaturas mobile

1

Inicie seu aplicativo em um dispositivo de teste.

O prompt de permissão push nativo deve aparecer automaticamente se você adicionou o método requestPermission durante a inicialização.

Prompts de permissão push do iOS e Android

2

Verifique seu painel OneSignal

Antes de aceitar o prompt, verifique o painel do OneSignal:
  • Vá para Audience > Subscriptions.
  • Você deve ver uma nova entrada com o status “Never Subscribed”.

Painel mostrando assinatura com status 'Never Subscribed'

3

Retorne ao aplicativo e toque em Allow no prompt.

4

Atualize a página de Assinaturas do painel OneSignal.

O status da assinatura agora deve mostrar Subscribed.

Painel mostrando assinatura com status 'Subscribed'

Você criou com sucesso uma assinatura mobile. Assinaturas mobile são criadas quando os usuários abrem seu aplicativo pela primeira vez em um dispositivo ou se desinstalarem e reinstalarem seu aplicativo no mesmo dispositivo.

Configurar assinaturas de teste

Assinaturas de teste são úteis para testar uma notificação push antes de enviar uma mensagem.
1

Adicionar a Test Subscriptions.

No painel, ao lado da assinatura, clique no botão Options (três pontos) e selecione Add to Test Subscriptions.

Adicionando um dispositivo a Test Subscriptions

2

Nomeie sua assinatura.

Nomeie a assinatura para que você possa identificar facilmente seu dispositivo mais tarde na Test Subscriptions tab.

Painel mostrando o campo 'Name your subscription'

3

Criar um segmento de usuários de teste.

Vá para Audience > Segments > New Segment.
4

Nomeie o segmento.

Nomeie o segmento Test Users (o nome é importante porque será usado mais tarde).
5

Adicione o filtro Test Users e clique em Create Segment.

Criando um segmento 'Test Users' com o filtro Test Users

Você criou com sucesso um segmento de usuários de teste. Agora podemos testar o envio de mensagens para este dispositivo individual e grupos de usuários de teste.

Enviar push de teste via API

1

Obtenha sua App API Key e App ID.

No painel do OneSignal, vá para Settings > Keys & IDs.
2

Atualize o código fornecido.

Substitua YOUR_APP_API_KEY e YOUR_APP_ID no código abaixo com suas chaves reais. Este código usa o segmento Test Users que criamos anteriormente.
curl -X \
POST --url 'https://api.onesignal.com/notifications' \
 --header 'content-type: application/json; charset=utf-8' \
 --header 'authorization: Key YOUR_APP_API_KEY' \
 --data \
 '{
  "app_id": "YOUR_APP_ID",
  "target_channel": "push",
  "name": "Testing basic setup",
  "headings": {
  	"en": "👋"
  },
  "contents": {
    "en": "Hello world!"
  },
  "included_segments": [
    "Test Users"
  ],
  "ios_attachments": {
    "onesignal_logo": "https://avatars.githubusercontent.com/u/11823027?s=200&v=4"
  },
  "big_picture": "https://avatars.githubusercontent.com/u/11823027?s=200&v=4"
}'
3

Execute o código.

Execute o código no seu terminal.
4

Verifique imagens e entrega confirmada.

Se todas as etapas de configuração foram concluídas com sucesso, as assinaturas de teste devem receber uma notificação com uma imagem incluída:

Notificação push com imagem no iOS e Android

As imagens aparecerão pequenas na visualização de notificação recolhida. Expanda a notificação para ver a imagem completa.
5

Verificar entrega confirmada.

No seu painel, vá para Delivery > Sent Messages, então clique na mensagem para ver as estatísticas.Você deve ver a estatística confirmed, significando que o dispositivo recebeu o push.

Estatísticas de entrega mostrando entrega confirmada

Se você está em um plano Professional ou superior, role até Audience Activity para ver a confirmação no nível de assinatura:

Entrega confirmada no nível do dispositivo em Audience Activity

Você enviou com sucesso uma notificação via nossa API para um segmento.
  • Não recebeu imagem? Sua Notification Service Extension pode estar faltando.
  • Sem entrega confirmada? Revise sua configuração de App Groups.
  • Tendo problemas? Copie e cole a solicitação da api e um log do início ao fim do lançamento do aplicativo em um arquivo .txt. Então compartilhe ambos com support@onesignal.com.

Enviar uma mensagem in-app

Mensagens in-app permitem que você se comunique com usuários enquanto eles estão usando seu aplicativo.
1

Feche ou coloque seu aplicativo em segundo plano no dispositivo.

Isso ocorre porque os usuários devem atender aos critérios de público in-app antes que uma nova sessão comece. No OneSignal, uma nova sessão começa quando o usuário abre seu aplicativo depois de ter estado em segundo plano ou fechado por pelo menos 30 segundos. Para mais detalhes, consulte nosso guia sobre como mensagens in-app são exibidas.
2

Criar uma mensagem in-app.

  • No painel do OneSignal, navegue até Messages > In-App > New In-App.
  • Encontre e selecione a mensagem Welcome.
  • Defina seu Público como o segmento Test Users que usamos anteriormente.

Direcionando o segmento 'Test Users' com uma mensagem in-app

3

Personalize o conteúdo da mensagem se desejar.

Exemplo de personalização da mensagem in-app de Welcome

4

Defina o Trigger como 'On app open'.

5

Agendar frequência.

Em Schedule > How often do you want to show this message? selecione Every time trigger conditions are satisfied.

Opções de agendamento de mensagem in-app

6

Tornar mensagem ativa.

Clique em Make Message Live para que esteja disponível para seus Test Users cada vez que abrirem o aplicativo.
7

Abra o aplicativo e veja a mensagem.

Depois que a mensagem in-app estiver ativa, abra seu aplicativo. Você deve vê-la exibida:

Mensagem in-app de Welcome mostrada em dispositivos

Não está vendo a mensagem?
  • Inicie uma nova sessão
    • Você deve fechar ou colocar o aplicativo em segundo plano por pelo menos 30 segundos antes de reabrir. Isso garante que uma nova sessão seja iniciada.
    • Para mais, consulte como mensagens in-app são exibidas.
  • Ainda no segmento Test Users?
    • Se você reinstalou ou trocou de dispositivo, adicione novamente o dispositivo a Test Subscriptions e confirme que faz parte do segmento Test Users.
  • Tendo problemas?
    • Siga Obtendo um Debug Log enquanto reproduz as etapas acima. Isso gerará logs adicionais que você pode compartilhar com support@onesignal.com e ajudaremos a investigar o que está acontecendo.
Você configurou com sucesso o SDK OneSignal e aprendeu conceitos importantes como:

Solicitar permissões push

Em vez de chamar requestPermission() imediatamente na abertura do aplicativo, adote uma abordagem mais estratégica. Use uma mensagem in-app para explicar o valor das notificações push antes de solicitar permissão. Para melhores práticas e detalhes de implementação, consulte nosso guia Solicitar permissões push.

FAQ

Como posso acessar dados do OneSignal no lado do cliente?

Use o método Median Native JavaScript Bridge median_onesignal_info para recuperar o OneSignal Subscription ID (oneSignalUserId) e o status de assinatura.
javascript
  var osSubscriptionId = "the OneSignal Subscription ID string";
  var isSubscribedToPushNotifications;

  median.onesignal.onesignalInfo().then(function (oneSignalInfo) {
    console.log(oneSignalInfo);
    osSubscriptionId = oneSignalInfo.oneSignalUserId;
    isSubscribedToPushNotifications = oneSignalInfo.oneSignalSubscribed;
  });
Mais detalhes em Median.co Docs
Aplicativos Median usam deep linking para uma experiência nativa em vez de abrir um navegador pop-up.

Ao usar o painel OneSignal:

  • Não use o campo Launch URL.
  • Em vez disso, use o campo Additional Data.
    • Adicione uma chave: targetUrl (“U” maiúsculo)
    • Adicione um valor: a URL que você quer que os usuários abram.

Usando Additional Data com targetUrl

Ao usar a API REST:

Inclua targetUrl no objeto data do seu payload push. Exemplo:
{
  "app_id": "YOUR-APP-ID",
  "include_player_ids": ["USER-ID"],
  "data": { "targetUrl": "https://example.com/page" },
  "contents": { "en": "Check out this page!" }
}

Enviando para web e mobile?

Se você envia para web e mobile simultaneamente: Na seção Launch URL, selecione “Different URL for web/app”. Deixe o campo APP URL em branco para evitar substituição.

Configurando URLs diferentes para web e mobile