public:doc:podgotovka_k_zapusku_bystrogo_popolnenija_scheta_bps

Различия

Показаны различия между двумя версиями страницы.

Ссылка на это сравнение

Предыдущая версия справа и слева Предыдущая версия
Следующая версия		 Предыдущая версия
public:doc:podgotovka_k_zapusku_bystrogo_popolnenija_scheta_bps [09:46 24/01/2023] – удалено - внешнее изменение (Unknown date) 127.0.0.1public:doc:podgotovka_k_zapusku_bystrogo_popolnenija_scheta_bps [12:19 25/11/2025] (текущий) – [Встройка виджета Веб витрины в сайт заказчика] david_chachanov
Строка 1: Строка 1:
 +====== Подготовка к запуску Быстрого Пополнения Счета (БПС) ======
 +
 +Возможны несколько сценариев использования БПС:
 +
 +  * На глобальном сервере с эквайрингом и фискализацией Лайма
 +  * На глобальном сервере с эквайрингом и фискализацией заказчика
 +  * На локальном сервере
 +
 +<WRAP center round info 60%>
 +В любом случае для работы БПС требуется использование постоянных карт клиентов с преднапечатанными номерами **тождественными** внутреннему идентификатору карты!
 +</WRAP>
 + 
 +
 +===== С эквайрингом и фискализацией Лайма =====
 +
 +Подготовительных работ от заказчика не требуется.
 +
 +===== С эквайрингом и фискализацией заказчика =====
 +<WRAP center round alert 60%>
 +**ЮKassa ограничила использование iframe для отображения страницы оплаты по соображениям безопасности.**
 +</WRAP>
 +
 +  - Заключить договор с ЮКассой/Сбербанком/Тинькофф (**важно:** [[public:doc:tinkoff|для получения доступа к ЛК Тинькофф требуется написать им заявку]]) на интернет эквайринг, предоставить ключи доступа.
 +  - Ссылка на сайт Юкассы https://yookassa.ru/connection/
 +  - Зарегистрировать онлайн-фискальник АТОЛ : https://atol.online/ (или иной, поддерживаемый выбранным интернет эквайером) и [[public:doc:online_processing:yookassa|подключить его в личном кабинете эквайера, либо передать нам данные для доступа в личный кабинет эквайера и хостинга онлайн фискальника]]
 +  - Подготовить **на своем сайте** страницу с данными, отвечающими требованиям эквайера, политикой конфиденциальности и правилами использования приложения, и предоставить ссылку на данную страницу ([[https://admin.lime-it.ru/useragreement.html|Пример]]): <WRAP center round important 60%>
 +В правилах возврата указать что все возвраты осуществляются только на кассах!
 +</WRAP>
 +    - Сбербанк: https://3dsec.sberbank.ru/techportal/doku.php/merchant_website_guidelines (раздел ''8. На сайте интернет-магазина обязательно должны быть размещены:'')
 +    - Тинькофф: https://help.tinkoff.ru/internet-acquiring/requirements/info/ (по сути аналогично сбербанку)
 +    - ЮКасса: аналогично Сбербанку.
 +
 +
 +===== На локальном сервере =====
 +
 +  - Обеспечить белый ip-адрес, доступ до сервера по TCP портам 80 и 443, доменное имя, настроенный SSL и https (доменное имя и настройка SSL/HTTPS могут быть предоставлены Лаймом)
 +    - В случае использования эквайринга и фискализации Лайма дополнительных подготовительных работ не требуется
 +    - **В случае использования эквайринга и фискализации заказчика см раздел выше.**
 +
 +===== Перенаправление на виджет =====
 +
 +Для автоматического перенаправления на виджет с сайта лайма в параметре ''Шаблон URL редиректа'' указать значение ''https://widget.lime-it.ru/?integrationId={0}&card={1}''
 +
 +<WRAP center round important 60%>
 +При использовании локального сервера виджет следует размещать так же на локальном сервере, адрес виджета будет соответствовать адресу локального сервера, например https://widget.vdnh.lime-it.ru
 +</WRAP>
 +
 +
 +===== Встройка виджета БПС в сайт заказчика =====
 +
 +<WRAP center round important 60%>
 +Ниже приведен **пример** встройки, для тестового виджета с тестовыми реквизитами! В комментариях к скрипту указано какие параметры следует заменить при встройке боевого виджета
 +</WRAP>
 +
 +
 +Встройка осуществляется через ''iframe'' силами заказчика (подрядчика, выполняющего обслуживание сайта заказчика), ниже приведен пример встройки в статическую html страницу
 +
 +<WRAP center round alert 60%>
 +ЮKassa ограничила использование iframe для отображения страницы оплаты по соображениям безопасности.
 +</WRAP>
 +
 +<file html 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>
 +
 +</file> 
 +
 +===== Встройка виджета Веб витрины в сайт заказчика =====
 +
 +<WRAP center round important 60%>
 +Ниже приведен **пример** встройки, для тестового виджета с тестовыми реквизитами! В комментариях к скрипту указано какие параметры следует заменить при встройке боевого виджета
 +</WRAP>
 +
 +
 +Встройка осуществляется через ''iframe'' силами заказчика (подрядчика, выполняющего обслуживание сайта заказчика), ниже приведен пример встройки в статическую html страницу
 +
 +<WRAP center round alert 60%>
 +ЮKassa ограничила использование iframe для отображения страницы оплаты по соображениям безопасности.
 +</WRAP>
 +
 +<file html 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>
 +
 +</file> 
 +
 +Также есть вариант встройки без ''iframe''
 +
 +<file html>
 +<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>
 +</file>
 +
 +Элемент ''ticket-purchase-widget'' должен находиться на месте предполагаемого расположения виджета
 +
 +Для настройки виджета используются следующие параметры объекта ''window.__widgetParams''
 +
 +^ Ключ           ^ Описание                                                                                                                            | Обязательный      |
 +| apiUrl         | Адрес сервера, на который будут отправляться запросы в API                                                                          | Обязательный      |
 +| cdn            | Адрес с ресурсами страницы, обычно это apiUrl + '/buy'                                                                              | Обязательный      |
 +| integrationId  | Id интеграции                                                                                                                       | Обязательный      |
 +| hideHeader     | Нужно ли прятать шапку страницы\\ 0 - оставить\\ 1 - убрать                                                                         | По умолчанию - 0  |
 +| hideFooter     | Нужно ли прятать подвал\\ 0 - оставить\\ 1 - убрать                                                                                 | По умолчанию - 0  |
 +| fitCards       | Настройка для показа карточек в мобильной версии\\ 0 - как обычно, слайдером\\ 1 - умещаем две карточки, остальное также слайдером  | По умолчанию - 0  |
 +===== Ссылки =====
 +
 +  * [[public:doc:popolnenie_denezhnyx_sredstv_na_kartu_klienta|]]
 +  * [[public:doc:podgotovka_k_zapusku_prodazh_cherez_sajt_pod_zakazchika|]]
 +
 +{{tag>public doc article customer shop}}