So öffnen Sie das Zahlungsportal
Solange Sie keinen Vertrag mit Xsolla geschlossen haben, können Sie den Zahlungsvorgang nur im Sandbox-Modus testen. Falls Fehler auftreten, finden Sie hier deren Erläuterung.
Nutzen Sie folgende URL, um das Zahlungsportal in der Testumgebung aufzurufen: https://sandbox-secure.xsolla.com/paystation4/?token=ACCESS_TOKEN; wobei ACCESS_TOKEN der Token ist, der im vorherigen Schritt bezogen wurde.
Neues Fenster
Um die Benutzeroberfläche in einem neuen Fenster zu öffnen, nutzen Sie die folgende URL: https://sandbox-secure.xsolla.com/paystation4/?token=TOKEN, wobei TOKEN der erhaltene Token ist.
https://secure.xsolla.com/paystation4/?token=TOKEN.- Mit Pay Station Embed. Einschränkung: beim Öffnen im Ingame-Browser (WebView) kann es zu Problemen kommen.
- in einem iframe. Einschränkung: beim Öffnen im Ingame-Browser (WebView) und in Ihrer mobilen App kann es zu Problemen kommen.
Pay Station Embed
- html
<script>
var options = {
access_token: 'ACCESS_TOKEN', //TODO use access token, received on previous step
sandbox: true //TODO please do not forget to remove this setting when going live
};
var s = document.createElement('script');
s.type = "text/javascript";
s.async = true;
s.src = "https://static.xsolla.com/embed/paystation/1.0.7/widget.min.js";
s.addEventListener('load', function (e) {
XPayStationWidget.init(options);
}, false);
var head = document.getElementsByTagName('head')[0];
head.appendChild(s);
</script>
<button data-xpaystation-widget-open>Buy Credits</button>
Pay Station Embed ermöglicht das Abrufen von Ereignissen aus dem Zahlungsportal via postMessage. Diese Ereignisse können an Analytics-Systeme übermittelt werden. Wenden Sie sich zum Einrichten der Ereignisverarbeitung in Ihrem Analytics-System an Ihren Customer Success Manager oder senden Sie eine E-Mail an csm@xsolla.com.
Das Xsolla-Team hat ein Widget entwickelt, mit dem Sie das Zahlungsportal ganz einfach in Ihre Website integrieren können. Das Widget-Skript ist in unserem GitHub-Repository verfügbar.
Script-Initialisierungsparameter:
| Parameter | Typ | Beschreibung |
|---|---|---|
access_token | string | Token; wird über die API empfangen. Erforderlich. |
sandbox | boolean | Stellen Sie den Wert des Parameters auf true, um den Zahlungsvorgang auszutesten: Anstelle von sandbox-secure.xsolla.com wird secure.xsolla.com verwendet. |
lightbox | object | Lightbox-Parameter (Objekt; nur für die Desktop-Version). |
lightbox.width | string | Rahmenhöhe der Lightbox. Falls als Wert null festgelegt ist, wird die Höhe der Pay Station verwendet. Standardwert ist null. |
lightbox.height | string | Rahmenhöhe der Lightbox. Falls als Wert null festgelegt ist, wird die Höhe der Pay Station verwendet. Standardwert ist 100%. |
lightbox.zIndex | integer | Definiert die Stapelanordnung. Standardwert ist 1000. |
lightbox.overlayOpacity | integer | Deckkraft des Widget-Hintergrunds (0 – völlig transparent, 1 – völlig undurchsichtig). Der Standardwert ist 60 % (.6). |
lightbox.overlayBackground | string | Hintergrundfarbe der Einblendung. Standardwert ist #000000. |
lightbox.modal | boolean | Falls true festgelegt ist, kann der Lightbox-Rahmen nicht geschlossen werden. Standardwert ist false. |
lightbox.closeByClick | boolean | Falls true festgelegt ist, wird die Lightbox durch Klick auf die Einblendung geschlossen. Standardwert ist true. |
lightbox.closeByKeyboard | boolean | Falls true festgelegt ist, wird die Lightbox durch Drücken der Escape-Taste geschlossen. Standardwert ist true. |
lightbox.contentBackground | string | Hintergrundfarbe des Rahmens. Standardwert ist #ffffff. Beachten Sie, dass diese Farbänderungen keinen Einfluss auf den iframe der Pay Station selbst haben, sondern nur auf die Einstellungen der Lightbox, in dem der iframe angezeigt wird. |
lightbox.contentMargin | string | Breite des Rahmens. Standardwert ist 10px. |
lightbox.spinner | string | Art der animierten Ladeanzeige. Als Wert lässt sich entweder xsolla oder round festlegen. Standardwert ist xsolla. |
lightbox.spinnerColor | string | Farbe des Ladekreises. Kein Wert voreingestellt. |
childWindow | object | Optionen für das untergeordnete Fenster, welches die Benutzeroberfläche der Pay Station enthält. Wird in der mobilen Version unterstützt. |
childWindow.target | string | Stelle, an welcher das Pay Station-Fenster geöffnet werden soll. Als Wert lässt sich entweder _blank, _self, _parent festlegen. Standardwert ist _blank. |
Das Script ermöglicht Ihnen, die Ereignisse im Zahlungsportal zu verfolgen. Je nach Art des Ereignisses können Sie verschiedene Aktionen auf der Website ausführen.
Liste der Ereignisse:
| Parameter | Beschreibung |
|---|---|
| init | Widget initialisiert. |
| open | Widget geöffnet. |
| load | Zahlungsportal (Pay Station) geladen. |
| close | Zahlungsportal (Pay Station) geschlossen. |
| status | Benutzer befindet sich auf der Statusseite. |
| status-invoice | Benutzer befindet sich auf der Statusseite; Zahlung im Gange. |
| status-delivering | Benutzer befindet sich auf der Statusseite; Zahlung abgeschlossen; Zahlungsbestätigung wurde versendet. |
| status-done | Benutzer befindet sich auf der Statusseite, Zahlung wurde dem Benutzerkonto gutgeschrieben. |
| status-troubled | Benutzer befindet sich auf der Statusseite; Zahlung fehlgeschlagen. |
https://secure.xsolla.com/paystation4/?token=TOKEN.https://sandbox-secure.xsolla.com/paystation4/?token=TOKEN.access_token enthält personenbezogene Nutzerdaten. Stellen Sie sicher, dass Sie Server-zu-Server-Kommunikation einsetzen, wenn Sie diesen Parameter abrufen.Iframe
So öffnen Sie das Testumgebung in einem iframe:
- Implementieren Sie den
postMessage-Mechanismus, um Zahlungsportal-Ereignisse empfangen zu können. - Öffnen Sie das Zahlungsportal über den folgenden Link:
https://sandbox-secure.xsolla.com/paystation4/?token=TOKEN, wobeiTOKENder erhaltene Token ist.
War dieser Artikel hilfreich?
Diese Seite bewerten
Jetzt nicht
Vielen Dank für Ihr Feedback!
Weitere Informationen
Haben Sie einen Tippfehler oder einen anderen Textfehler gefunden? Wählen Sie den Text aus und drücken Sie Strg+Eingabe.
