Como abrir a interface de pagamento em um aplicativo móvel

Observação
Para integrar serviços Xsolla rapidamente, você pode usar os SDK somente de leitura:
  • Xsolla Mobile SDK — A opção recomendada para expandir as opções de pagamento e permanecer em conformidade com os requisitos da plataforma.
  • Enterprise-level SDKs for Android — Uma solução de implementação rápida da aceitação de pagamento usando todos os métodos oferecidos pela Xsolla: cartões de crédito e bancários, carteiras virtuais, códigos QR e métodos nativos, como o Google Pay.
Para receber pagamentos em aplicativos móveis, você pode usar as seguintes opções para abrir a interface de pagamento:
  • Em um navegador — nesse caso, um usuário é redirecionado para um navegador externo do jogo para fazer um pagamento. A interface de pagamento terá a seguinte aparência:
  • Na Android WebView — nesse caso, a interface de pagamento abre de forma fluída dentro do aplicativo do jogo, assim:
  • Na Custom Tabs — nesse caso, a interface de pagamento abre dentro do aplicativo do jogo, mas o usuário pode visualizar uma barra de navegação. A interface de pagamento terá a seguinte aparência:

No navegador

Para abrir a interface de pagamento em um navegador e receber pagamentos via quaisquer métodos oferecidos pela Xsolla, siga a instrução para a abertura da interface de pagamento.

No Android WebView

Android WebView é um componente de sistema pré-instalado da Google que permite aplicativos Android exibirem conteúdos da web. Para que a interface de pagamento funcione corretamente no Android WebView, você precisa configurar o WebView e configurar os métodos setWebViewClient e setWebChromeClient.

Copy
Full screen
Small screen
  • java
mWebView.setWebViewClient(new XsollaWebViewClient(this));
mWebView.setWebChromeClient(new XsollaWebChromeClient(this));

Para configurar a abertura da interface de pagamento no Android WebView:

  1. Configure o WebView de acordo com esse exemplo:

Copy
Full screen
Small screen
  • java
WebSettings webSettings = mWebView.getSettings();
webSettings.setBuiltInZoomControls(false);
webSettings.setUseWideViewPort(true);
webSettings.setDomStorageEnabled(true);
webSettings.setLoadWithOverviewMode(true);
webSettings.setJavaScriptEnabled(true);
webSettings.setSupportMultipleWindows(true);
webSettings.setJavaScriptCanOpenWindowsAutomatically(true);
  1. Implemente a classe XsollaWebViewClient, que é herdada da classe WebViewClient, e substitui os métodos shouldOverrideUrlLoading e onPageFinished de acordo com esse exemplo:
Copy
Full screen
Small screen
  • java
class XsollaWebViewClient extends WebViewClient {
    private final Context context;


    public XsollaWebViewClient(Context context) {
        this.context = context;
    }


    @Override
    public boolean shouldOverrideUrlLoading(WebView view, String url) {
        if(url.matches(".+://.*")) {
            try {
                Intent intent = Intent.parseUri(url, Intent.URI_INTENT_SCHEME);
                intent.addCategory("android.intent.category.BROWSABLE");
                intent.setComponent(null);
                context.startActivity(intent);
            } catch(URISyntaxException e) {
                Log.e("WebView", "Invalid URL format" + url, e);
            } catch (ActivityNotFoundException e) {
                Log.e("WebView", "No activity found to handle URL: " + url, e);
            }
            return true;
        }


        return false;
    }


    @Override
    public void onPageFinished(WebView view, String url) {
        super.onPageFinished(view, url);
    }
}
  1. Implemente a classe XsollaWebChromeClient, que é herdada da classe WebChromeClient, e substitui os métodos onCreateWindow e onCloseWindow dentro dela.
Copy
Full screen
Small screen
  • java
public class XsollaWebChromeClient extends WebChromeClient {
    private final Context mContext;

    public XsollaWebChromeClient(Context context) {
        mContext = context;
    }

    @Override
    public boolean onCreateWindow(WebView view, boolean isDialog, boolean isUserGesture, android.os.Message resultMsg) {
        MainActivity mainActivity = (MainActivity) mContext;

        WebView.WebViewTransport transport = (WebView.WebViewTransport) resultMsg.obj;
        transport.setWebView(mainActivity.mChildWebView);
        resultMsg.sendToTarget();
        return true;
    }
}
  1. Implemente a classe XsollaChildWebView herdada da classe WebView.
Copy
Full screen
Small screen
  • java
public class XsollaChildWebView extends WebView {


    @SuppressLint("SetJavaScriptEnabled")
    public XsollaChildWebView(Context context, AttributeSet attrs) {
        super(context, attrs);


        WebSettings webSettings = getSettings();
        webSettings.setJavaScriptEnabled(true);
        webSettings.setDomStorageEnabled(true);


        setWebViewClient(new XsollaWebViewClient(context));
        setWebChromeClient(new XsollaWebChromeClient(context));
    }
}
  1. Declare a variável mChildWebView como um campo na classe MainActivity:
Copy
Full screen
Small screen
  • java
mChildWebView = findViewById(R.id.childWebView);

O segundo WebView (childWebView) é usado para abrir novas janelas na interface de pagamento:

Exemplo de implementação de activity:

Copy
Full screen
Small screen
  • xml
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity">

    <WebView
        android:id="@+id/mainWebView"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

    <com.example.app.XsollaChildWebView
        android:id="@+id/childWebView"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:visibility="gone"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

</androidx.constraintlayout.widget.ConstraintLayout>
Observação
Consulte o repositório GitHub para ver exemplos de códigos detalhados.

Na Custom Tabs

Custom Tabs é um recurso nos navegadores Android que permite que os desenvolvedores adicionem uma experiência de navegação personalizada diretamente dentro do aplicativo. A diferença entre WebView e Custom Tabs é que as ações do usuário na WebView são isolados de suas outras ações na internet, onde o uso da Custom Tabs permite a sincronização das ações do usuário com suas outras atividades no Chrome e no seu dispositivo Android.

Amostra de código por abrir a interface de pagamento nas Custom Tabs:

Copy
Full screen
Small screen
  • java
String url = "https://secure.xsolla.com/paystation4?token=${token}";
CustomTabsIntent.Builder builder = new CustomTabsIntent.Builder();
CustomTabsIntent customTabsIntent = builder.build();
customTabsIntent.launchUrl(this, Uri.parse(url));
Este artigo foi útil?
Obrigado!
Podemos melhorar alguma coisa? Mensagem
Que pena ouvir isso
Explique porque este artigo não foi útil para você. Mensagem
Obrigado pelo seu feedback!
Avaliaremos sua mensagem e a usaremos para melhorar sua experiência.
Avalie esta página
Avalie esta página
Podemos melhorar alguma coisa?

Não quero responder

Obrigado pelo seu feedback!
Última atualização: 26 de Julho de 2024

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

Relatar um problema
Nós sempre avaliamos nossos conteúdos. Seu feedback nos ajuda a melhorá-los.
Forneça um e-mail para que possamos responder
Obrigado pelo seu feedback!