Configuração da exibição do widget de pagamento
Para adicionar uma interface de widget de pagamento à sua plataforma, você precisa adicionar a biblioteca de widgets. Você também pode ajustar a altura do widget e a manipulação de eventos para melhorar a experiência do usuário.
Adicione a biblioteca de widgets de pagamento
Observação
Para abrir o widget de pagamento no modo sandbox, consulte estas instruções.
Configuração usando script
Adicione o script à página do site da sua plataforma. Nos parâmetros de inicialização do script, passe o token de autorização obtido na etapa de integração anterior. O script é executado sempre que a página é carregada.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>
Configure usando o pacote npm
- Execute o comando
npm install @xsolla/payouts-sdke configure a biblioteca de widgets. - Adicione um link na biblioteca para o site da sua plataforma. Na solicitação, passe o token de autorização obtido na etapa de integração anterior.
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');
});
Configurações adicionais
Altura
Você pode ajustar a altura do widget de pagamento passando o seguinte parâmetro no código de inicialização:| Parâmetro | Tipo | Descrição |
|---|---|---|
| string | A altura do widget de pagamento:
|
Manipulação de eventos
Você pode configurar a manipulação dos seguintes eventos:
loaded— carregamento de widget em um iframe.tokenExpired— expiração de um token.requestWithdrawal— solicitação bem-sucedida para receber o saque.heightResize— alteração de altura do widget. O evento é manipulado somente quando o parâmetrosize==‘auto’é passado.
Exemplo de configuração de manipulação de eventos:
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}`);
});
Seu progresso
Encontrou um erro de texto ou digitação? Selecione o texto e pressione Ctrl+Enter.
