Introdução
Integre Viva.com Smart Checkout para permitir que os clientes façam pagamentos seguros por meio de uma página de checkout hospedada. Este guia orienta você pelas etapas para uma integração perfeita em seu site ou aplicativo.
➤ Obtenha sua conta Viva.com, se ainda não tiver uma
Viva.com suporta dois ambientes diferentes, certifique-se de usar o correto:
Ambiente | Descrição | URL de registro | URL do painel |
Produção | Para fazer pagamentos no mundo real | ||
Demo | Para realizar pagamentos de teste e outros fins de teste |
➤ Obtenha sua fonte de pagamento online e mantenha seu código-fonte
Uma fonte de pagamento é uma entidade de configuração que permite que os comerciantes definam e gerenciem as configurações de integração de pagamento para seus sites ou aplicativos móveis.
Configure seu domínio e os URLs para os quais o Viva.com Smart Checkout redirecionará os clientes após a conclusão do pagamento. Esses URLs geralmente levam a páginas como "Obrigado pelo seu pedido" para pagamentos bem-sucedidos ou "Algo deu errado com seu pagamento" para transações com falha, permitindo que os clientes continuem sua jornada sem problemas em seu site ou aplicativo.
Crie uma fonte de pagamento para pagamentos online, navegando até Vendas > Pagamentos Online > Websites / Aplicações no painel de controle Viva.com.
Certifique-se de salvar o código-fonte de 4 dígitos da fonte de pagamento que você acabou de criar, pois você precisará dele posteriormente para fins de integração e configuração.
Exemplo de configuração da fonte de pagamento com o código-fonte 2330
Confira aqui um guia detalhado sobre como criar uma Fonte para pagamentos online
➤ Guia de integração passo a passo
Principais etapas para integrar
Criar a ordem de pagamento
Redirecionar para Checkout inteligente
Lidar com a devolução do cliente e verificar o resultado do pagamento
➥ Etapa 1: criar a ordem de pagamento |
Para solicitar um pagamento de um de seus clientes, você precisa criar uma ordem de pagamento. Cada ordem de pagamento recebe um ID exclusivo de 16 dígitos, também conhecido como orderCode.
Você pode gerar a ordem de pagamento usando a API Create Payment Order no seu servidor e passar o orderCode para seu site ou aplicativo.
Para obter mais detalhes sobre como configurar uma ordem de pagamento, consulte nosso guia detalhado em nosso portal do desenvolvedor aqui e aqui.
➥ Etapa 2: redirecionar o cliente para o Smart Checkout |
Quando redirecionados, os clientes verão o formulário Smart Checkout para inserir seus detalhes de pagamento e concluir a transação.
➤ Opções adicionais para o Smart Checkout
Opções de fonte de pagamento
Exiba o logotipo da sua marca
Você pode incluir o logotipo da sua marca para ser exibido no Smart Checkout configurando-o nas configurações da Fonte de pagamento. Há um guia detalhado em nosso portal do desenvolvedor aqui.
Adicionar seu logotipo melhora a experiência do cliente, reforçando a identidade da sua marca durante o processo de pagamento. Certifique-se de fazer upload de um logotipo claro e de tamanho apropriado para uma exibição ideal.
➤ Exibir um botão de cancelamento
Fornecer um botão Cancelar oferece flexibilidade para seus clientes e ajuda a melhorar a experiência geral do usuário.
Você pode configurar um botão Cancelar no Smart Checkout para fornecer aos clientes a opção de cancelar seus pedidos. Isso é gerenciado no nível da fonte de pagamento (em Configuração avançada), dando a você controle se o botão Cancelar está disponível para pedidos associados a uma fonte específica.
Plataformas suportadas: Atualmente, o botão Cancelar é compatível com integrações diretas do Smart Checkout e plug-ins para Shopify e PrestaShop.
Suporte a webhooks: você pode configurar webhooks para receber notificações de eventos de cancelamento de pedidos. Siga este guia de configuração do webhook para obter mais informações
➥ Etapa 3: lidar com a devolução do cliente e verificar o resultado do pagamento |
Lidar com a devolução do cliente
Após o pagamento, os clientes são redirecionados para:
URL de sucesso para pagamentos bem-sucedidos.
URL de falha para pagamentos com falha.
Você pode definir essas configurações por meio do Painel da Conta do Viva.com em Vendas > Pagamentos Online > Websites / Aplicações
Verificar o resultado do pagamento
A verificação garante que a transação seja concluída com sucesso. Para validar o status de uma transação em seu sistema, verifique os seguintes parâmetros: Amount, transactionId, statusId
(Exibir todos os códigos StatusId)
➤ Métodos de verificação de pagamento recomendados:
Webhooks:
Receba atualizações em tempo real sobre o sucesso ou falha do pagamento.
Consulte nossa documentação de webhooks Transaction Payment Created e Transaction Failed para obter mais detalhes sobre implementação, cargas de amostra e explicação de todos os parâmetros.
Abrange métodos de pagamento síncronos e assíncronos.
Recuperar API de transação:
Para obter mais detalhes sobre a chamada de API e seus parâmetros, consulte a documentação Recuperar API de transação em nosso portal do desenvolvedor
➤ Configuração adicional
Com Viva.com Smart Checkout, preparamos muitos recursos e ferramentas que você pode usar e oferecer aos seus clientes mais opções para seus pagamentos.
Pagamentos recorrentes: um método de pagamento em que o comerciante (você) inicia cobranças automaticamente em um cronograma predefinido sem envolver o cliente após o primeiro pagamento.
Pré-autorizações: Um método de pagamento usado para verificar a disponibilidade de fundos e reservar o valor, com a transferência real de fundos iniciada posteriormente.
Você pode encontrar guias detalhados em nosso portal do desenvolvedor para prosseguir com todas as configurações que você pode fazer através de sua conta para aceitar pagamentos online, bem como explorar todas as alternativas e serviços que oferecemos.