Ir para conteúdo principal

Guia de integração do Smart Checkout

O Viva.com Smart Checkout permite-lhe aceitar pagamentos online através de uma página de pagamento alojada.

Este guia explica os principais passos para integrar o Smart Checkout no seu website ou aplicação, desde a configuração da sua conta Viva.com e da fonte de pagamento até ao redirecionamento dos clientes e à verificação do resultado do pagamento.

1. Escolha o seu ambiente Viva.com

A Viva.com disponibiliza dois ambientes. Certifique-se de que utiliza o ambiente adequado ao que pretende fazer.

Ambiente

Utilize-o para

Primeiros passos

Produção

Aceitar pagamentos reais

Demo

Testar a sua integração e efetuar pagamentos de teste

Certifique-se de que está a trabalhar no ambiente correto ao configurar e testar a sua integração.


2. Crie uma fonte de pagamento para pagamentos online

Uma fonte de pagamento contém as definições que a Viva.com utiliza para os pagamentos efetuados através do seu website ou aplicação.

Ao configurar a sua fonte de pagamento, configure o seu domínio e os URLs para os quais os clientes devem regressar após concluírem o processo de pagamento.

Por exemplo:

  • uma página de sucesso, como «Obrigado pela sua encomenda»

  • uma página de falha, como «Ocorreu um problema com o seu pagamento»

Para criar uma fonte de pagamento para pagamentos online, aceda a Vendas > Pagamentos Online no seu Painel de Controlo Viva.com.

Depois de criar a fonte de pagamento, guarde o respetivo código de fonte de 4 dígitos. Irá precisar deste código ao configurar a sua integração.

Exemplo de configuração de origem de pagamento com código de origem WC-0002

Para obter instruções detalhadas de configuração, consulte Fonte para pagamentos online | Suporte Viva.com.


3. Integre o Smart Checkout

Existem três passos principais para integrar o Smart Checkout:

Passo 1: Crie uma ordem de pagamento

Antes de solicitar um pagamento a um cliente, crie uma ordem de pagamento.

A cada ordem de pagamento é atribuído um ID único de 16 dígitos, denominado orderCode.

Crie a ordem de pagamento a partir do seu servidor utilizando a Create Payment Order API e, em seguida, transmita o orderCode ao seu website ou aplicação.

Para consultar os parâmetros da API e os detalhes de implementação, visite o Viva.com Developer Portal. No menu do lado esquerdo, selecione APIs for payments e, em seguida, Payment API. Em Payments, selecione Create payment order.

Passo 2: Redirecione o cliente para o Smart Checkout

Depois de criar a ordem de pagamento, redirecione o cliente para o Smart Checkout. O cliente poderá então introduzir os seus dados de pagamento e concluir o processo de pagamento na página do Smart Checkout.

Passo 3: Processe o regresso do cliente e verifique o resultado do pagamento

Após o processo de pagamento, o cliente é redirecionado para o URL configurado para o resultado correspondente:

  • Success URL para pagamentos bem-sucedidos

  • Failure URL para pagamentos sem sucesso

Pode configurar estes URLs no seu Painel de Controlo Viva.com em Vendas > Pagamentos Online > Websites / Aplicações.

Verifique o resultado do pagamento

Verifique o estado da transação no seu sistema utilizando as informações de pagamento devolvidas pela Viva.com. As informações da transação utilizadas para validação incluem:

  • Amount

  • transactionId

  • statusId

A Viva.com disponibiliza os seguintes métodos para verificar o resultado do pagamento.

Webhooks

Os Webhooks permitem que o seu sistema receba notificações sobre o sucesso ou a falha de pagamentos e suportam métodos de pagamento síncronos e assíncronos.

Para obter detalhes de implementação, parâmetros de eventos e exemplos de payloads, visite o Viva.com Developer Portal e selecione Webhooks For Payments no menu.

Retrieve Transaction API

Também pode obter informações sobre uma transação utilizando a Retrieve Transaction API. Para consultar os parâmetros da API e os detalhes de implementação, visite o Viva.com Developer Portal. No menu do lado esquerdo, selecione APIs for payments e, em seguida, Payment API. Em Transactions, selecione Retrieve transaction.


Definições opcionais do Smart Checkout

Também pode configurar definições adicionais do Smart Checkout de acordo com as necessidades da sua integração.

Apresente o logótipo da sua marca

Pode adicionar o logótipo da sua marca ao Smart Checkout através das definições da fonte de pagamento. Para obter instruções, visite o Viva.com Developer Portal, aceda a Tutorials, selecione Smart Checkout Configuration e, em seguida, clique em Add your brand logo.

Certifique-se de que carrega um logótipo nítido e com um tamanho adequado para garantir uma apresentação ideal.

Apresente um botão Cancel

Pode configurar um botão Cancel nas definições de configuração avançada da fonte de pagamento. Isto permite que os clientes cancelem a sua encomenda.

O botão Cancel é suportado em integrações diretas do Smart Checkout e em plugins para Shopify e PrestaShop.

Também pode configurar webhooks para receber notificações sobre eventos de cancelamento de encomendas. Visite o Viva.com Developer Portal, selecione Webhooks For Payments e, em seguida, Order Updated para obter mais informações.


Opções de pagamento adicionais

O Smart Checkout também suporta configurações de pagamento adicionais, incluindo:

  • Pagamentos recorrentes: O comerciante inicia automaticamente cobranças de acordo com um calendário predefinido após o primeiro pagamento.

  • Pré-autorizações: É reservado um montante, sendo a transferência dos fundos iniciada posteriormente.

Para obter detalhes técnicos de implementação e consultar outras configurações disponíveis do Smart Checkout, visite o Viva.com developer portal.

Ainda precisa de ajuda? A nossa equipa está disponível para o ajudar. Contacte-nos através da opção Fale connosco na sua conta Viva.com.

Isto respondeu à sua pergunta?