Transfersmile PT

# transfersmile JavaScript

Integrar nossa biblioteca JS é uma forma mais segura e conveniente de utilizar nossos serviços

# Adicione o arquivo transfersmile.js ao seu site

TIP

Não é recomendável armazenar estes js localmente

<script src="https://res.transfersmile.com/lib/js/transfersmile.js"></script>
<script>
  transfersmile.setPublishableKey('${app_id}','${public_key}','sandbox | prod')
</script>

# Criar componentes de formulário específicos para transfersmile

Certifique-se de que os seguintes campos existem no formulário existente e acrescente o atributo de verificação de dados de acordo com o formato.

Parâmetro Obrigatório Descrição
transfersmileCardNumber sim número do cartão
transfersmileSecurityCode sim código de segurança
transfersmileCardExpirationYear sim ano de expiração (4 dígitos)
transfersmileCardExpirationMonth sim ano de expiração (2 dígitos)
transfersmileCardholderName sim nome do titular
transfersmileDocType não tipo de identificação do titular
transfersmileDocNumber não número de identificação do titular
<ul>
  <li>
      <label for="cardNumber">Credit card number:</label>
      <input type="text" data-checkout="transfersmileCardNumber" />
  </li>
  <li>
      <label for="securityCode">Security code:</label>
      <input type="text" data-checkout="transfersmileSecurityCode" />
  </li>
  <li>
      <label for="cardExpirationYear">Expiration year:</label>
      <input type="text" data-checkout="transfersmileCardExpirationYear" />
  </li>
  <li>
      <label for="cardExpirationMonth">Expiration month:</label>
      <input type="text" data-checkout="transfersmileCardExpirationMonth" />
  </li>
  <li>
      <label for="cardholderName">Card holder name:</label>
      <input type="text" data-checkout="transfersmileCardholderName" />
  </li>
  <li>
      <label for="docType">Document type:</label>
      <select data-checkout="transfersmileDocType">
      </select>
  </li>
  <li>
      <label for="docNumber">Document number:</label>
      <input type="text" data-checkout="transfersmileDocNumber" />
  </li>
</ul>

E acrescente os dois componentes a seguir ao formulário original.

<!-- token -->
<input name="token" id="transfersmileToken" type="hidden">
<!-- fingerprint -->
<input name="fingerprint" id="transfersmileFingerprint" type="hidden">

# Monitorar eventos de envio de formulários

Chamada anterior ao evento original do site: Função transfersmile.createToken, passe no elemento do formulário e atualize os dois campos ocultos acima.

var $form = document.querySelector('#pay')
transfersmile.createToken($form, responseHandler)

# Traga os dois parâmetros acima e crie um pedido

TIP

O código de exemplo pode ser obtido aqui (clique com o botão direito do mouse -> salvar como)

← transfersmile SDK →