Skip to content

Tokenizer

Tokenizer.js — библиотека, которая позволяет создать токен платежного средства с целью безопасного хранения и получения реквизитов для оплаты инвойса.

Сценарий, в котором используется Tokenizer.js описан в данном разделе.

Руководство по использованию

  • Подключите Tokenizer.js на свою страницу оплаты.
<script src="https://checkout.xpay.by/static/tokenizer.js"></script>
<script type="text/javascript">
    Tokenizer.setAccessToken('<access_token>');
</script>
  • Передайте Tokenizer.js полученные от покупателя реквизиты банковской карты. Примите токен в ответ.
<script type="text/javascript">
    Tokenizer.card.createToken({
        paymentToolType: 'CardData',
        cardHolder: '<card holder>',
        cardNumber: '<card number>',
        expDate: '<exp date>',
        cvv: '<cvv>'
    }, (token) => {
        console.log(token); // { token: 'string', session: 'string' }
        }, (error) => {
        console.error(error); // { code: 'string', message: 'string' }
        });
</script>

Пример взаимодействия платежной формы с библиотекой

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Tokenization sample</title>
    <script src="https://code.jquery.com/jquery-3.1.0.slim.min.js" integrity="sha256-cRpWjoSOw5KcyIOaZNo4i6fZ9tKPhYYb6i5T9RSVJG8=" crossorigin="anonymous"></script>
    <script src="https://xpay.st/tokenizer.js"></script>
    <script>
        $(function () {
            $('#pay-button').click(function () {
                Tokenizer.setAccessToken('<access_token>');
                Tokenizer.card.createToken({
                    paymentToolType: "CardData",
                    cardHolder: $('#card-holder').val(),
                    cardNumber: $('#card-number').val(),
                    expDate: $('#exp-date').val(),
                    cvv: $('#cvv').val()
                }, (token) => {
                    console.log(token); // { token: 'string', session: 'string' }
                }, (error) => {
                    console.error(error); // { code: 'string', message: 'string' }
                });
            });
        });
    </script>
</head>
<body>
    <form>
        <input id="card-holder" placeholder="card holder">
        <input id="card-number" placeholder="card number">
        <input id="exp-date" placeholder="exp date">
        <input id="cvv" placeholder="cvv">
        <button id="pay-button" type="button">Pay</button>
    </form>
</body>