Подготовка к запуску Быстрого Пополнения Счета (БПС)

Возможны несколько сценариев использования БПС:

На глобальном сервере с эквайрингом и фискализацией Лайма
На глобальном сервере с эквайрингом и фискализацией заказчика
На локальном сервере

В любом случае для работы БПС требуется использование постоянных карт клиентов с преднапечатанными номерами тождественными внутреннему идентификатору карты!

Подготовительных работ от заказчика не требуется.

ЮKassa ограничила использование iframe для отображения страницы оплаты по соображениям безопасности.

Заключить договор с ЮКассой/Сбербанком/Тинькофф (важно: для получения доступа к ЛК Тинькофф требуется написать им заявку) на интернет эквайринг, предоставить ключи доступа.
Ссылка на сайт Юкассы https://yookassa.ru/connection/
Зарегистрировать онлайн-фискальник АТОЛ : https://atol.online/ (или иной, поддерживаемый выбранным интернет эквайером) и подключить его в личном кабинете эквайера, либо передать нам данные для доступа в личный кабинет эквайера и хостинга онлайн фискальника
Подготовить на своем сайте страницу с данными, отвечающими требованиям эквайера, политикой конфиденциальности и правилами использования приложения, и предоставить ссылку на данную страницу (Пример):

В правилах возврата указать что все возвраты осуществляются только на кассах!
1. Сбербанк: https://3dsec.sberbank.ru/techportal/doku.php/merchant_website_guidelines (раздел 8. На сайте интернет-магазина обязательно должны быть размещены:)
2. Тинькофф: https://help.tinkoff.ru/internet-acquiring/requirements/info/ (по сути аналогично сбербанку)
3. ЮКасса: аналогично Сбербанку.

Обеспечить белый ip-адрес, доступ до сервера по TCP портам 80 и 443, доменное имя, настроенный SSL и https (доменное имя и настройка SSL/HTTPS могут быть предоставлены Лаймом)
1. В случае использования эквайринга и фискализации Лайма дополнительных подготовительных работ не требуется
2. В случае использования эквайринга и фискализации заказчика см раздел выше.

Для автоматического перенаправления на виджет с сайта лайма в параметре Шаблон URL редиректа указать значение https://widget.lime-it.ru/?integrationId={0}&card={1}

При использовании локального сервера виджет следует размещать так же на локальном сервере, адрес виджета будет соответствовать адресу локального сервера, например https://widget.vdnh.lime-it.ru

Ниже приведен пример встройки, для тестового виджета с тестовыми реквизитами! В комментариях к скрипту указано какие параметры следует заменить при встройке боевого виджета

Встройка осуществляется через iframe силами заказчика (подрядчика, выполняющего обслуживание сайта заказчика), ниже приведен пример встройки в статическую html страницу

ЮKassa ограничила использование iframe для отображения страницы оплаты по соображениям безопасности.

widget.html

<!DOCTYPE html>
 
<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="utf-8" />
    <title></title>
    <script>
	// защита от повторной загрузки фрейма
	// если есть возможность использовать <body onload="setWidgetAddress()"> то лучше использовать его
	// если нет, то <iframe id="wigetFrame" onload="setWidgetAddress()">
	let g_widgetAddressApplied = false;
 
	// Установка адреса виджета
	function setWidgetAddress() {
		if (g_widgetAddressApplied)
            	return;
 
		g_widgetAddressApplied = true;
 
		// Разбор параметров URL для получения кода карты
		const urlParams = new URLSearchParams(window.location.search);
		const cardCode = urlParams.has('card') ? urlParams.get('card') : urlParams.get('uid');
 
		// Для загрузки виджета нужны 2 параметра:
		//   * адрес хоста виджета - ниже по коду widgetAddress 
		//   * идентификатор интеграции со стороны лайма - ниже по коду integrationId
 
		// сменить на боевой адрес при размещении сервера Лайма на стороне Лайма: https://widget.lime-it.ru
		// в случае, если сервер Лайма размещен на хостинге заказчика, уточнить у Лайма адрес сервера
		const widgetAddress = 'https://test.widget.lime-it.ru';
 
		// запросить у Лайма идентификатор интеграции
		const integrationId = 37;
 
		document.getElementById('wigetFrame')
            	.setAttribute('src', `${widgetAddress}?integrationId=${integrationId}` + (!!cardCode ?  `&card=${cardCode}` : ''));
 
        }
    </script>
