luxtak JavaScript

By integrating our JS library, it is a safer and more convenient way to use our services

Add the luxtak.js file to your website

Tips

It is not recommended to cache this js locally

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

Create luxtak-specific form components

Ensure that the following fields exist in the existing form, and add the data-checkout attribute according to the format.

Parameter	Required	Description
luxtakCardNumber	yes	card number
luxtakSecurityCode	yes	security code
luxtakCardExpirationYear	yes	expiration year (4 digits)
luxtakCardExpirationMonth	yes	expiration month (2 digits)
luxtakCardholderName	yes	holder name
luxtakDocType	no	holder id type
luxtakDocNumber	no	holder id number

<ul>
  <li>
      <label for="cardNumber">Credit card number:</label>
      <input type="text" data-checkout="luxtakCardNumber" />
  </li>
  <li>
      <label for="securityCode">Security code:</label>
      <input type="text" data-checkout="luxtakSecurityCode" />
  </li>
  <li>
      <label for="cardExpirationYear">Expiration year:</label>
      <input type="text" data-checkout="luxtakCardExpirationYear" />
  </li>
  <li>
      <label for="cardExpirationMonth">Expiration month:</label>
      <input type="text" data-checkout="luxtakCardExpirationMonth" />
  </li>
  <li>
      <label for="cardholderName">Card holder name:</label>
      <input type="text" data-checkout="luxtakCardholderName" />
  </li>
  <li>
      <label for="docType">Document type:</label>
      <select data-checkout="luxtakDocType">
      </select>
  </li>
  <li>
      <label for="docNumber">Document number:</label>
      <input type="text" data-checkout="luxtakDocNumber" />
  </li>
</ul>

And add the following two components to the original form.

<!-- token -->
<input name="token" id="luxtakToken" type="hidden">
<!-- fingerprint -->
<input name="fingerprint" id="luxtakFingerprint" type="hidden">

Monitor form submission events

Call before the original website submission event: luxtak.createToken function, pass in the form element and update the above two hidden fields.

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

Bring the above two parameters and place an order

Tips

The example code can be obtained from here (right click -> save as)