Como Redirecionar Quem Clica em Voltar no Navegador

Para redirecionar quem clica no botão voltar do navegador, você usa a API history.pushState do JavaScript para adicionar entradas extras no histórico e o evento popstate para interceptar o clique e executar o redirecionamento. O script funciona em todos os navegadores modernos, tanto em desktop quanto em mobile.

"Três linhas de JavaScript transformam o botão voltar do navegador em um redirecionamento controlado."

Resumo rápido:

• history.pushState adiciona entradas falsas no histórico do navegador
• O evento popstate detecta quando o usuário clica em voltar
• O script redireciona para qualquer URL, preservando parâmetros
• Funciona em Chrome, Firefox, Safari, Edge e navegadores mobile

Como funciona o redirecionamento do botão voltar?

O botão voltar do navegador funciona com base no histórico de navegação. Cada página visitada é adicionada a uma pilha. Quando você clica em voltar, o navegador remove a entrada mais recente e carrega a anterior.

O método history.pushState permite adicionar entradas a essa pilha via JavaScript, sem navegar para outra página. Quando você adiciona duas entradas extras apontando para a mesma URL, o botão voltar precisa "consumir" essas entradas antes de realmente sair da página. É nesse momento que o evento popstate é disparado -- e você intercepta para redirecionar.

O script completo com explicação linha a linha

<script>
    // 1. Define a URL de destino do redirecionamento
    var urlRedirecionamento = 'https://sua-url-aqui.com.br';

    // 2. Concatena os parâmetros da URL atual ao destino
    //    Se a URL de destino já tem parâmetros (?), usa &
    //    Se não tem, usa ? para iniciar os parâmetros
    urlRedirecionamento = urlRedirecionamento.trim() +
            (urlRedirecionamento.indexOf("?") > 0 ? '&' : '?') +
            document.location.search.replace('?', '').toString();

    // 3. Adiciona duas entradas no histórico apontando para a URL atual
    //    Isso impede que o primeiro clique em voltar saia da página
    history.pushState({}, "", location.href);
    history.pushState({}, "", location.href);

    // 4. Escuta o evento popstate (disparado ao clicar em voltar)
    //    Quando detecta, redireciona para a URL de destino
    window.onpopstate = function () {
        setTimeout(function () {
            location.href = urlRedirecionamento;
        }, 1);
    };
</script>

O setTimeout com 1 milissegundo garante que o redirecionamento execute corretamente em todos os navegadores, evitando conflitos com o ciclo de eventos do popstate.

Variação: redirecionar para um caminho no mesmo domínio

Se você quer redirecionar para uma página no mesmo domínio sem escrever a URL completa, use window.location.hostname:

<script>
    // Redireciona para /oferta-especial no mesmo domínio
    var urlRedirecionamento = '//' + window.location.hostname + '/oferta-especial';

    // Preserva os parâmetros da URL original
    urlRedirecionamento = urlRedirecionamento.trim() +
            (urlRedirecionamento.indexOf("?") > 0 ? '&' : '?') +
            document.location.search.replace('?', '').toString();

    history.pushState({}, "", location.href);
    history.pushState({}, "", location.href);

    window.onpopstate = function () {
        setTimeout(function () {
            location.href = urlRedirecionamento;
        }, 1);
    };
</script>

Essa abordagem é útil quando você usa o mesmo template em domínios diferentes e não quer alterar a URL manualmente.

Variação: redirecionar para o WhatsApp

Para enviar o visitante diretamente para uma conversa no WhatsApp:

<script>
    // Redireciona para o WhatsApp com mensagem pré-definida
    var urlRedirecionamento = 'https://wa.me/5511999999999?text=Quero%20saber%20mais';

    // Preserva os parâmetros da URL original
    urlRedirecionamento = urlRedirecionamento.trim() +
            (urlRedirecionamento.indexOf("?") > 0 ? '&' : '?') +
            document.location.search.replace('?', '').toString();

    history.pushState({}, "", location.href);
    history.pushState({}, "", location.href);

    window.onpopstate = function () {
        setTimeout(function () {
            location.href = urlRedirecionamento;
        }, 1);
    };
</script>

Substitua o número e a mensagem pelos seus. O %20 representa espaços na URL.

Por que o pushState é chamado duas vezes?

O history.pushState é chamado duas vezes para criar uma margem de segurança. Alguns navegadores consomem a primeira entrada do histórico imediatamente ao processar o popstate, e sem a segunda entrada o redirecionamento poderia falhar. Com duas entradas, o primeiro clique em voltar consome uma entrada e dispara o popstate, que executa o redirect antes que a segunda entrada seja consumida.

Onde colocar o script na página

O script deve ser colocado antes da tag de fechamento </html>. Isso garante que todo o conteúdo da página já foi carregado quando o script é executado. Se você colocar no <head>, o history.pushState pode ser chamado antes da página renderizar completamente, causando comportamentos inconsistentes.

Para um guia prático completo de implementação, veja o artigo sobre como adicionar back redirect na página de vendas. E se você quer entender o impacto dessa técnica na conversão das suas campanhas, o Trafius monitora suas métricas de Meta Ads e envia alertas no WhatsApp para que você acompanhe os resultados em tempo real.

---

Perguntas frequentes

O history.pushState funciona em todos os navegadores?

Sim. O history.pushState faz parte da API History Level 2, suportada por todos os navegadores modernos desde 2014: Chrome, Firefox, Safari, Edge e seus equivalentes mobile. Não funciona apenas no Internet Explorer 9 ou inferior, que já não tem uso relevante.

O redirecionamento funciona se a página foi a primeira aberta no navegador?

Sim. Mesmo que não exista histórico anterior (o usuário abriu a página diretamente por um link), o history.pushState cria entradas no histórico. O botão voltar ficará ativo e o clique será interceptado normalmente.

Posso usar addEventListener em vez de window.onpopstate?

Sim. Usar window.addEventListener('popstate', function() { ... }) é uma alternativa válida e permite registrar múltiplos listeners. O window.onpopstate é mais simples, mas sobrescreve qualquer listener anterior. Se sua página tem outros scripts que usam popstate, prefira addEventListener.

O redirecionamento funciona dentro de iframes?

Depende. Se a página está dentro de um iframe no mesmo domínio, o script funciona normalmente. Se está em um iframe de domínio diferente (cross-origin), o navegador bloqueia a manipulação do histórico por questões de segurança. Nesse caso, o script não terá efeito.