Visão geral

Geração de token de pagamento no lado do cliente

Geração de token de pagamento no lado do servidor

Testes

Configuração do catálogo

Personalização

Promoções

Gerenciamento da interface de pagamento

Antifraude

Configure a compra de itens

Escolha o método mais adequado para o seu projeto para acessar os dados Xsolla:

Use aplicativos da web de teste como exemplo de implementação:

Criar um pedido no lado do cliente do aplicativo

Você pode vender tanto um item com um SKU em qualquer quantidade, ou um carrinho de itens com SKUs diferentes pré-preenchidos por um usuário. Para criar um pedido com dados sobre um usuário e itens no lado da Xsolla, use uma das seguintes chamadas API:

A chamada de API utilizada retornará um token de pagamento, que é necessário para abrir uma interface de pagamento e realizar um pagamento. Para usar o modo sandbox, passe o parâmetro “sandbox”: true no corpo da solicitação para obter um token.

Por padrão, o tempo de vida do token é de 24 horas. Se quiser alterar esse valor, contate seu Gerente de Sucesso do Cliente ou envie um e-mail para csm@xsolla.com. O novo valor será habilitado para todos os projetos da empresa criados na Conta de Distribuidor.

Abertura da interface de pagamento

Para abrir a interface de pagamento em uma nova janela, use o seguinte URL: https://sandbox-secure.xsolla.com/paystation4/?token=TOKEN, onde TOKEN é o token obtido.

Você também pode abrir a interface de pagamento usando outras opções:

Com a Pay Station Embed. Limitação: podem haver problemas ao abrir no navegador do jogo (WebView).
No iframe. Limitação: podem haver problemas ao abrir no navegador do jogo (WebView) e na versão móvel do seu aplicativo.

Essa maneira de abrir a interface de pagamento não oferece suporte à venda de chaves de jogo. Para vender chaves de jogo, siga a instrução.

EXEMPLO: CARREGAMENTO DE SCRIPT ASSÍNCRONO

Copy

Full screen

Small screen

<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://cdn.xsolla.net/payments-bucket-prod/embed/1.5.0/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>

A Pay Station Embed permite obter eventos da interface de pagamento via postMessage. Você pode enviar esses eventos para sistemas de análise. Para configurar o processamento de eventos em seu sistema de análise, entre em contato com seu Gerente de Sucesso da Conta ou envie um e-mail para csm@xsolla.com.

A equipe Xsolla criou um widget que simplifica a integração da interface de pagamento em seu site. O script do widget está disponível em nosso repositório GitHub.

Parâmetros de inicialização do script:

Parâmetro	Tipo	Descrição
access_token	string	Token, recebido via API. Obrigatório.
sandbox	boolean	Defina como `true` para testar o processo de pagamento: `sandbox-secure.xsolla.com` será usado em vez de `secure.xsolla.com`.
lightbox	object	Parâmetros da lightbox (objeto; somente versão desktop).
payment_widget_ui.lightbox.width	string	Largura do quadro da lightbox. Se `null`, depende da largura do Pay Station. O padrão é `null`.
payment_widget_ui.lightbox.height	string	Altura do quadro da lightbox. Se `null`, depende da altura do Pay Station. O padrão é `100%`.
payment_widget_ui.lightbox.zIndex	integer	Define a ordem do arranjo. O padrão é `1000`.
payment_widget_ui.lightbox.overlayOpacity	integer	Opacidade do plano de fundo do widget (`0` — totalmente transparente, `1` — completamente opaco). O valor padrão é 60% (`.6`).
payment_widget_ui.lightbox.overlayBackground	string	Cor de fundo da sobreposição. O padrão é `#000000`.
payment_widget_ui.lightbox.modal	boolean	Se `true`, o quadro lightbox não poderá ser fechado. O padrão é `false`.
lightbox.closeByClick	boolean	Se `true`, clicar na sobreposição fechará a lightbox. O padrão é `true`.
lightbox.closeByKeyboard	boolean	Se `true`, pressionar ESC fechará a lightbox. O padrão é `true`.
payment_widget_ui.lightbox.contentBackground	string	Cor de fundo do quadro. O padrão é `#ffffff`. Observe que essas mudanças de cor não afetam o iframe do Pay Station em si, apenas as configurações da lightbox que o contém.
payment_widget_ui.lightbox.contentMargin	string	Margem do quadro. O padrão é `10px`.
payment_widget_ui.lightbox.spinner	string	Tipo de indicador de carregamento animado. Pode ser `xsolla` ou `round`. O padrão é `xsolla`.
payment_widget_ui.lightbox.spinnerColor	string	Cor do cata-vento. Sem valor padrão.
childWindow	object	Opções para a janela filho que contém a interface do Pay Station. Suportado na versão móvel.
childWindow.target	string	Onde abrir a janela do Pay Station. Pode ser `_blank`, `_self`, `_parent`. O padrão é `_blank`.

