Y Yuupe Pay API v1Painel
Pagamentos

pay.js

A biblioteca do navegador: gera o token do cartão e abre a confirmação do banco. O número do cartão nunca passa pelo seu servidor nem pela Yuupe.

Instalação

HTML
<script src="https://yuupe.me/pay.js"></script>

Carregue sempre do endereço da Yuupe (não copie o arquivo): correções de segurança chegam sozinhas. O script cria o objeto global YuupePay.

YuupePay.tokenizarCartao

JavaScript
const { token_cartao, dispositivo } = await YuupePay.tokenizarCartao({
  chavePublica,              // do GET /checkout-config (seu servidor)
  ambiente,                  // "sandbox" ou "producao", idem
  numero: '5555 5555 5555 5557',
  nomeTitular: 'MARIA SOUZA',
  validade: '12/30',         // MM/AA ou MM/AAAA
  cvv: '123',
  documento: '52998224725',  // CPF/CNPJ do titular
})
// envie token_cartao e dispositivo ao seu servidor → POST /pedidos
CampoDescrição
chavePublicaobrigatório
string
Vem do checkout-config. Não é segredo.
ambienteobrigatório
"sandbox" | "producao"
Vem do checkout-config.
numeroobrigatório
string
Com ou sem espaços. O pay.js confere os dígitos e a bandeira antes de enviar.
nomeTitularobrigatório
string
Como impresso no cartão.
validadeobrigatório
string
MM/AA ou MM/AAAA.
cvvobrigatório
string
3 ou 4 dígitos.
documento
string
CPF/CNPJ do titular, recomendado.

Devolve { token_cartao, bandeira, ultimos4, expira_em, dispositivo }. O token vale 5 minutos e serve para uma cobrança. dispositivo são os dados do navegador que o banco exige para o 3DS (tela, idioma, fuso): repasse como veio.

Bandeiras: Visa, Mastercard, Elo, American Express, Hipercard e Diners.

YuupePay.autenticar

Recebe o objeto autenticacao de um pedido aguardando_autenticacao, como veio. Faz, nesta ordem: a coleta dos dados do dispositivo para o banco (iframe invisível, 1 a 3 segundos); a continuação na Yuupe; e, se o banco pedir, a janela de confirmação sobre a página. Resolve com { pedido_id, status } depois da cobrança; o status final é sempre confirmado pelo seu servidor. Veja Confirmação do banco.

Erros do pay.js

As funções rejeitam com um Error que traz e.codigo e, quando é um campo, e.campo:

e.codigoQuandoO que mostrar
cartao_invalidoNúmero, validade, CVV, titular ou bandeira inválidos (e.campo diz qual)Marque o campo e peça para conferir
cartao_recusado_na_validacaoA operadora não aceitou os dados do cartão ao gerar o token“Não foi possível validar o cartão. Confira os dados ou use outro cartão.”
requisicao_invalidaFaltou chavePublica, ambiente ou autenticacaoErro de integração: registre no log
autenticacao_canceladaO comprador fechou a janela do banco“A confirmação foi cancelada. Tente de novo.”
autenticacao_expiradaPassaram 5 minutos“O tempo acabou. Tente de novo.”

Content-Security-Policy

Se o seu site usa CSP, libere script-src https://yuupe.me, connect-src https://yuupe.me https://app.vindi.com.br https://sandbox-app.vindi.com.br (o token vai direto para a operadora) e frame-src https: (a coleta do dispositivo e a janela do banco, em *.cardinalcommerce.com e no domínio do banco emissor).