如何在移动应用中打开支付UI
注：
要快速集成艾克索拉服务，可使用现成的SDK：
- 艾克索拉Mobile SDK — 推荐使用它来扩大支付选择，同时保证符合平台要求。
- Android专用SDK — 此解决方案用于快速实现通过艾克索拉提供的所有方式接收付款：银行卡、信用卡、电子钱包、二维码以及Google Pay等原生方式。
- 在浏览器中 — 此方式下，用户从游戏跳转到外部浏览器进行支付。支付UI类似如下：
- 在Android WebView中 — 此方式下，支付UI在游戏应用内无缝打开，类似如下：
- 在Custom Tabs中 — 此方式下，支付UI在游戏应用内打开，但用户可以看见浏览器栏。支付UI类似如下：
在浏览器中
要在浏览器中打开支付UI并通过艾克索拉提供的任何方式接收付款，请按照打开支付UI的说明进行操作。
在Android WebView中
Android WebView是Google的预装系统组件，可以让Android应用显示网页内容。要使支付UI在Android WebView中正常工作，需配置WebView并设置setWebViewClient和setWebChromeClient方法。
Copy
- java
mWebView.setWebViewClient(new XsollaWebViewClient(this));
mWebView.setWebChromeClient(new XsollaWebChromeClient(this));
要配置在Android WebView中打开支付UI：
- 按照此示例配置WebView：
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);
- 按照此示例实现从
WebViewClient类继承的XsollaWebViewClient类并覆写shouldOverrideUrlLoading和onPageFinished方法：
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);
}
}
- 实现从
WebChromeClient类继承的XsollaWebChromeClient类并覆写其中的onCreateWindow和onCloseWindow方法。
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;
}
}
- 实现从
WebView类继承的XsollaChildWebView类。
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));
}
}
- 将
mChildWebView变量声明为MainActivity类中的字段：
Copy
- java
mChildWebView = findViewById(R.id.childWebView);
第二个 WebView (childWebView)用于在支付UI中打开新窗口：
实现
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>
注：
详细示例代码请参考GitHub存储库。
在Custom Tabs中
Custom Tabs是Android浏览器中的功能，让开发者可以添加直接在应用中的定制浏览器体验。WebView和Custom Tabs的区别是WebView中的用户操作与用户的其他网络操作隔离，而使用Custom Tabs可以让用户操作与他们在Android设备Chrome中的其他操作同步。
在Custom Tabs中打开支付UI的代码示例：
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));
本文对您的有帮助吗？
感谢您的反馈！
我们会查看您的留言并运用它改进用户体验。发现了错别字或其他内容错误？ 请选择文本，然后按Ctrl+Enter。
