Zahlungslösung integrieren
Damit Sie Referrals tracken und Auszahlungen an Kooperationspartner vornehmen können, müssen Sie zuerst die Xsolla-Bezahlstation integrieren. Anforderungen:
- Die Bezahlstation ist auf einer leistungsoptimierten Landing-Page integriert.
- Die Bezahlstation ist die einzige Zahlungsmethode auf der Landing-Page, die den Traffic durch das Partnernetzwerk-Prorgramms leitet.
Token abrufen
Für die Integration des Zahlungsportals müssen Sie einen Token abrufen. Ein Zugriffstoken ist ein String, mit dem sich Spiele-, Benutzer- und Kaufparameter identifizieren lassen.
Xsolla-API nutzt Basisauthentifizierung. Geben Sie Ihre Händler-ID als Benutzernamen und den API-Schlüssel als Passwort an.
So finden Sie diese Daten:
- Wechseln Sie im Kundenportal in die Firmeneinstellungen.
- Kopieren Sie auf der Registerkarte Firma die Händler-ID.
- Kopieren Sie auf der Registerkarte API-Schlüssel den API-Schlüssel.

URL zum Abrufen des Tokens:
- curl
https://api.xsolla.com/merchant/v2/merchants/{merchant_id}/token
user.id
, user.name
und user.email
der Token erstellen-Methode.user.id
eine Kennung, die sich leicht merken lässt, damit Benutzer sie außerhalb des Spiels (z. B. beim Aufladen des Spielguthabens mittels Push-Zahlungen) verwenden können.Sowohl die Anfrage als auch die Antwort erfolgen im JSON-Format.
Nachstehend finden Sie einen Beispielcode für das Anfordern des Tokens in PHP mithilfe des Xsolla PHP SDK. Falls Sie eine andere Programmiersprache verwenden, sehen Sie sich bitte das CURL-Beispiel an, indem Sie auf die Registerkarte CURL klicken.
- php
- curl
<?php
use Xsolla\SDK\API\XsollaClient;
use Xsolla\SDK\API\PaymentUI\TokenRequest;
$tokenRequest = new TokenRequest($projectId, $userId);
$tokenRequest->setUserEmail('email@example.com')
->setExternalPaymentId('12345')
->setSandboxMode(true)
->setUserName('USER_NAME')
->setPurchase(9.99, 'USD');
$xsollaClient = XsollaClient::factory(array(
'merchant_id' => MERCHANT_ID,
'api_key' => API_KEY
));
$token = $xsollaClient->createPaymentUITokenFromRequest($tokenRequest);
curl -v https://api.xsolla.com/merchant/v2/merchants/{merchant_id}/token \
-X POST \
-u your_merchant_id:merchant_api_key \
-H 'Content-Type:application/json' \
-H 'Accept: application/json' \
-d '
{
"user": {
"id": {
"value": "1234567"
},
"email": {
"value": "email@example.com"
}
},
"settings": {
"project_id": 14004,
"mode": "sandbox"
},
"purchase": {
"checkout": {
"amount": 9.99,
"currency": "USD"
}
}
}'
Zahlungsportal öffnen
Es gibt drei Möglichkeiten, das Zahlungsportal zu öffnen:
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/
.
Pay Station Embed
BEISPIEL: ASYNCHRONES LADEN VON SCRIPTEN
- 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 Analytic-Systeme übermittelt werden. Wenden Sie sich zum Einrichten der Ereignisverarbeitung in Ihrem Analytic-System an Ihren Account Manager oder senden Sie eine E-Mail an am@xsolla.com.
Zur einfachen Implementierung des Zahlungsportals auf Ihrer Website empfiehlt es sich, das Skripts aus unserem CDN herunterzuladen. Verwenden Sie diese URL, um das Skript auf Ihrer Website zu integrieren. Weitere Informationen finden Sie in unserem GitHub Repository.
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 Bezahlstation verwendet. Standardwert ist null . |
lightbox.height | string | Rahmenhöhe der Lightbox. Falls als Wert null festgelegt ist, wird die Höhe der Bezahlstation verwendet. Standardwert ist 100% . |
lightbox.zIndex | integer | Definiert die Stapelanordnung. Standardwert ist 1000 . |
lightbox.overlayOpacity | integer | Deckkraft der Einblendung (0 bis 1). Standardwert ist .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 Bezahlstation 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 Bezahlstation enthält. Wird in der mobilen Version unterstützt. |
childWindow.target | string | Stelle, an welcher das Bezahlstation-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 (Bezahlstation) geladen. |
close | Zahlungsportal (Bezahlstation) 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. |
Wenn Sie den Ladevorgang für das Zahlungsportal selbst initialisieren möchten, verwenden Sie folgenden Link: https://secure.xsolla.com/paystation3/?access_token=ACCESS_TOKEN
.
Für Testzwecke steht Ihnen folgende URL zur Verfügung: https://sandbox-secure.xsolla.com/paystation3/?access_token=ACCESS_TOKEN
.
Iframe
Sie müssen Ihrerseits folgende Mechanismen implementieren:
- Prüfung des Gerätetyps (Desktop oder mobiles Endgerät) und Übermittlung innerhalb des settings.ui.version-Tokenparameters.
- Abrufen von Ereignissen aus dem Zahlungsportal via postMessage. Diese Ereignisse können an Analytics-Systeme gesendet werden. Um die Verarbeitung von Ereignissen in Ihrem Analytics-System einzurichten, wenden Sie sich an Ihren Account Manager oder senden Sie eine E-Mail an am@xsolla.com.
Nutzen Sie folgenden Link, um das Zahlungsportal in einem iframe aufzurufen: https://secure.xsolla.com/paystation3/?access_token=ACCESS_TOKEN
; wobei ACCESS_TOKEN
der Token ist, der im vorherigen Schritt bezogen wurde. Für Testzwecke steht Ihnen folgende URL zur Verfügung: https://sandbox-secure.xsolla.com/paystation3/?access_token=ACCESS_TOKEN
.
Neues Fenster
Nutzen Sie folgenden Link, um das Zahlungsportal in einem neuen Fenster aufzurufen: https://secure.xsolla.com/paystation3/?access_token=ACCESS_TOKEN
; wobei ACCESS_TOKEN
der Token ist, der im vorherigen Schritt bezogen wurde. Für Testzwecke steht Ihnen folgende URL zur Verfügung: https://sandbox-secure.xsolla.com/paystation3/?access_token=ACCESS_TOKEN
.
Webhooks einrichten
Bestätigen Sie den Erhalt eines Webhooks, indem Sie mit dem HTTP-Statuscode 204 ohne Nachrichtenrumpf antworten.
Gehen Sie zum Testen des Webhook-Handlers zum Abschnitt Projekteinstellungen > Webhooks.
Zahlungsvorgang testen
Zum Ausprobieren des Zahlungsvorgangs können Sie:
- die Testumgebung (Sandbox-Modus) nutzen
- Eine echte Zahlung tätigen und anschließend eine Rückerstattung über das Kundenportal vornehmen
Xsolla-Sandbox ist eine eigenständige Testumgebung, welche alle Funktionen der Live-Umgebung, mit Ausnahme echter Zahlungen, unterstützt. Sie können auf die Testumgebung zugreifen, indem Sie "mode":"sandbox"
beim Abrufen des Tokens senden.
- Rufen Sie das Zahlungsportal in der Testumgebung (Sandbox-Modus) auf.
- Wählen Sie unter Zahlungsarten die Gruppe Kredit-/Debitkarten aus.
- Geben Sie die Bankkartendaten ein. Geben Sie alle Werte in die verbleibenden Felder ein. Sie können auch falsche Angaben (Kartennummer, Ablaufdatum oder CVV) machen, um einen Fehler zu generieren.
Neben den Kartendaten müssen Sie auch die Postleitzahl angeben, wenn mindestens eine der folgenden Bedingungen erfüllt ist:
- Der Benutzers ist in den USA oder in Kanada wohnhaft.
- Anhand der Bank Identification Number (BIN) ist ersichtlich, dass die Karte in den USA ausgestellt wurde.
Bankkartenzahlungen in der Testumgebung können in folgenden Währungen getätigt werden: USD, EUR, RUB, GBP, AED, ALL, AMD, ARS, AUD, AZN, BGN, BRL, BYN, CAD, CHF, CLP, CNY, COP, CZK, DKK, DZD, EGP, GEL, HKD, HRK, HUF, IDR, ILS, INR, ISK, JPY, KES, KGS, KRW, KZT, MAD, MDL, MKD, MNT, MXN, MYR, NGN, PEN, PHP, PKR, PLN, RON, RSD, SAR, SEK, SGD, THB, TRY, TWD, UAH, UYU, UZS, VEF, VND, ZAR.
"mode":"sandbox"
.Um den Zahlungsvorgang mit echten Zahlungen zu testen, empfiehlt es sich zudem, eine Bankkarte zu verwenden:
- Öffnen Sie das Zahlungsportal.
- Wählen Sie als Zahlungsmethode Kredit-/Debitkarten aus.
- Geben Sie gültige Kartendaten ein.
- Rufen Sie nach erfolgter Zahlung die Transaktionssuche im Kundenportal auf.
- Wählen Sie Ihre testweise getätigte Transaktion aus, und klicken Sie auf Erstatten (Die Transaktion muss den Status Abgeschlossen aufweisen).
Live schalten
So beginnen Sie mit der Abwicklung echter Zahlungen:
- Stellen Sie sicher, dass Sie einen Vertrag mit Xsolla geschlossen haben.
- Öffnen Sie die Bezahlstation über folgenden Link:
secure.xsolla.com
. Oder ändern Sie im Pay Station Embed-Skript die URL vonsandbox-secure.xsolla.com
insecure.xsolla.com
. - Entfernen Sie
"mode":"sandbox"
beim Abrufen des Tokens.
Haben Sie einen Tippfehler oder einen anderen Textfehler gefunden? Wählen Sie den Text aus und drücken Sie Strg+Eingabe.