</head>
<body style="height: 100vh">
    <iframe id="wigetFrame" style="width: 80%; height: 80%" onload="setWidgetAddress()">
 
    </iframe>
</body>
</html>

Ниже приведен пример встройки, для тестового виджета с тестовыми реквизитами! В комментариях к скрипту указано какие параметры следует заменить при встройке боевого виджета

Встройка осуществляется через iframe силами заказчика (подрядчика, выполняющего обслуживание сайта заказчика), ниже приведен пример встройки в статическую html страницу

ЮKassa ограничила использование iframe для отображения страницы оплаты по соображениям безопасности.

widget.html

<!DOCTYPE html>
 
<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="utf-8" />
    <title></title>
    <script>
	// защита от повторной загрузки фрейма
	// если есть возможность использовать <body onload="setWidgetAddress()"> то лучше использовать его
	// если нет, то <iframe id="wigetFrame" onload="setWidgetAddress()">
	let g_widgetAddressApplied = false;
 
	// Установка адреса виджета
	function setWidgetAddress() {
		if (g_widgetAddressApplied)
            	return;
 
		g_widgetAddressApplied = true;
 
		// Разбор параметров URL для получения кода карты
		const urlParams = new URLSearchParams(window.location.search);
		const cardCode = urlParams.has('card') ? urlParams.get('card') : urlParams.get('uid');
 
		// Для загрузки виджета нужны 2 параметра:
		//   * адрес хоста виджета - ниже по коду widgetAddress 
		//   * идентификатор интеграции со стороны лайма - ниже по коду integrationId
 
		// сменить на боевой адрес при размещении сервера Лайма на стороне Лайма: https://admin.lime-it.ru
		// в случае, если сервер Лайма размещен на хостинге заказчика, уточнить у Лайма адрес сервера
		const widgetAddress = 'https://limepay.chudin.ru';
 
		// запросить у Лайма идентификатор интеграции
		const integrationId = 37;
 
		document.getElementById('wigetFrame')
            	.setAttribute('src', `${widgetAddress}/shop/${integrationId}?` + (!!cardCode ?  `card=${cardCode}` : ''));
 
        }
    </script>
</head>
<body style="height: 100vh">
    <iframe id="wigetFrame" style="width: 80%; height: 80%" onload="setWidgetAddress()">
 
    </iframe>
</body>
</html>

Также есть вариант встройки без iframe

<ticket-purchase-widget></ticket-purchase-widget>
 
<script>
    (() => {
        window.__widgetParams = {
            cdn: "https://limepay.chudin.ru/buy",
            apiUrl: "https://limepay.chudin.ru",
            integrationId: 1,
        };
        const widgetInstance = document.querySelector('ticket-purchase-widget');
        for (const key in window.__widgetParams) {
            widgetInstance[key] = window.__widgetParams[key];
        }
        const j = document.createElement('script');
        j.src = `${__widgetParams.cdn}/widget-loader.js?${(new Date()).getTime()}`;
        j.defer = true;
        document.head.appendChild(j);
    })()
</script>

Элемент ticket-purchase-widget должен находиться на месте предполагаемого расположения виджета

Для настройки виджета используются следующие параметры объекта window.__widgetParams

Ключ	Описание	Обязательный
apiUrl	Адрес сервера, на который будут отправляться запросы в API	Обязательный
cdn	Адрес с ресурсами страницы, обычно это apiUrl + '/buy'	Обязательный
integrationId	Id интеграции	Обязательный
openPage	Страница, которая будет открываться при запуске виджета (путь из адресной строки всё что после id интеграции)	Опциональный
singleEventId	Id события на главной, которое будет выводиться вместо карусели	Опциональный
hideHeader	Нужно ли прятать шапку страницы 0 - оставить 1 - убрать	По умолчанию - 0
hideFooter	Нужно ли прятать подвал 0 - оставить 1 - убрать	По умолчанию - 0
fitCards	Настройка для показа карточек в мобильной версии 0 - как обычно, слайдером 1 - умещаем две карточки, остальное также слайдером	По умолчанию - 0
hideAuthModal	Показывать ли модалку авторизации при добавлении товара 0 - показываем 1 - прячем	По умолчанию - 0