Платежный виджет v7 (7.1.0)

Платежный виджет — всплывающая форма на сайте Партнера без перенаправления на сервер Системы для ввода реквизитов карты Клиента. Для ее использования на сервере Партнера необходимо провести ряд действий описанных ниже.

Установка

Script

<script src="https://proxyd.tarlanpayments.kz/tarlan/widget/v7/7.1.0/widget.js"></script>

Npm

npm install @tarlanpayments/widget@latest

Yarn

yarn add @tarlanpayments/widget@latest

Использование

Платежный виджет состоит из двух главных функций - checkout и genIframe.

checkout - отправляет запрос на получение ссылки платежной формы и возвращает ее. Работает со всеми формами.

genIframe - создает модальное окно с iframe платежной формы. Работает только с классической формой.

genIframe

<button id="make-payment">Pay</button>

Тестовый вызов `checkout`

Внимание

Не используйте параметр hashSecretKey: true в production, так как это небезопасно! Для production вам нужно хэшировать secretKey с referenceId как описано в "боевых" примерах.

Script
Npm, yarn

// Данные тестовые, но позволяют получить ссылку на платежную форму

function generateForm() {
    var checkout = window.TarlanPayments.checkout;

    checkout(
        {
            reference_id: Date.now(), // номер заказа
            request_url: 'https://tarlanpayments.kz', // адрес для перенаправления после платежа
            back_url: 'https://dev.api.tarlanpayments.kz/check.php', // адрес для отправки коллбека
            description: 'оплата заказа', // описание платежа
            amount: 100, // сумма заказа
            merchant_id: 1, // номер мерчанта
            is_test: 1, // опция для тестовой оплаты (1 - тестовая оплата, 0 - боевая оплата)
            secret_key: '123456', // ключ выданный для мерчанта
            hashSecretKey: true
        },
        {
            successCb: function (data) {
                console.log(data);
            },
            failureCb: function (err) {
                console.log(err);
            }
        }
    );
}

document.getElementById('make-payment').addEventListener('click', generateForm);

// Данные тестовые, но позволяют получить ссылку на платежную форму

import { checkout } from '@tarlanpayments/widget';

const generateForm = () => {
    checkout(
        {
            reference_id: Date.now(), // номер заказа
            request_url: 'https://tarlanpayments.kz', // адрес для перенаправления после платежа
            back_url: 'https://dev.api.tarlanpayments.kz/check.php', // адрес для отправки коллбека
            description: 'оплата заказа', // описание платежа
            amount: 100, // сумма заказа
            merchant_id: 1, // номер мерчанта
            is_test: 1, // опция для тестовой оплаты (1 - тестовая оплата, 0 - боевая оплата)
            secret_key: '123456', // ключ выданный для мерчанта
            hashSecretKey: true
        },
        {
            successCb: function (data) {
                console.log(data);
            },
            failureCb: function (err) {
                console.log(err);
            }
        }
    );
}

...Вызов 

Боевой вызов `checkout`

Поле secret_key необходимо формировать конкатенацией параметров: reference_id + секретный ключ (Ваш ID заказа и секретный ключ в вашем личном кабинете). Полученный результат необходимо обернуть в bcrypt, где модификатор входа хэш-функции (соль/round) равен 10.

Script
Npm, yarn

function generateForm() {
    var checkout = window.TarlanPayments.checkout;

    checkout(
        {
            reference_id: ваше любое значение, // номер заказа
            request_url: 'https://site', // адрес для перенаправления после платежа
            back_url: ваш callback url, либо 'https://dev.api.tarlanpayments.kz/check.php', // адрес для отправки коллбека
            description: 'оплата заказа', // описание платежа
            amount: 100, // сумма заказа
            merchant_id: ваш номер мерчанта, // номер мерчанта
            is_test: 0, // опция для тестовой оплаты (1 - тестовая оплата, 0 - боевая оплата)
            secret_key: значение составленное из reference_id и выданным secret_key, 
            /* Поле secret_key необходимо  формировать конкатенацией параметров: reference_id + секретный ключ(Ваш ID заказа и   секретный ключ в вашем личном кабинете). Полученный результат необходимо обернуть в bcrypt, где модификатор входа хэш-функции (соль/round) равен 10. */            
        },
        {
            successCb: function (data) {
                console.log(data);
            },
            failureCb: function (err) {
                console.log(err);
            }
        }
    );
}

