API

SkinsBack предоставляет пользователю возможность пополнять баланс, не покидая ваш сайт. Вам необходимо разместить на вашем сайте iframe, в котором будет находиться интерфейс SkinsBack, и реализовать один обработчик события.

Схема взаимодействия

1. Выполните запрос к API SkinsBack на создание депозита, передав параметр widget=1
2. Откройте всплывающее окно (popup, необходимо реализовать вам), и внутри него создайте html объект iframe, с адресом который был получен через API
3. Зарегистрируйте через JavaScript обработчик события, который будет следить за тем, когда пользователь пополнит баланс/закончит работу с интерфейсом пополнения SkinsBack ('success' - успешная оплата, 'cancel' - не удалось пополнить)

Чтобы пополнение скинами корректно отображалось в мобильной версии, необходимо поменять ширину и высоту iframe блока (высота должна быть не менее 970px).

Когда событие будет поймано ('success' или 'cancel') - необходимо закрыть всплывающее окно.

После успешного пополнения баланса пользователем на ваш сайт будет отправлен webhook с информацией об оплате.

Пример iframe и обработчика представлен ниже:

<!-- desktop -->
<iframe src="https://skinsback.com/_/pay/61caaa62956ba5b8bc4134acfc8cfefd"
	style="width: 850px; height: 600px; border: none;"></iframe>

<!-- mobile -->
<iframe src="https://skinsback.com/_/pay/61caaa62956ba5b8bc4134acfc8cfefd"
	style="width: 400px; height: 970px; border: none;"></iframe>

<script type="text/javascript">
	window.addEventListener('message', handleMessage, false);

	function handleMessage(event)
	{
		if (event.origin != "https://skinsback.com")
		{
			return;
		}

		if(typeof event.data.paymentStatus == 'undefined')
		{
			return;
		}

		if(event.data.paymentStatus == 'success') /* success payment */
		{
			// closePopup();
		}
		else if(event.data.paymentStatus == 'cancel') /* failed payment */
		{
			// closePopup();
		}
	}
</script>