API

SkinsBack ermöglicht es dem Benutzer, sein Guthaben aufzuladen, ohne Ihre Website zu verlassen. Sie müssen ein iframe auf Ihrer Website platzieren, das die SkinsBack-Schnittstelle enthält, und einen Event-Handler implementieren.

Interaktionsablauf

1. Senden Sie eine Anfrage an die SkinsBack-API , um eine Einzahlungzu erstellen, indem Sie den Parameter widget=1 übergeben
2. Öffnen Sie ein Popup-Fenster (Popup), das Sie implementieren müssen, und erstellen Sie darin ein HTML-Iframe-Objekt mit der über die API erhaltenen URL
3. Registrieren Sie einen JavaScript-Event-Handler, der überwacht, wann der Benutzer sein Guthaben auflädt/die Interaktion mit der SkinsBack-Benutzeroberfläche abschließt ('success' - erfolgreiche Zahlung, 'cancel' - Aufladung fehlgeschlagen)

Um die Skin-Aufladung in der mobilen Version korrekt anzuzeigen, müssen Sie die Breite und Höhe des iframe-Blocks ändern (die Höhe sollte mindestens 970px betragen).

Wenn das Ereignis ('success' oder 'cancel') erkannt wird, muss das Popup-Fenster geschlossen werden.

Nach erfolgreicher Aufladung des Guthabens durch den Benutzer wird eine Webhook mit Zahlungsinformationen an Ihre Website gesendet.

Ein Beispiel für das iframe und den Handler wird unten dargestellt:

<!-- 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>