Comment ouvrir l’interface de paiement dans l’application mobile
Note
Pour une intégration rapide des services Xsolla, utilisez des SDK prêts à l’emploi :
- Xsolla Mobile SDK — l’option recommandée pour étendre les options de paiement et rester conforme aux exigences de plateforme.
- SDK d’entreprise pour Android — une solution pour l’implémentation rapide de l’acceptation des paiements via tous les modes offerts par Xsolla : cartes de débit et de crédit, portefeuilles électroniques, codes QR et modes natifs, par exemple, Google Pay.
- Dans un navigateur — dans ce cas, l’utilisateur est redirigé vers un navigateur externe depuis le jeu pour effectuer un paiement. L’interface de paiement ressemblera à ceci :
- Dans Android WebView — dans ce cas, l'interface de paiement s'ouvre de manière fluide au sein de l'application de jeu, comme ceci :
- Dans des onglets personnalisés — dans ce cas, l'interface de paiement s'ouvre à l'intérieur de l'application de jeu, mais l'utilisateur voit la barre d'adresse d'un navigateur. L'interface de paiement ressemblera à ceci :
Dans le navigateur
Pour ouvrir l’interface de paiement dans un navigateur et recevoir des paiements via tous les modes offerts par Xsolla, suivez les instructions d’ouverture de l’interface de paiement.
Dans Android WebView
Android WebView est un composant système préinstallé de Google qui permet aux applications Android d’afficher du contenu Web. Afin d’assurer le bon fonctionnement de l’interface de paiement dans Android WebView, vous devez configurer WebView et implémenter les méthodes setWebViewClient et setWebChromeClient.
Copy
- java
mWebView.setWebViewClient(new XsollaWebViewClient(this));
mWebView.setWebChromeClient(new XsollaWebChromeClient(this));
Pour configurer l’ouverture de l’interface de paiement dans Android WebView :
- Configurez WebView comme indiqué dans cet exemple :
Copy
- 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);
- Implémentez la classe
XsollaWebViewClienthéritée de la classeWebViewClient, et remplacez les méthodesshouldOverrideUrlLoadingetonPageFinishedcomme indiqué dans cet exemple :
Copy
- 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);
}
}
- Implémentez la classe
XsollaWebChromeClienthéritée de la classeWebChromeClient, et remplacez les méthodesonCreateWindowetonCloseWindowdans celle-ci.
Copy
- 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;
}
}
- Implémentez la classe
XsollaChildWebViewhéritée de la classeWebView.
Copy
- 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));
}
}
- Déclarez la variable
mChildWebViewen tant que champ dans la classeMainActivity:
Copy
- java
mChildWebView = findViewById(R.id.childWebView);
La deuxième WebView (childWebView) sert à ouvrir de nouvelles fenêtres dans l’interface de paiement :
Exemple d’implémentation de
Copy
- 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>
Note
Référez-vous au dépôt GitHub pour des exemples de code détaillés.
Dans des onglets personnalisés
Les onglets personnalisés sont une fonctionnalité des navigateurs Android qui permet aux développeurs d’intégrer une expérience de navigation personnalisée directement dans l’application. Contrairement à WebView, où les actions de l’utilisateur sont isolées des autres interactions sur Internet, l’utilisation des onglets personnalisés synchronise les actions de l’utilisateur avec ses autres activités dans Chrome sur son appareil Android.
Exemple de code pour ouvrir l’interface de paiement dans des onglets personnalisés :
Copy
- 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));
Cet article vous a été utile ?
Merci pour votre commentaire !
Nous examinerons votre message et l'utiliserons pour améliorer votre expérience.Faute de frappe ou autre erreur dans le texte ? Sélectionnez le texte concerné et appuyez sur Ctrl+Entée.
