Visão geral
Notificações web push são uma forma poderosa de reengajar usuários e entregar informações importantes quando eles não estão navegando ativamente no seu website. Elas suportam conteúdo rico incluindo texto, imagens, botões de ação e podem ajudar a aumentar retenção e engajamento de usuários.
Notificações web push ajudam você a alcançar usuários mesmo quando eles não estão no seu site
- Website HTTPS: Web push apenas funciona em sites seguros com um certificado SSL válido
- Origem de domínio único: Deve seguir a política de mesma origem
- Permissão do usuário: Usuários devem explicitamente conceder permissão para receber notificações
- Navegadores suportados: Funciona na maioria dos navegadores modernos (Chrome, Firefox, Safari, Edge)
- Usuários não podem se inscrever enquanto estão no modo Anônimo ou navegação privada
- Dispositivos iOS requerem configuração adicional (veja Web push para iOS)
- Alguns navegadores podem ter limites de notificação ou requerer interação do usuário, veja FAQ de Web Push
Guias de desenvolvedor de web push
Antes que você possa enviar notificações web push, seu desenvolvedor precisa completar os seguintes passos.Não é desenvolvedor? Veja Gerenciar Membros da Equipe para convidar um colega de equipe com acesso de desenvolvedor ao seu projeto OneSignal.
Configuração do Web SDK
Guia completo para instalar e configurar o Web SDK OneSignal, incluindo testes localhost e prompts de permissão.
Plugin WordPress
Integre rapidamente notificações push no WordPress usando nosso plugin oficial—sem código necessário.
Configuração de web push para iOS
Siga passos específicos da Apple para habilitar web push em iPhones e iPads rodando iOS 16.4+.
Migração de outro provedor
Aprenda como fazer transição de outro provedor de web push e reter seus inscritos.
Opções de configuração
Configure seu website para web push no dashboard OneSignal em Settings > Push & In-App > Web.
Ative a plataforma web nas suas configurações OneSignal
Escolha seu tipo de integração baseado na configuração do seu website
Site Típico
Recomendado - Configure prompts, notificação de boas-vindas e configuração de service worker diretamente no dashboard—sem código backend necessário.
WordPress
Use o plugin oficial OneSignal para configurar facilmente push no seu site WordPress com configuração completa baseada em UI.
Código Personalizado
Configuração com controle completo para desenvolvedores que querem personalizar tudo via código.
- Nome do Site: Usado em títulos de notificação padrão
- URL do Site: Deve corresponder exatamente à origem do seu domínio (sem caminhos ou incompatibilidade de
www) - Auto Resubscribe: Recomendado - Reinscreve automaticamente usuários que retornam e limparam dados do navegador
- URL do Ícone Padrão: Imagem
256x256pxmostrada em notificações (se não definida, um ícone de sino padrão é usado)
Auto resubscribe
Um conceito importante com web push é que se usuários limparem seus dados de navegador, eles pararão de receber notificações push. Habilite esta opção para reinscrever automaticamente usuários quando eles retornarem ao seu site. Veja Subscriptions para mais detalhes.
Configurações Web no dashboard OneSignal
Prompts de permissão web
Solicitar permissão de notificação aos usuários é crítico para opt-in. Você pode personalizar o comportamento e aparência de requisições de permissão baseado na sua configuração. Melhores práticas:- Use mensagens claras que explicam o benefício
- Solicite usuários no momento certo (ex: após engajamento)
- Use um pré-prompt antes de acionar o diálogo nativo do navegador
Prompts de permissão web
Compare diferentes tipos de prompt (slidedown, baseado em categoria, nativo, sino de subscription e mais) e aprenda quando usar cada um.
Referência do Web SDK
Aprenda como controlar programaticamente quando e como prompts são mostrados usando o SDK.
Notificação de boas-vindas
Você pode habilitar um push de confirmação opcional que é enviado imediatamente após um usuário se inscrever. Integração Típica e Wordpress podem definir isso no dashboard.
Notificações de boas-vindas confirmam subscription bem-sucedida e demonstram valor
welcomeNotification na função OneSignal.init. Veja Referência do Web SDK para detalhes.
Por que enviar notificações de boas-vindas?
- Deixe usuários saberem que se inscreveram com sucesso
- Mostre como notificações futuras parecerão
- Forneça conteúdo de onboarding ou próximos passos
Entendendo usuários e subscriptions
Quando um usuário se inscreve para push, o OneSignal automaticamente cria uma subscription única vinculada ao navegador/dispositivo dele. Subscriptions de web push são criadas quando usuários:- Concedem permissão para notificações push no seu website usando um navegador e dispositivo específicos
- Retornam ao seu site após limpar dados do navegador (se Auto Resubscribe estiver habilitado)
- Inscrevem-se de um novo navegador ou dispositivo
- Cada combinação navegador/dispositivo cria uma subscription separada
- Modo de navegação anônima/privada não pode criar subscriptions
- Subscriptions de web push permanecem anônimas até que você atribua a elas um External ID
Dashboard OneSignal: Audience > Users
Users
Aprenda como gerenciar usuários, atribuir External IDs e rastrear sua atividade.
Subscriptions
Entenda como subscriptions funcionam através de navegadores e dispositivos.
Segments
Agrupe usuários em segmentos para direcionar baseado em comportamento, dispositivo e mais.
Suporte iOS
A Apple adicionou suporte de web push para iPhones e iPads rodando iOS 16.4+ mas com requisitos mais rigorosos:- Usuários devem adicionar seu site à Tela Inicial deles
- Prompts de permissão são mostrados apenas após aquele passo
- Notificações comportam-se como alertas de app nativo uma vez habilitadas
Web push para iOS
Instruções passo a passo para habilitar suporte iOS, incluindo configuração de service worker e manifest.
Fazendo sua audiência adicionar à Tela Inicial
Dicas para encorajar usuários a instalar seu site para que possam receber web push do iOS.
Projetar notificações web push
Criar uma boa notificação push envolve mais que escrever texto. Design importa. Aprenda quais elementos são personalizáveis e como usá-los efetivamente.
Anatomia de notificação web push - personalize elementos 1-6, enquanto 7-9 são controlados pelo navegador
- Título: Manchete que chama atenção (recomendado: menos de
50caracteres) - Mensagem: Conteúdo principal da notificação (recomendado: menos de
120caracteres) - Ícone: Ícone da sua marca ou imagem específica da notificação (recomendado:
256x256pxPNG ou JPG) - Imagem Grande: Conteúdo visual que chama atenção
- Botões de Ação: Botões de call-to-action
- Navegador: O navegador/app exibindo o push
- Domínio: Origem do seu site definida automaticamente pelo navegador
- Timestamp & Dismiss: Navegador adiciona estes controles
- Mais Opções: Controles adicionais específicos do navegador
Visão geral de Push
Visão geral completa de criação de notificação push, opções e comportamento de entrega.
Templates
Economize tempo com templates reutilizáveis para mensagens consistentes.
Personalização e localização de mensagem
Você pode personalizar mensagens push para corresponder às preferências e idioma de cada usuário.Personalização de Mensagem
Insira variáveis dinâmicas (como nome ou preferências) para adaptar mensagens.
Mensagens Multi-Idioma
Entregue automaticamente mensagens no idioma preferido de cada usuário.
Configurar comportamento de web push
Controle como suas mensagens push se comportam após envio—quando aparecem, por quanto tempo são armazenadas e como usuários interagem.Configurações de entrega, exibição e descarte
Throttling
Controle velocidade de entrega de notificação.
Frequency Capping
Defina limites para prevenir envio excessivo de notificações para o mesmo usuário.
Time To Live (TTL)
Defina por quanto tempo serviços push retêm mensagens quando o dispositivo está offline.
Web Push Topic
Use tópicos para agrupar, substituir ou suprimir notificações duplicadas.
Comportamento de clique
Controle o que acontece quando um usuário clica em uma notificação. Por padrão: Clicar abre sua página inicial. Personalize:- Direcione usuários para uma URL específica
- Use rastreamento UTM
- Suprima comportamento padrão com
?_osp=do_not_open
URLs, Links & Deep Linking
Direcione usuários para conteúdo ou páginas relevantes usando deep links e rastreamento.
Botões de ação
Deixe usuários tomarem ações imediatas da sua notificação.
SDK Push Notification Event Listeners
Escute eventos de clique e acione comportamento in-app com código personalizado.
Teste sua configuração
Antes de lançar, teste completamente sua implementação de web push através de dispositivos e navegadores.Checklist pré-lançamento
- SDK está carregado corretamente sem erros
- Prompt de permissão aparece e funciona
- Notificação de teste é enviada e recebida
- Ícones e imagens renderizam corretamente
- Service worker está atualizado
- Certificado HTTPS é válido
Analytics de push e solução de problemas
Meça e melhore desempenho de notificação:Relatórios de mensagem push
Veja métricas de entrega, taxa de abertura e click-through para cada mensagem.
Visão geral de Analytics
Explore métricas de engajamento e comportamento do usuário através de canais.
Notificações não mostradas ou atrasadas
Checklist de solução de problemas se mensagens não estão aparecendo.
Imagens de notificação não mostrando
Corrija problemas de renderização de imagem através de diferentes navegadores.