O script permite que você acompanhe eventos da interface de pagamento. Dependendo do tipo de evento, você pode executar várias ações na página da web.

Lista de eventos:

Parâmetro	Descrição
init	Widget inicializado.
open	Widget aberto.
load	Interface de Payments (Pay Station) carregada.
close	Interface de Pagamento (Pay Station) fechada.
status	O usuário está na página de status.
status-invoice	O usuário está na página de status; pagamento em andamento.
status-delivering	Evento em que o usuário foi movido na página de status, o pagamento foi concluído e estamos enviando uma notificação de pagamento.
status-done	O usuário está na página de status; pagamento creditado na conta do usuário.
status-troubled	Evento em que o usuário foi movido na página de status, mas o pagamento falhou.

Se você quiser inicializar a abertura da interface de pagamento, use o seguinte link: https://secure.xsolla.com/paystation4/?token=TOKEN.

É necessário usar o link com o prefixo https:// apenas para a abertura da interface de pagamento.

Use o seguinte URL para fins de teste: https://sandbox-secure.xsolla.com/paystation4/?token=TOKEN.

O parâmetro access_token contém dados privados do usuário. Certifique-se de usar a comunicação de servidor para servidor ao obter esse parâmetro.

Para abrir a interface de pagamento em um iframe:

Implemente o mecanismo postMessage para receber eventos da interface de pagamento.
Abra a interface de pagamento seguindo o link https://sandbox-secure.xsolla.com/paystation4/?token=TOKEN, onde TOKEN é o token recebido.

Problema em potencial: se um botão para copiar um código de confirmação de pagamento exigido por alguns sistemas de pagamento não for exibido ao abrir a interface de pagamento em um iframe, passe o atributo allow=“clipboard-read; clipboard-write; payment” ao iframe.

Exemplo:

Copy

Full screen

Small screen

<iframe
  src="https://sandbox-secure.xsolla.com/paystation4/?token=TOKEN"
  width="800"
  height="700"
  allow="clipboard-read; clipboard-write; payment"
></iframe>

Pagamentos de teste

Para testar o processo de pagamento, você pode usar o modo sandbox. O modo sandbox é um ambiente autônomo que oferece suporte a todos os recursos de um ambiente de verdade, exceto pagamentos reais e recusados. Você pode acessar o modo sandbox enviando “sandbox”: true ao criar um pedido.

Antes de assinar um contrato com a Xsolla, o teste do processo de pagamento só fica disponível no modo sandbox.

O teste não requer o saque de dinheiro de contas bancárias reais.

Abra a interface de pagamento no modo sandbox.
Escolha o método de pagamento Cartão do banco.
Insira os dados do cartão bancário. Nos outros campos (ex.: nome ou endereço), você pode inserir qualquer dado. Você também pode especificar detalhes incorretos (número do cartão ou data de validade) para testar se um erro é gerado.
Clique em Pay.

Lista de cartões de teste

Veja a lista de cartões bancários de teste.

Além dos detalhes do cartão, você precisa especificar o CEP se pelo menos uma das seguintes condições for verdadeira:

O país do usuário for os EUA ou Canadá.
O Número de Identificação Bancária (BIN) indica que um cartão foi emitido nos EUA.

Você pode especificar qualquer CEP válido (por exemplo, 12345). Isso determina a taxa de imposto sobre vendas e não afeta o andamento do pagamento do teste.
Os pagamentos com cartão bancário no modo sandbox podem ser feitos nas seguintes moedas: 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.

No modo sandbox, você pode testar um pagamento único e um pagamento com métodos de pagamento salvos usando cartões bancários e o PayPal.

Para ver informações detalhadas, incluindo taxas, sobre as transações feitas no modo sandbox:

