決済ソリューションを統合する

紹介者を追跡し、協力者への支払いを行うには、まずエクソラ決済ステーションを統合する必要があります。要件は以下の通り:

  1. 決済ステーションは、パフォーマンスに最適化されたランディングページに統合されています。
  2. 決済ステーションは、パートナーネットワークプログラムでトラフィックを誘導するゲームのランディングページで使用される唯一の決済方法です。

トークンを取得する

Note
許可されたユーザーがあなたのウェブサイトで購入する場合は、トークンの取得を実装してください。許可されていないユーザーに販売する場合は、Buy Buttonを接続してください。

決済インターフェースを統合するには、トークンを取得する必要があります。アクセストークンは、ゲームやユーザー、購入パラメータを識別する文字列です。

エクソラAPIは基本アクセス認証を採用しています。マーチャントIDをユーザー名、APIキーをパスワードとして指定します。

このデータを確認するには:

  1. パブリッシャーアカウントで、会社設定に移動します。
  2. 会社タブで、マーチャントIDをコピーします。
  3. APIキータブで、APIキーをコピーします。

トークンの取得はこのURLから:

Copy
Full screen
Small screen
https://api.xsolla.com/merchant/v2/merchants/{merchant_id}/token

HTTP POSTリクエストの内容を変更して、決済UIに渡したいパラメータを含めることができます。トークンを取得するメソッドでのパラメータuser.iduser.nameおよびuser.emailでのユーザーに関する情報を渡します。
Note
user.idパラメータには、ユーザーが覚えていて、後で自分でゲーム外で使用できる識別子を使用します。(たとえば、プッシュペイメントを使用してゲームの残高を補充する場合)。
APIリファレンス
パラメータの全リストを参照してください。

リクエストとレスポンスはどちらもJSON形式です。

以下に、エクソラPHP SDKを使用してPHPでトークンを取得する方法のサンプルコードを掲載します。他のプログラミング言語を使用している場合は、CURLタブをクリックしてCURLの例を見てみてください。

Copy
Full screen
Small screen
php
  • php
  • curl
<?php

use Xsolla\SDK\API\XsollaClient;
use Xsolla\SDK\API\PaymentUI\TokenRequest;

$tokenRequest = new TokenRequest($projectId, $userId);
$tokenRequest->setUserEmail('email@example.com')
    ->setExternalPaymentId('12345')
    ->setSandboxMode(true)
    ->setUserName('USER_NAME')
    ->setPurchase(9.99, 'USD');

$xsollaClient = XsollaClient::factory(array(
    'merchant_id' => MERCHANT_ID,
    'api_key' => API_KEY
));
$token = $xsollaClient->createPaymentUITokenFromRequest($tokenRequest);
curl -v https://api.xsolla.com/merchant/v2/merchants/{merchant_id}/token \
-X POST \
-u your_merchant_id:merchant_api_key \
-H 'Content-Type:application/json' \
-H 'Accept: application/json' \
-d '
{
    "user": {
        "id": {
            "value": "1234567"
        },
        "email": {
            "value": "email@example.com"
        }
    },
    "settings": {
        "project_id": 14004,
        "mode": "sandbox"
    },
    "purchase": {
            "checkout": {
                "amount": 9.99,
                "currency": "USD"
            }
    }
}'

決済UIを開く

決済UIを開く方法は3つあります:

Note

Xsollaと契約する前に、支払い処理のテストはサンドボックスモードでのみ利用可能です。万が一、エラーが発生した場合は、その説明をご覧ください

サンドボックスモードで決済インターフェースを開くには、次のURLを使用してください。https://sandbox-secure.xsolla.com/

決済ステーション埋め込み

Notice
この方法では、ゲームキーの販売には対応していません。ゲームキーを販売するには、以下の手順に従ってください。

例:スクリプトの非同期読み込み

Copy
Full screen
Small screen
<script>
   var options = {
       access_token: 'ACCESS_TOKEN', //TODO use access token, received on previous step
       sandbox: true //TODO please do not forget to remove this setting when going live
   };
   var s = document.createElement('script');
   s.type = "text/javascript";
   s.async = true;
   s.src = "https://static.xsolla.com/embed/paystation/1.0.7/widget.min.js";
   s.addEventListener('load', function (e) {
       XPayStationWidget.init(options);
   }, false);
   var head = document.getElementsByTagName('head')[0];
   head.appendChild(s);
</script>

<button data-xpaystation-widget-open>Buy Credits</button>

決済ステーション埋め込みでは、postMessage経由で決済UIからのイベントを取得することができます。これらのイベントを分析システムに送信できます。イベント処理を分析システムで設定するには、担当のアカウントマネージャー、またはEメールでam@xsolla.comまでお問い合わせください。

ウェブサイトに決済UIを簡単に実装するには、当社のCDNからスクリプトをダウンロードしてください。このURLを使用して、あなたのウェブサイトにスクリプトを統合します。詳細については、GitHubリポジトリをご覧ください。

スクリプト初期化パラメータ:

