モバイルアプリケーションで決済UIを開く方法
お知らせ
エクソーラのサービスを迅速に統合するために、エクソーラモバイルSDKを使用することができます。決済オプションを拡大し、プラットフォーム要件に準拠し続けるための推奨オプションです。
- ブラウザの場合 - ユーザーはゲームから外部ブラウザにリダイレクトされて決済を行います。決済UIは次のように表示されます:
- Android WebViewの場合 — 決済UIは、以下のようにゲームアプリケーション内でシームレスに開きます:
- カスタムタブの場合 — 決済UIはゲームアプリケーション内で開きますが、ユーザーにはブラウザのバーが表示されます。決済UIは次のように表示されます:
ブラウザの場合
ブラウザで決済UIを開き、エクソーラが提供する任意の方法で決済を受け取るには、決済UIを開く手順に従ってください。
Android WebViewの場合
Android WebViewはGoogleが提供するプリインストールのシステムコンポーネントで、Androidアプリケーションにウェブコンテンツを表示させることができます。Android WebViewで決済UIを正しく動作させるには、WebViewを構成し、setWebViewClient
とsetWebChromeClient
メソッドをセットアップする必要があります。
Copy
- java
1mWebView.setWebViewClient(new XsollaWebViewClient(this));
2mWebView.setWebChromeClient(new XsollaWebChromeClient(this));
Android WebViewで決済UIを開くように構成するには:
- この例に従ってWebViewを構成します:
Copy
- java
1WebSettings webSettings = mWebView.getSettings();
2webSettings.setBuiltInZoomControls(false);
3webSettings.setUseWideViewPort(true);
4webSettings.setDomStorageEnabled(true);
5webSettings.setLoadWithOverviewMode(true);
6webSettings.setJavaScriptEnabled(true);
7webSettings.setSupportMultipleWindows(true);
8webSettings.setJavaScriptCanOpenWindowsAutomatically(true);
WebViewClient
クラスから継承したXsollaWebViewClient
クラスを実装し、この例に従ってshouldOverrideUrlLoading
メソッドとonPageFinished
メソッドをオーバーライドします:
Copy
- java
1class XsollaWebViewClient extends WebViewClient {
2 private final Context context;
3
4
5 public XsollaWebViewClient(Context context) {
6 this.context = context;
7 }
8
9
10 @Override
11 public boolean shouldOverrideUrlLoading(WebView view, String url) {
12 if(url.matches(".+://.*")) {
13 try {
14 Intent intent = Intent.parseUri(url, Intent.URI_INTENT_SCHEME);
15 intent.addCategory("android.intent.category.BROWSABLE");
16 intent.setComponent(null);
17 context.startActivity(intent);
18 } catch(URISyntaxException e) {
19 Log.e("WebView", "Invalid URL format" + url, e);
20 } catch (ActivityNotFoundException e) {
21 Log.e("WebView", "No activity found to handle URL: " + url, e);
22 }
23 return true;
24 }
25
26
27 return false;
28 }
29
30
31 @Override
32 public void onPageFinished(WebView view, String url) {
33 super.onPageFinished(view, url);
34 }
35}
WebChromeClient
クラスから継承したXsollaWebChromeClient
クラスを実装し、onCreateWindow
メソッドとonCloseWindow
メソッドをオーバーライドします。
Copy
- java
1public class XsollaWebChromeClient extends WebChromeClient {
2 private final Context mContext;
3
4 public XsollaWebChromeClient(Context context) {
5 mContext = context;
6 }
7
8 @Override
9 public boolean onCreateWindow(WebView view, boolean isDialog, boolean isUserGesture, android.os.Message resultMsg) {
10 MainActivity mainActivity = (MainActivity) mContext;
11
12 WebView.WebViewTransport transport = (WebView.WebViewTransport) resultMsg.obj;
13 transport.setWebView(mainActivity.mChildWebView);
14 resultMsg.sendToTarget();
15 return true;
16 }
17}
WebView
クラスから継承したXsollaChildWebView
クラスを実装します。
Copy
- java
1public class XsollaChildWebView extends WebView {
2
3
4 @SuppressLint("SetJavaScriptEnabled")
5 public XsollaChildWebView(Context context, AttributeSet attrs) {
6 super(context, attrs);
7
8
9 WebSettings webSettings = getSettings();
10 webSettings.setJavaScriptEnabled(true);
11 webSettings.setDomStorageEnabled(true);
12
13
14 setWebViewClient(new XsollaWebViewClient(context));
15 setWebChromeClient(new XsollaWebChromeClient(context));
16 }
17}
mChildWebView
変数をMainActivity
クラスのフィールドとして宣言します:
Copy
- java
1mChildWebView = findViewById(R.id.childWebView);
2番目のWebView(childWebView
)は、決済UIで新しいウィンドウを開くために使用されます:
Copy
- xml
1<?xml version="1.0" encoding="utf-8"?>
2<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
3 xmlns:app="http://schemas.android.com/apk/res-auto"
4 xmlns:tools="http://schemas.android.com/tools"
5 android:layout_width="match_parent"
6 android:layout_height="match_parent"
7 tools:context=".MainActivity">
8
9 <WebView
10 android:id="@+id/mainWebView"
11 android:layout_width="match_parent"
12 android:layout_height="match_parent"
13 app:layout_constraintBottom_toBottomOf="parent"
14 app:layout_constraintEnd_toEndOf="parent"
15 app:layout_constraintStart_toStartOf="parent"
16 app:layout_constraintTop_toTopOf="parent" />
17
18 <com.example.app.XsollaChildWebView
19 android:id="@+id/childWebView"
20 android:layout_width="match_parent"
21 android:layout_height="match_parent"
22 android:visibility="gone"
23 app:layout_constraintBottom_toBottomOf="parent"
24 app:layout_constraintEnd_toEndOf="parent"
25 app:layout_constraintStart_toStartOf="parent"
26 app:layout_constraintTop_toTopOf="parent" />
27
28</androidx.constraintlayout.widget.ConstraintLayout>
お知らせ
詳細なコードサンプルについては、GitHubリポジトリを参照してください。
カスタムタブの場合
カスタムタブはAndroidブラウザの機能で、開発者はアプリケーション内で直接カスタマイズされたブラウザ体験を追加することができます。WebViewとカスタムタブの違いは、WebViewでのユーザーのアクションが他のインターネットアクションから分離されるのに対し、カスタムタブを使用すると、ユーザーのアクションがAndroidデバイス上のChromeでの他のアクティビティと同期されることです。
カスタムタブで決済UIを開くためのコードサンプル:
Copy
- java
1String url = "https://secure.xsolla.com/paystation4?token=${token}";
2CustomTabsIntent.Builder builder = new CustomTabsIntent.Builder();
3CustomTabsIntent customTabsIntent = builder.build();
4customTabsIntent.launchUrl(this, Uri.parse(url));
この記事は役に立ちましたか?
ご意見ありがとうございました!
あなたのメッセージを確認し、体験を向上させるために利用させていただきます。誤字脱字などのテキストエラーを見つけましたか? テキストを選択し、Ctrl+Enterを押します。