Abra sua Conta de Distribuidor.
Vá para Accounting > Transaction registry.
Marque a caixa Show test transactions.

Adicionalmente, você pode ver os detalhes das transações e solicitar reembolsos na Conta de Distribuidor na seção Support > Transaction search.

Crie um pedido e abra a interface de pagamento

Você pode vender tanto um item com um SKU em qualquer quantidade, ou um carrinho de itens com SKUs diferentes pré-preenchidos por um usuário.

Para criar um pedido com dados sobre um usuário e um item com um SKU no lado da Xsolla, chame o método SDK XsollaCatalog.Purchase, passando os seguintes parâmetros a ele:

itemSku — o SKU do item que o usuário deseja comprar.
onSuccess — o retorno de chamada de compra bem-sucedida, acionado quando o pedido transita para o status done.
onError — o retorno de chamada de erro de solicitação.
onBrowseClosed — o retorno de chamada de fechamento do navegador (opcional). O evento é rastreado apenas ao abrir a interface de pagamento do usuário no navegador integrado. Eventos de navegadores externos não são rastreados.
purchaseParams — parâmetros de compra e configurações de interface de pagamento do usuário, tais como a localização e moeda (opcional).
customHeaders — cabeçalhos de solicitação da web personalizados (opcional).

O método XsollaCatalog.Purchase inicia o processo de compra para o item especificado, incluindo a criação de pedido, abrindo a interface de pagamento do usuário e rastreando o status do pedido. No parâmetro onSuccess, passe a função que é chamada quando o pedido transita para o status done.

Para criar um pedido com dados sobre um usuário e um carrinho de itens no lado da Xsolla, você precisa primeiro implementar a lógica de preenchimento e edição do carrinho, bem como a obtenção do conteúdo. Consulte as instruções para ver informações mais detalhadas sobre a compra pelo carrinho de compras.

Ao criar um pedido, a Xsolla gera um token de pagamento, necessário para abrir a interface de pagamento e realizar um pagamento.

Pagamentos de teste

Para testar o processo de pagamento, você pode usar o modo sandbox. O modo sandbox é um ambiente autônomo que suporta todos os recursos de um ambiente ativo, exceto pagamentos reais e recusados. Para ter acesso ao modo sandbox, você deve ter a caixa Test Payments Mode marcada no Unity Editor no painel Inspector (marcado por padrão).

Antes de assinar um contrato com a Xsolla, o teste do processo de pagamento só fica disponível no modo sandbox.

O teste não requer o saque de dinheiro de contas bancárias reais.

Execute seu aplicativo ou cena no Unity Editor.
Escolha o método de pagamento Cartão do banco.
Insira os dados do cartão bancário. Nos outros campos (ex.: nome ou endereço), você pode inserir qualquer dado. Você também pode especificar detalhes incorretos (número do cartão ou data de validade) para testar se um erro é gerado.
Clique em Pay.

Lista de cartões de teste

Veja a lista de cartões bancários de teste.

Além dos detalhes do cartão, você precisa especificar o CEP se pelo menos uma das seguintes condições for verdadeira:

O país do usuário for os EUA ou Canadá.
O Número de Identificação Bancária (BIN) indica que um cartão foi emitido nos EUA.

No modo sandbox, você pode testar um pagamento único e um pagamento com métodos de pagamento salvos usando cartões bancários e o PayPal.

Para ver informações detalhadas, incluindo taxas, sobre as transações feitas no modo sandbox:

Abra sua Conta de Distribuidor.
Vá para Accounting > Transaction registry.
Marque a caixa Show test transactions.

Adicionalmente, você pode ver os detalhes das transações e solicitar reembolsos na Conta de Distribuidor na seção Support > Transaction search.

Crie um pedido e abra a interface de pagamento

Você pode vender tanto um item com um SKU em qualquer quantidade, ou um carrinho de itens com SKUs diferentes pré-preenchidos por um usuário.

Para criar um pedido com dados sobre um usuário e um item com um SKU no lado da Xsolla, chame o método SDK FetchPaymentToken, passando os seguintes parâmetros a ele:

- AuthToken — o token de autenticação do usuário, obtido durante a autenticação usando o Xsolla Login.

- ItemSKU — o SKU do item que o usuário quer comprar.