document.getElementById('make-payment').addEventListener('click', generateForm);

import { checkout } from '@tarlanpayments/widget';

const generateForm = () => {    
    checkout(
        {
            reference_id: ваше любое значение, // номер заказа
            request_url: 'https://site', // адрес для перенаправления после платежа
            back_url: ваш callback url, либо 'https://dev.api.tarlanpayments.kz/check.php', // адрес для отправки коллбека
            description: 'оплата заказа', // описание платежа
            amount: 100, // сумма заказа
            merchant_id: ваш номер мерчанта, // номер мерчанта
            is_test: 0, // опция для тестовой оплаты (1 - тестовая оплата, 0 - боевая оплата)
            secret_key: значение составленное из reference_id и выданным secret_key, 
            /* Поле secret_key необходимо  формировать конкатенацией параметров: reference_id + секретный ключ(Ваш ID заказа и   секретный ключ в вашем личном кабинете). Полученный результат необходимо обернуть в bcrypt, где модификатор входа хэш-функции (соль/round) равен 10. */            
        },
        {
            successCb: function (data) {
                console.log(data);
            },
            failureCb: function (err) {
                console.log(err);
            }
        }
    );
}

...Вызов 

Тестовый вызов `genIframe`

Внимание

Script
Npm, yarn

// Данные тестовые, но позволяют получить ссылку на платежную форму

function generateForm() {
    var genIframe = window.TarlanPayments.genIframe;

    genIframe(
        {
            reference_id: Date.now(), // номер заказа
            request_url: 'https://tarlanpayments.kz', // адрес для перенаправления после платежа
            back_url: 'https://dev.api.tarlanpayments.kz/check.php', // адрес для отправки коллбека
            description: 'оплата заказа', // описание платежа
            amount: 100, // сумма заказа
            merchant_id: 1, // номер мерчанта
            is_test: 1, // опция для тестовой оплаты (1 - тестовая оплата, 0 - боевая оплата)
            secret_key: '123456', // ключ выданный для мерчанта
            hashSecretKey: true
        },
        {            
            failureCb: function (err) {
                console.log(err);
            },
            onClose: function () {
                console.log('on close');
            }
        }
    );
}

document.getElementById('make-payment').addEventListener('click', generateForm);

// Данные тестовые, но позволяют получить ссылку на платежную форму

import { genIframe } from '@tarlanpayments/widget';

const generateForm = () => {    
    genIframe(
        {
            reference_id: Date.now(), // номер заказа
            request_url: 'https://tarlanpayments.kz', // адрес для перенаправления после платежа
            back_url: 'https://dev.api.tarlanpayments.kz/check.php', // адрес для отправки коллбека
            description: 'оплата заказа', // описание платежа
            amount: 100, // сумма заказа
            merchant_id: 1, // номер мерчанта
            is_test: 1, // опция для тестовой оплаты (1 - тестовая оплата, 0 - боевая оплата)
            secret_key: '123456', // ключ выданный для мерчанта
            hashSecretKey: true
        },
        {            
            failureCb: function (err) {
                console.log(err);
            },
            onClose: function () {
                console.log('on close');
            }
        }
    );
}

...Вызов

Боевой вызов `genIframe`

Script
Npm, yarn

// Данные тестовые, но позволяют получить ссылку на платежную форму

function generateForm() {
    var genIframe = window.TarlanPayments.genIframe;

    genIframe(
        {
            reference_id: ваше любое значение, // номер заказа
            request_url: 'https://site', // адрес для перенаправления после платежа
            back_url: ваш callback url, либо 'https://dev.api.tarlanpayments.kz/check.php', // адрес для отправки коллбека
            description: 'оплата заказа', // описание платежа
            amount: 100, // сумма заказа
            merchant_id: ваш номер мерчанта, // номер мерчанта
            is_test: 0, // опция для тестовой оплаты (1 - тестовая оплата, 0 - боевая оплата)
            secret_key: значение составленное из reference_id и выданным secret_key, 
            /* Поле secret_key необходимо  формировать конкатенацией параметров: reference_id + секретный ключ(Ваш ID заказа и   секретный ключ в вашем личном кабинете). Полученный результат необходимо обернуть в bcrypt, где модификатор входа хэш-функции (соль/round) равен 10. */      
        },
        {            
            failureCb: function (err) {
                console.log(err);
            },
            onClose: function () {
                console.log('on close');
            }
        }
    );
}

