Widget de voucher

O widget do voucher apresenta as instruções ou referência geradas para um voucher ou método de pagamento em dinheiro suportado. Ele usa um token de pedido existente; não cria ou paga um segundo pedido.

Ciclo de vida do voucherPerguntar à Athia sobre isto#

Abrir o widgetPerguntar à Athia sobre isto#

await DeunaSDK.initVoucherWidget({
  orderToken,
  language: 'en',
  callbacks: {
    onSuccess: (data) => showVoucherInstructions(data),
    onError: (error) => showRecovery(error),
    onClosed: () => showPaymentMethods(),
    onPaymentProcessing: () => disableDuplicateActions(),
  },
});

await deunaSDK.initVoucherWidget({
  orderToken,
  mode: 'modal',
  language: 'en',
  callbacks: {
    onSuccess: showVoucherInstructions,
    onError: showRecovery,
    onClosed: showPaymentMethods,
    onDownloadFile: ({type, data}) => saveVoucher({type, data}),
  },
});

let callbacks = VoucherCallbacks()
callbacks.onSuccess = { data in showVoucherInstructions(data) }
callbacks.onError = { error in showRecovery(error) }
callbacks.onClosed = { _ in showPaymentMethods() }

deunaSDK.initVoucher(
    orderToken: orderToken,
    callbacks: callbacks,
    language: "en"
)

val callbacks = VoucherCallbacks().apply {
    onSuccess = { data -> showVoucherInstructions(data) }
    onError = { error -> showRecovery(error) }
    onClosed = { showPaymentMethods() }
}

deunaSDK.initVoucherWidget(
    context = this,
    orderToken = orderToken,
    callbacks = callbacks,
    language = "en"
)

ParâmetrosPerguntar à Athia sobre isto#

Conclusão e estado de pagamentoPerguntar à Athia sobre isto#

onSuccess significa que a experiência do voucher completou sua ação do cliente suportada. O pagamento do voucher geralmente ocorre mais tarde, fora do aplicativo. Mantenha o pedido pendente na sua interface até que seu backend observe o estado final por meio de um webhook verificado ou uma recuperação de API.

Recebimentos e entrega de arquivosPerguntar à Athia sobre isto#

A resposta de pagamento de referência pode conter um reference_processors Um array. Cada entrada de processador disponível pode fornecer um código de barras, data de validade, nome do processador e URL de recibo HTML ou PDF hospedado. Como este campo é um array, a experiência de recibo hospedada pode apresentar mais de um recibo quando o pagamento processado retorna múltiplas referências de processadores.

O processador determina quais campos da fatura estão presentes. Não crie uma URL de PDF a partir de um código de barras ou assuma que todos os métodos de referência possuem formatos HTML e PDF.

Para React Native, verifique o discriminador em vez de assumir que o payload é sempre um corpo de arquivo:

import {DownloadType} from '@deuna/react-native-sdk';

const onDownloadFile = async ({type, data}) => {
  if (type === DownloadType.URL) {
    await openTrustedReceiptUrl(data);
    return;
  }

  await saveBase64VoucherImage(data);
};

Valide qualquer URL antes de abri-la ou acessá-la, use HTTPS, mantenha os arquivos baixados em uma localização apropriada e protegida ou selecionada pelo usuário, e não registre o conteúdo da fatura. Um comprovante salvo é evidência para o cliente; não é uma confirmação de pagamento autoritativa.

Mobile e acessibilidadePerguntar à Athia sobre isto#

• Apresente o Voucher a partir de uma tela visível, e não de um callback de background.
• Mantenha as ações de download, copiar e fechar acessíveis em tamanho de texto de 200%.
• Em React Native, solicite apenas a capacidade de armazenamento ou compartilhamento necessária para sua implementação de salvamento.
• Retorne o foco ao controle que abriu o modal e anuncie erros de carregamento através da API de acessibilidade da plataforma.
• Teste a referência com nomes de comerciantes longos, instruções localizadas longas e dispositivos estreitos.

Solução de problemasPerguntar à Athia sobre isto#

Referências relacionadasPerguntar à Athia sobre isto#