- SuccessCallback - o retorno de chamada acionado ao receber o token de pagamento com sucesso.

- ErrorCallback — o retorno de chamada de erro de solicitação.

- PurchaseParams — parâmetros de compra e da interface de pagamento do usuário, tal como a localização e a moeda (opcional).

Implemente a abertura da interface de pagamento. Para fazer isso, chame o método SDK LaunchPaymentConsole, passando os seguintes parâmetros a ele:

- WorldContextObject — o objeto de contexto global (para chamadas C++).

- OrderId — o ID do pedido.

- AccessToken — o token de pagamento.

- SuccessCallback — o retorno de chamada acionado ao receber o token de pagamento com sucesso.

- ErrorCallback — o retorno de chamada de erro de solicitação.

- BrowserClosedCallback — o retorno de chamada de fechamento do navegador. O evento é rastreado apenas ao abrir a interface de pagamento do usuário no navegador integrado. Os eventos de navegadores externos não são rastreados.

- PayStationVersion — a versão Pay Station. Por padrão, a versão 4 é usada.

Pagamentos de teste

Para testar o processo de pagamento, você pode usar o modo sandbox. O modo sandbox é um ambiente autônomo que suporta todos os recursos de um ambiente ativo, exceto pagamentos reais e recusados. Para ter acesso ao modo sandbox, você deve ter a caixa Enable Sandbox marcada no Unreal Editor na seção Settings > Project Settings > Plugins > Xsolla Settings > Purchases (marcado por padrão).

Antes de assinar um contrato com a Xsolla, o teste do processo de pagamento só fica disponível no modo sandbox.

O teste não requer o saque de dinheiro de contas bancárias reais.

Execute seu aplicativo ou mapa no Unreal Editor.
Escolha o método de pagamento Cartão bancário.
Insira os dados do cartão bancário. Nos outros campos (ex.: nome ou endereço), você pode inserir qualquer dado. Você também pode especificar detalhes incorretos (número do cartão ou data de validade) para testar se um erro é gerado.
Clique em Pay.

Lista de cartões de teste

Veja a lista de cartões bancários de teste.

Além dos detalhes do cartão, você precisa especificar o CEP se pelo menos uma das seguintes condições for verdadeira:

O país do usuário for os EUA ou Canadá.
O Número de Identificação Bancária (BIN) indica que um cartão foi emitido nos EUA.

No modo sandbox, você pode testar um pagamento único e um pagamento com métodos de pagamento salvos usando cartões bancários e o PayPal.

Para ver informações detalhadas, incluindo taxas, sobre as transações feitas no modo sandbox:

Abra sua Conta de Distribuidor.
Vá para Accounting > Transaction registry.
Marque a caixa Show test transactions.

Adicionalmente, você pode ver os detalhes das transações e solicitar reembolsos na Conta de Distribuidor na seção Support > Transaction search.

Obrigado pelo seu feedback!

Avaliaremos sua mensagem e a usaremos para melhorar sua experiência.

Última atualização: 20 de Dezembro de 2024

Encontrou um erro de texto ou digitação? Selecione o texto e pressione Ctrl+Enter.

Conteúdos

Criar um pedido no lado do cliente do aplicativo
Abertura da interface de pagamento
Pagamentos de teste
Crie um pedido e abra a interface de pagamento
Pagamentos de teste
Crie um pedido e abra a interface de pagamento
Pagamentos de teste

Your browser is not supported. Please try a different browser

Payments

Configure a compra de itens

Criar um pedido no lado do cliente do aplicativo

Abertura da interface de pagamento

access_token

sandbox

lightbox

payment_widget_ui.lightbox.width

payment_widget_ui.lightbox.height

payment_widget_ui.lightbox.zIndex

payment_widget_ui.lightbox.overlayOpacity

payment_widget_ui.lightbox.overlayBackground

payment_widget_ui.lightbox.modal

lightbox.closeByClick

lightbox.closeByKeyboard

payment_widget_ui.lightbox.contentBackground

payment_widget_ui.lightbox.contentMargin

payment_widget_ui.lightbox.spinner

payment_widget_ui.lightbox.spinnerColor

childWindow

childWindow.target

Pagamentos de teste

Crie um pedido e abra a interface de pagamento

Pagamentos de teste

Crie um pedido e abra a interface de pagamento

Pagamentos de teste