결제 UI를 열어 Google Pay로 결제 받는 방법

Google Pay로 결제를 받기 위해 결제 UI를 여는 다음 옵션을 사용할 수 있습니다.

  • 브라우저 사용 - 이 경우 사용자는 게임에서 외부 브라우저로 리디렉션되어 결제할 수 있습니다. 결제 UI는 다음과 같이 표시됩니다.

  • Android WebView 사용 - 이 경우 결제 UI는 다음과 같이 게임 애플리케이션 내에서 원활하게 열립니다.
  • 사용자 정의 탭 사용 - 이 경우 결제 UI가 게임 애플리케이션 내에서 열리지만 사용자에게 브라우저의 바가 표시됩니다. 결제 UI는 다음과 같이 표시됩니다.

브라우저 사용

브라우저에서 결제 UI를 열고 Google Pay로 결제를 받으려면 추가 코드를 구현할 필요가 없습니다. 설정하려면 결제 UI 열기 지침을 따라주세요.

Android WebView 사용

Android WebView는 안드로이드 애플리케이션이 웹 콘텐츠를 표시할 수 있도록 Google에서 사전 설치하는 시스템 구성 요소입니다. Android WebView에서 결제 UI와 Google Pay가 올바르게 작동하려면 WebView를 구성하고 setWebViewClientsetWebChromeClient 클래스를 설정해야 합니다.

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

Android WebView에서 결제 UI 열기를 구성하는 방법:

  1. 이 예시에 따라 WebView를 구성합니다.

Copy
Full screen
Small screen
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. 이 예시에 따라 이 클래스에서 XsollaWebViewClient extends WebViewClient 클래스와 shouldOverrideUrlLoadingonPageFinished 메소드를 구현합니다.
Copy
Full screen
Small screen
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. XsollaWebChromeClient extends WebChromeClient 클래스와 그 안의 onCreateWindowonCloseWindow 메소드를 구현합니다.
Copy
Full screen
Small screen
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. XsollaChildWebView extends WebView 클래스를 구현합니다.
Copy
Full screen
Small screen
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. MainActivity 클래스에서 XsollaChildWebView mChildWebView 필드를 구현합니다.
Copy
Full screen
Small screen
mChildWebView = findViewById(R.id.childWebView);

두 번째 WebView(childWebView)는 결제 UI에서 새 창을 여는 데 사용됩니다.

activity 구현 예시:

Copy
Full screen
Small screen
<?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 리포지토리를 참조해 주세요.

사용자 정의 탭 사용

사용자 정의 탭은 개발자가 애플리케이션 내에서 직접 사용자 정의한 브라우저 환경을 추가할 수 있는 Android 브라우저의 기능입니다. WebView와 사용자 정의 탭의 차이점은 WebView에서는 사용자 작업이 인터넷에서의 다른 작업과 분리되어 있는 반면, 사용자 정의 탭을 사용하면 사용자 작업을 Android 기기에서 Chrome의 다른 활동과 동기화할 수 있다는 점입니다.

사용자 정의 탭에서 결제 UI를 여는 코드의 샘플:

Copy
Full screen
Small screen
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));
이 기사가 도움이 되었나요?
감사합니다!
개선해야 할 점이 있을까요? 메시지
유감입니다
이 기사가 도움이 안 된 이유를 설명해 주세요. 메시지
의견을 보내 주셔서 감사드립니다!
메시지를 검토한 후 사용자 경험 향상에 사용하겠습니다.
이 페이지 평가
이 페이지 평가
개선해야 할 점이 있을까요?

답하기 원하지 않습니다

의견을 보내 주셔서 감사드립니다!
마지막 업데이트: 2024년 3월 26일

오자 또는 기타 텍스트 오류를 찾으셨나요? 텍스트를 선택하고 컨트롤+엔터를 누르세요.

문제 보고
콘텐츠를 항상 검토합니다. 여러분의 피드백은 콘텐츠를 개선에 도움이 됩니다.
후속 조치를 위해 이메일을 제공해 주세요
의견을 보내 주셔서 감사드립니다!