Status Payment

Para monitorar os pagamentos, você pode usar uma das soluções de status de monitoramento fornecidas pela Yuno. Você pode usar uma das duas opções:

  • Status: Você pode usar o SDK de status para atualizar o usuário sobre o processo de pagamento. Ele fornece informações visuais para os clientes.
  • Status Lite: você pode usar o Lite SDK do Status Lite SDK para obter informações sobre o status atual do pagamento. No entanto, o Status Lite não monta nenhum elemento.

Ambas as soluções initialize da mesma forma. Depois de adicionar o Yuno SDK ao seu sistema e criar uma instância, consulte a solução de status desejado para saber como usá-la.

Etapa 1: Inclua a biblioteca em seu projeto.

Certifique-se de que o arquivo Yuno SDK esteja incluído em sua página da Web antes de fechar o arquivo <body> tag. Veja o exemplo abaixo:

<script src="https://sdk-web.y.uno/v1.5/main.js"></script>

Etapa 2: Initialize o SDK com a chave pública

Em seu aplicativo JavaScript, crie uma instância do Yuno fornecendo uma classe PUBLIC_API_KEY. Veja o Obtenha suas credenciais de API guia.

Como no exemplo abaixo, use a classe inicializada que é atribuída à classe yuno constante:

<script src="https://sdk-web.y.uno/v1.5/main.js"></script>

Depois de criar a instância, escolha entre usar as soluções Status ou Status Lite para acessar o status do pagamento.

Etapa 3: Usar o status

Para usar o Status, você precisa montá-lo. Use o mountStatusPayment para definir a função checkoutSession relacionado ao pagamento, o countryCode, o languagee o retorno de chamada yunoPaymentResult.

O retorno de chamada será executado quando o status for recebido, informando o usuário. Definir o elemento para montar o Status é desnecessário, pois ele cobrirá toda a tela. O bloco de código a seguir mostra um exemplo da configuração do parâmetro:

yuno.mountStatusPayment({
  checkoutSession: '438413b7-4921-41e4-b8f3-28a5a0141638',
  countryCode: 'FR',
  language: 'fr',
  yunoPaymentResult(data) {
    console.log('yunoPaymentResult', data)
  }
})

Parâmetros

ParâmetroDescrição
checkoutSessionO ID da sessão de checkout para o pagamento que você deseja monitorar
countryCodeO código do país para o processo de pagamento. Consulte Cobertura de países para saber quais são os países compatíveis
languageIdioma para a exibição do status. Opções compatíveis: en, fr, jp
yunoPaymentResultFunção de retorno de chamada que recebe o status do pagamento. O parâmetro de dados pode ser:READY_TO_PAY',CREATED',SUCCEEDED',REJECTED',CANCELLED',ERROR',DECLINED',PENDING',EXPIRED',VERIFIED',REFUNDED'

Use o Status Lite

Para receber o status de pagamento atual usando o Status Lite, você precisa chamar o método yunoPaymentResult fornecendo o checkoutSession relacionados ao pagamento, conforme mostrado no exemplo abaixo:

const status = await yunoyunoPaymentResultcheckoutSession)

O yunoPaymentResult retorna o status atual do pagamento sem renderizar nenhum elemento da interface do usuário. O status retornado pode ser um dos seguintes valores:

  • READY_TO_PAY
  • CREATED
  • SUCCEEDED
  • REJECTED
  • CANCELLED
  • ERROR
  • DECLINED
  • PENDING
  • EXPIRED
  • VERIFIED
  • REFUNDED
👍

Integração de status de pagamento personalizado

Se preferir usar sua própria página personalizada de status de pagamento em vez de personalizar a página fornecida pelo nosso SDK, você pode fazer isso editando o arquivo HTML para se conectar a uma página status-lite.js script. Isso permite que você personalize totalmente a aparência e o comportamento da exibição do status do pagamento, sem deixar de usar a funcionalidade de status do Yuno. Por exemplo, depois de chamar o script yunoPaymentResult você pode tratar o resultado do status em sua própria versão da função status-lite.js que, em seguida, atualizará seu arquivo HTML personalizado.

Mantenha-se atualizado

Acesse o changelog para obter as atualizações mais recentes do SDK e o histórico de versões.