document.getElementById('make-payment').addEventListener('click', generateForm);

// Данные тестовые, но позволяют получить ссылку на платежную форму

import { genIframe } from '@tarlanpayments/widget';

const generateForm = () => {    
    genIframe(
        {
            reference_id: ваше любое значение, // номер заказа
            request_url: 'https://site', // адрес для перенаправления после платежа
            back_url: ваш callback url, либо 'https://dev.api.tarlanpayments.kz/check.php', // адрес для отправки коллбека
            description: 'оплата заказа', // описание платежа
            amount: 100, // сумма заказа
            merchant_id: ваш номер мерчанта, // номер мерчанта
            is_test: 0, // опция для тестовой оплаты (1 - тестовая оплата, 0 - боевая оплата)
            secret_key: значение составленное из reference_id и выданным secret_key, 
            /* Поле secret_key необходимо  формировать конкатенацией параметров: reference_id + секретный ключ(Ваш ID заказа и   секретный ключ в вашем личном кабинете). Полученный результат необходимо обернуть в bcrypt, где модификатор входа хэш-функции (соль/round) равен 10. */      
        },
        {            
            failureCb: function (err) {
                console.log(err);
            },
            onClose: function () {
                console.log('on close');
            }
        }
    );
}

...Вызов

Api

`checkout(params, callbacks)`

type Checkout = (
    params: WidgetParams,
    settings: {
        successCb?: (data: GetResponseFromApiReturnValues) => void;
        failureCb?: (err: unknown) => void;
    }
) => void;

1 параметр checkout = Основные параметры + Доп параметры
2 параметр checkout = Коллбэки successCb, failureCb

`genIframe(params, callbacks)`

type GenIframe = (
    params: WidgetParams,
    settings: {
        failureCb?: (err: unknown) => void;        
        onClose?: () => void;
    }
) => void;

1 параметр checkout = Основные параметры + Доп параметры
2 параметр checkout = Коллбэки failureCb, onClose

Основные параметры

Название	Тип	Описание	Обязательность
reference_id	String	Номер заказа на стороне мерчанта	Да
request_url	String	Абсолютная ссылка на сайт мерчанта для перенаправления пользователя.	Да
back_url	String	Абсолютная ссылка на сайт мерчанта для отправки статуса платежа. Детальное описание запроса ниже.	Да
description	String	Описание платежа	Да
amount	Integer	Сумма заказа	Да
merchant_id	Integer	ID мерчанта	Да
user_id	Integer	ID пользователя	Нет
secret_key	String	Поле secret_key необходимо формировать конкатенацией параметров: reference_id + секретный ключ (Ваш ID заказа и секретный ключ в вашем личном кабинете). Полученный результат необходимо обернуть в bcrypt, где модификатор входа хэш-функции (соль/round) равен 10.	Да
is_test	Boolean	Тестовый платеж	Нет
user_email	String	Email пользователя	Нет

Дополнительные параметры

Название	Тип	Описание	Обязательность
hashSecretKey	Boolean	Полезен для тестов, дефолтное значение - `false` `true` - хэширование происходит на стороне виджета, в secret_key нужно будет указать только secret_key `false` - хэширование происходит на стороне мерчанта	Нет
type	"payin" \| "payout" \| "card-linking"	Тип платежа, дефолтное значение - `payin` `payin` - Прием `payout` - Выплата `card-linking` - Привязка карты	Нет
form	"classic" \| "composed-cards" \| "modern"	Вид формы, дефолтное значение - `classic`	Нет
isDev	Boolean	Переключение запроса на дев или продакшн сервер, дефолтное значение - `false`	Нет

Платежный виджет v7 (7.1.0)

Установка​

Script​

Npm​

Yarn​

Использование​

Тестовый вызов checkout​

Внимание

Боевой вызов checkout​

Тестовый вызов genIframe​

Внимание

Боевой вызов genIframe​

Api​

checkout(params, callbacks)​

genIframe(params, callbacks)​

Основные параметры​

Дополнительные параметры​

Установка

Script

Npm

Yarn

Использование

Тестовый вызов `checkout`

Боевой вызов `checkout`

Тестовый вызов `genIframe`

Боевой вызов `genIframe`

Api

`checkout(params, callbacks)`

`genIframe(params, callbacks)`

Основные параметры

Дополнительные параметры