Einrichten der Anzeige des Zahlungs-Widgets
Um Ihrer Plattform eine Zahlungs-Widget-Schnittstelle hinzuzufügen, müssen Sie die Widget-Bibliothek hinzufügen. Sie können auch die Höhe des Widgets und die Ereignisbehandlung anpassen, um die Benutzerfreundlichkeit zu verbessern.
Zahlungs-Widget-Bibliothek hinzufügen
Hinweis
Wie Sie das Zahlungs-Widget in der Testumgebung öffnen, erfahren Sie in dieser Anleitung.
Einrichten mit Skript
Fügen Sie das Skript auf der Website Ihrer Plattform ein. In den Skriptinitialisierungsparametern übergeben Sie das im vorherigen Integrationsschritt erhaltene Autorisierungs-Token. Das Skript wird jedes Mal ausgeführt, wenn die Seite geladen wird.Copy
<script>
var s = document.createElement('script');
s.type = "text/javascript";
s.async = true;
s.src = "https://static.xsolla.com/payouts/v0/_bundles/santorelli.min.js";
s.addEventListener('load', function () {
const widget = new XPayoutsWidget.Widget({
token: '<auth token>',
theme: 'black',
size: 'fixed'
});
widget.show('<container_id>');
widget.addEventListener('load', () => {
console.log('loaded');
});
}, false);
var head = document.getElementsByTagName('head')[0];
head.appendChild(s);
</script>
Einrichten mit npm-Paket
- Führen Sie den Befehl
npm install @xsolla/payouts-sdkaus und richten Sie die Widget-Bibliothek ein. - Fügen Sie einen Link zur Bibliothek auf der Website Ihrer Plattform hinzu. Übergeben Sie in der Anfrage das Autorisierungs-Token, das Sie im vorherigen Integrationsschritt erhalten haben.
Copy
import {Widget} from '@xsolla/payouts-sdk';
const widget = new Widget({
token: '<auth token>',
theme: 'black',
size: 'fixed'
});
widget.show('<container_id>');
widget.addEventListener('load', () => {
console.log('loaded');
});
Sonstige Einstellungen
Höhe
Sie können die Höhe des Zahlungs-Widgets anpassen, indem Sie den folgenden Parameter im Initialisierungscode übergeben:| Parameter | Typ | Beschreibung |
|---|---|---|
| string | Die Höhe des Zahlungs-Widgets:
|
Ereignisbehandlung
Sie können die Behandlung folgender Ereignisse einrichten:
loaded— Widget, das in einem Iframe lädt.tokenExpired— Ablauf eines Tokens.requestWithdrawal— erfolgreicher Antrag auf Auszahlung.heightResize— Widget-Höhenänderung. Das Ereignis wird nur behandelt, wenn der Parametersize==‘auto’übergeben wird.
Beispiel für die Einrichtung der Ereignisbehandlung:
Copy
widget.addEventListener('tokenExpired', () => {
console.log('tokenExpired');
});
widget.addEventListener('heightResize', ({ height }) => {
console.log(`height resize to: ${height}`);
});
widget.addEventListener('requestWithdrawal', ({ amount }) => {
console.log(`success request withdrawal, amount: ${amount}`);
});
Ihr Fortschritt
Haben Sie einen Tippfehler oder einen anderen Textfehler gefunden? Wählen Sie den Text aus und drücken Sie Strg+Eingabe.