パラメータ種類説明文
access_token
stringAPIから受信したトークン。 必須。
sandbox
boolean決済処理をテストするには、trueに設定します。sandbox-secure.xsolla.comsecure.xsolla.comの代わりに使用されます。
lightbox
objectライトボックスパラメータ(オブジェクト、デスクトップバージョンのみ)。
lightbox.width
stringライトボックスのフレームの高さ。nullの場合、決済ステーションの高さに依存します。既定はnullです。
lightbox.height
stringライトボックスのフレームの高さ。nullの場合、決済ステーションの高さに依存します。既定は100%です。
lightbox.zIndex
integer配置順序を定義します。既定は1000です。
lightbox.overlayOpacity
integerオーバーレイ不透明度(0〜1)。既定は.6です。
lightbox.overlayBackground
stringオーバーレイの背景色。既定は#000000
lightbox.modal
booleantrueの場合、ライトボックスフレームを閉じることはできません。既定はfalseです。
lightbox.closeByClick
booleantrueの場合、オーバーレイをクリックするとライトボックスが閉じます。既定は trueです。
lightbox.closeByKeyboard
booleantrueの場合、ESCを押すとライトボックスが閉じます。既定は trueです。
lightbox.contentBackground
stringフレームの背景色。デフォルトは#ffffff。これらの色の変更は、決済ステーション iframe自体には影響を与えず、それを保持するライトボックスの設定のみに影響を与えることに注意してください。
lightbox.contentMargin
stringフレームマージン。既定は10pxです。
lightbox.spinner
stringローディングアニメーションのインジケータの種類。xsollaまたはroundに指定できます。既定はxsollaです。
lightbox.spinnerColor
stringスピナーの色。既定値はありません。
childWindow
object決済ステーションUIを含む子ウィンドウのオプション。モバイル版でサポートされています。
childWindow.target
string決済ステーションウィンドウを開く場所。_blank_self_parentに指定できます。既定は_blankです。

このスクリプトでは、決済インターフェースのイベントを追跡することができます。イベントの種類に応じて、Webページでさまざまな操作を実行できます。

イベントの一覧:

パラメータ説明文
initウィジェットが初期化されました。
openウィジェットが開かれました。
load決済インターフェース(決済ステーション)が読み込まれました。
close決済インターフェース(決済ステーション)が閉じられています。
statusユーザーはステータスページにいます。
status-invoiceユーザーはステータスページにいます。支払いが進行中です。
status-deliveringユーザーはステータスページにいます。支払いが完了しました。支払い通知が送信されました。
status-doneユーザーはステータスページにいます。支払いはユーザーのアカウントに振り込まれます。
status-troubledユーザーはステータスページにいます。支払いに失敗しました。

自分で決済UIのオープニングを初期化したい場合は、こちらのリンクを利用してください:https://secure.xsolla.com/paystation3/?access_token=ACCESS_TOKEN

Note
決済UIを開く場合にのみ、https://プレフィックス付きのリンクを使用する必要があります。

テストを試したいときは次のURLをご使用くださいhttps://sandbox-secure.xsolla.com/paystation3/?access_token=ACCESS_TOKEN

Notice
パラメータaccess_tokenには、プライベートなユーザーデータが含まれています。このパラメータを取得する際には、必ずサーバ間通信を使用するようにしてください。

Iframe

お客様側で次のメカニズムを実装してください:

  • デバイスの種類(デスクトップまたはモバイル)を指定し、トークンのsettings.ui.versionパラメータ内で送信する。
  • postMessage経由で決済UIからイベントを受け取る。こちらのイベントは分析システムに送信できます。分析システムでイベント処理を設定する場合は、アカウントマネージャーにご連絡いただくか、am@xsolla.comまでメールでお問い合わせ下さい。

Iframeで決済UIを開く場合は、次のリンクを使用してください:https://secure.xsolla.com/paystation3/?access_token=ACCESS_TOKENACCESS_TOKEN前のステップで入手したトークンです。テストする場合は、次のURLをご使用ください:https://sandbox-secure.xsolla.com/paystation3/?access_token=ACCESS_TOKEN

新しいウィンドウ

新しいウィンドウで決済インターフェース開くには、次のリンクを使用してください:https://secure.xsolla.com/paystation3/?access_token=ACCESS_TOKENACCESS_TOKENは前のステップで入手したトークンです。テストする場合は、次のURLをご使用ください:https://sandbox-secure.xsolla.com/paystation3/?access_token=ACCESS_TOKEN

ウェブフックの設定

決済ステーションご使用の際は、次のウェブフックを実装してください:
ウェブフックとは何か
ウェブフックとは何か、どのように機能するのか、そしてどのような場合に使用するのかを学びます。

メッセージボディなしのHTTPコード204で応答することで、ウェブフックの受信を確認します。

ウェブフックのハンドラをテストするときは、プロジェクト設定 > ウェブフックセクションを開いてください。

Note
ウェブフックの設定後、決済ステーション設定を開いてチェックアウトオンにします。

支払処理をテストする

支払い処理をテスト方法:

Note
エクソラと契約する前に、支払いプロセスをテストすることはサンドボックスモードでのみ可能です。

サンドボックスモードでテストする

