Configure a compra de itens
Escolha o método mais adequado para o seu projeto para acessar os dados Xsolla:
Criar um pedido no lado do cliente do aplicativo
Para criar um pedido com o usuário e os dados de itens no lado da Xsolla, use a chamada API Criar pedido com item especificado. O método 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.
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.
- 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>
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. |
https://secure.xsolla.com/paystation4/?token=TOKEN
.https://sandbox-secure.xsolla.com/paystation4/?token=TOKEN
.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
, ondeTOKEN
é 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:
- html
<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.
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.
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
Para criar um pedido com os dados do usuário e do produto 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 statusdone
.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
.
Ao criar um pedido, a Xsolla gera um token de pagamento, necessário para abrir a interface de pagamento e realizar um pagamento.
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.
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
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.
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.
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
- Para criar um pedido com os dados do usuário e do item no lado da Xsolla, chame o método
createOrderByItemSku
da biblioteca Store, passando os seguintes parâmetros a ele:
callback
— o retorno de chamada de criação de pedido bem-sucedido. Ele recebe o token de pagamento necessário para abrir a interface e fazer o pagamento.
itemSku
— o SKU do item que o usuário deseja comprar.
options
— parâmetros de pagamento (opcional).
quantity
— a quantidade de itens que o usuário deseja comprar (opcional). Se a quantidade não for especificada, o valor padrão será definido como1
.
- Implemente a lógica de abertura da interface de pagamento:
- kotlin
val intent = XPayments.createIntentBuilder(activity)
.accessToken(AccessToken(<payment token>))
.isSandbox(<isSandbox>)
.build()
startActivityForResult(intent, RC_PAYSTATION)
- Implemente o tratamento de resultados de pagamento:
- kotlin
override fun onActivityResult(requestCode: Int, resultCode: Int, data: Intent?) {
super.onActivityResult(requestCode, resultCode, data)
if (requestCode == RC_PAYSTATION) {
val (status, _) = XPayments.Result.fromResultIntent(data)
when (status) {
XPayments.Status.COMPLETED -> Log.d("MainActivity", "Payment completed")
XPayments.Status.CANCELLED -> Log.d("MainActivity", "Payment cancelled")
XPayments.Status.UNKNOWN -> Log.d("MainActivity", "Status unknown")
}
}
}
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 chamar o método isSandbox
e passar true
como argumento, ao criar um objeto IntentBuilder
.
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.
- 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.
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.
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
- Para criar um pedido com os dados do usuário e do item 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.
- — o SKU do item que o usuário quer comprar.
ItemSKU
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).
ObservaçãoPor 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.- 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çãoSettings > Project Settings > Plugins > Xsolla Settings > Purchases (marcado por padrão).ObservaçãoAntes 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 testeVeja a lista de cartões bancários de teste.ObservaçãoAlé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.AvisoNo 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.
- — o SKU do item que o usuário quer comprar.
Encontrou um erro de texto ou digitação? Selecione o texto e pressione Ctrl+Enter.