サンドボックスモードは独立した環境で、実際の支払いと拒否された支払いを除き、ライブ環境のすべての機能をサポートします。サンドボックスモードにアクセスするには、トークンを取得する際に"mode":"sandbox"を送信します。

サンドボックスモードでは、次の方法で支払いプロセスをテストできます:

銀行カード決済をテストする

  1. サンドボックスモードで決済インターフェースを開く。
  2. 決済方法のグループからクレジット/デビットカードを選択する。
  3. 銀行カードの詳細情報を入力。その他のフィールドに任意の値を入力。間違った情報(カード番号または有効期限)を入力して、エラーを生成することも可能です。
テストカード一覧
テストバンクカードの一覧を参照してください。
Note

カード情報に加えて、以下の条件のうち少なくともひとつに該当する場合は、郵便番号の指定が必要です:

  • ユーザーの国は、米国またはカナダです。
  • 銀行識別番号(BIN)は、カードが米国で発行されたことを示します。

有効な郵便番号(例:12345)を指定することができます。これは消費税率を決定するもので、テスト支払の進行に影響を与えるものではありません。
サンドボックスモードでは、テストバンクカードのみを使用できます。サンドボックス銀行カードでの決済は、次の通貨で行うことができます:USD、EUR、RUB、GBP、AED、ALL、AMD、ARS、AUD、AZN、BGN、BRL、BYN、CAD、CHF、CLP、CNY、COP、CZK、DKK、DZD、EGP、GEL、HKD、HRK、HUF、IDR、ILS、INR、ISK、JPY、KES、KGS、KRW、KZT、MAD、MDL、MKD、MNT、MXN、MYR、NGN、PEN、PHP、PKR、PLN、RON、RSD、SAR、SEK、SGD、THB、TRY、TWD、UAH、UYU、UZS、VEF、VND、ZAR。

PayPal支払いのテスト

Notice
現在、PayPal支払いのテストは、成功したシナリオでのみ利用できます。

  1. PayPalサンドボックスモードのアカウントを作成します:
    1. Open the PayPal開発者のウェブサイトを開きます。
    2. アカウントにログインするか、新規にアカウントを作成します。
    3. Sandbox > Accountsに移動します。
    4. Sandbox Accountセクションで、Create accountをクリックします。
    5. モーダルウィンドウでは、Personalのアカウントタイプと国を選択します。
    6. Createをクリックします。作成されたアカウントは、サンドボックスのアカウントリストに表示されます。

  1. サンドボックスモードで決済UIを開きます。
  2. PayPalの決済方法を選択します。
  3. 決済ウィンドウで必要な情報を入力してください。
  4. Pay Nowをクリックします。PayPalアカウントにログインするためのウィンドウにリダイレクトされます。

  1. テスト支払いプロセスを完了するには、ステップ1で作成したサンドボックスアカウントに関する情報を入力します:メールアドレスのEmail IDとパスワードのSystem Generated Password。この情報を見つけるには:
    1. PayPal開発者のウェブサイトでアカウントにログインします。
    2. Sandbox > Accountsに移動します。
    3. Sandbox Accountセクションで、サンドボックスアカウントを選択します。
    4. •••をクリックして、ドロップダウンリストからView/edit accountを選択します。
  2. Pay Nowをクリックします。

また、既に作成されているサンドボックスのアカウント情報を利用することも可能です:

Email IDSystem Generated Password
sb-xmxij16980134@business.example.comoi9_m_KW
sb-p7pju16979920@business.example.com7%%p8ioS

実際の支払いでテストする

Note
実質的な支払いを受ける前に"mode":"sandbox"を削除します。
Notice
最初の実際の支払いが行われた後、厳格なサンドボックス支払いポリシーが有効になります。サンドボックスモードでの支払いは、パブリッシャーアカウントでの会社設定 > ユーザーセクションで指定されたユーザーのみが利用できます。

実際の支払いでテストするには、銀行カードの利用をお勧めします:

  1. 決済UIを開きます。
  2. 決済方法のクレジット/デビットカードグループを選択します。
  3. 有効な銀行カード情報を入力してください。
  4. 支払いが行われた後、パブリッシャーアカウントで、サポート > トランザクション検索に移動します。
  5. ステータスが完了のテストトランザクションを選択し、返金をクリックします。

Note
決済のテストには、VISA、Mastercardのカードのご利用をお勧めします。

ライブに行く

実際の支払いの処理を開始するには:

  1. エクソラとの契約に署名したことを確認してください。
  2. secure.xsolla.comリンクで決済ステーションをを開く。または決済ステーション埋め込みスクリプトsandbox-secure.xsolla.comからsecure.xsolla.comまで変更する。
  3. トークンを取得する時、"mode":"sandbox"を外す。

進捗状況
ご意見ありがとうございました!
最終更新日: 2021年7月5日

誤字脱字などのテキストエラーを見つけましたか? テキストを選択し、Ctrl+Enterを押します。

問題を報告する
当社は常にコンテンツを見直しています。お客様のご意見は改善に役立ちます。
フォローアップ用のメールをご提供してください
ご意見ありがとうございました!