決済ソリューションを統合する
紹介者を追跡し、協力者への支払いを行うには、まずエクソラ決済ステーションを統合する必要があります。要件は以下の通り:
- 決済ステーションは、パフォーマンスに最適化されたランディングページに統合されています。
- 決済ステーションは、パートナーネットワークプログラムでトラフィックを誘導するゲームのランディングページで使用される唯一の決済方法です。
トークンを取得する
決済UIを開くには、トークンを取得する必要があります。トークンとは、ゲームとユーザーに関する暗号化されたデータを含む文字列です。トークンを取得してユーザーを識別し、購入を許可するように実装する必要があります。
アプリケーションのバックエンドで、ユーザー認証トークンの取得を実装します。これを行うには、基本的なHTTP認証を含むHTTP POSTリクエストを使用し、リクエスト本文で必要なパラメータを渡します。
トークンの有効期限は、最後にエクソーラAPIを呼び出してから14時間後です。有効期限が切れた後に新しいトークンを受け取るロジックを実装してください。ユーザーがアプリケーションに再ログインする必要がないように、バックグラウンドで新しいトークンを取得することをお勧めします。
基本HTTP認証
エクソラAPIは基本アクセス認証を採用しています。APIに対する全リクエストは、Authorization: Basic <your_authorization_basic_key>
ヘッダーを含む必要があります。<your_authorization_basic_key>
はマーチャントID:APIキーのペアで、Base64の基準に従ってエンコードしています。パブリッシャーアカウントに移動して、次のパラメータを見つけます:
- マーチャントIDは以下の場所で表示されます:
- プロジェクト設定 > ウェブフックセクション。
- 会社設定 > 会社セクション。
- パブリッシャーアカウントページのブラウザーアドレスバーのURL。URLは以下の形式があります:
https://publisher.xsolla.com/マーチャントID/パブリッシャーアカウントセクション
。
- APIキーは、作成時に一度だけパブリッシャーアカウントに表示され、お客様側で保存する必要があります。次のセクションで新しいキーを作成できます:
- 会社設定 > APIキー
- プロジェクト設定 > APIキー
APIキーの操作については、APIリファレンスを参照してください。
キーに関する推奨事項:
- 生成されたAPIキーは、お客様側で保存してください。APIキーは、パブリッシャーアカウントで作成時に一度だけ表示することができます。
- APIキーは秘密にしておいてください。APIキーは、お客様の個人アカウントとパブリッシャーアカウントのプロジェクトへのアクセスを提供します。
- APIキーはサーバーに保存する必要があり、決してバイナリやフロントエンドに保存してはいけません。
リクエスト本文
リクエスト本文に、以下の必須パラメータを渡します:
パラメータ | 種類 | 説明文 |
---|---|---|
user.id | string | お使いのシステムの一意のユーザーID。 |
user.email | string | 購入時の領収書を送信するためのユーザーメールアドレスです。このパラメータを渡さなかった場合、決済画面にメールアドレス入力のための必須フィールドが表示されます。 |
settings.project_id | integer | ゲーマーのXsolla ID。この情報は、パブリッシャーアカウントのプロジェクトセクションで確認することができます。 |
ユーザーエクスペリエンスを向上させるために、以下のパラメータを渡すこともできます:
パラメータ | 種類 | 説明文 |
---|---|---|
user.name | string | レシートに表示されるユーザースクリーンネーム。 |
settings.currency | string | 優先決済通貨。 |
settings.language | string | インターフェース言語。 |
ユーザー認証トークンを取得するためのリクエスト例
curl -i -X POST \
-u 2340:ZHgbSDVP6LtAJVWu \
https://api.xsolla.com/merchant/v2/merchants/<merchant_id>/token \
-H 'Content-Type: application/json' \
-d '{
"settings": {
"currency": "USD",
"language": "en",
"project_id": <project_id>
}
},
"user": {
"email": {
"value": "<user_email>"
},
"id": {
"value": "<user_id>"
},
"name": {
"value": "<user_name>"
}
}
}'
応答で受け取ったユーザー認証トークンの例
{
"token": "1230OWrp0KF6uqvmN8jWuzLyoXMzxTyK_lc_en"
}
決済UIを開く
Xsollaと契約する前に、支払い処理のテストはサンドボックスモードでのみ利用可能です。万が一、エラーが発生した場合は、その説明をご覧ください。
サンドボックスモードで決済インターフェースを開くには、次のURLを使用してください:https://sandbox-secure.xsolla.com/paystation4/?token=ACCESS_TOKEN
、ACCESS_TOKEN
は前のステップで入手したトークンです。
新しいウィンドウ
決済UIを新しいウィンドウで開くには、以下のURLをご利用ください:https://sandbox-secure.xsolla.com/paystation4/?token=TOKEN
。TOKEN
は取得したトークンです。
https://secure.xsolla.com/paystation4/?token=TOKEN
。また、他のオプションを使って決済UIを開くこともできます:
- Pay Station Embedを利用します。制限:ゲーム内ブラウザ(WebView)で開くと不具合が発生する場合があります。
- iframe。制限:をゲーム内ブラウザ(WebView)やモバイル版アプリケーションで開くと、不具合が発生する場合があります。
決済ステーション埋め込み
例:スクリプトの非同期読み込み
- html
<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>
Pay Station Embedを使用すると、postMessage
経由で決済UIからイベントを取得できます。これらのイベントは分析システムに送信できます。分析システムでイベント処理を設定するには、アカウントマネージャーに連絡するか、am@xsolla.comにメールを送信してください。
エクソラチームは、決済UIのウェブサイトへの統合を簡素化するウィジェットを作成しました。ウィジェットスクリプトはGitHubリポジトリにあります。
スクリプト初期化パラメータ:
パラメータ | 種類 | 説明文 |
---|---|---|
access_token | string | APIから受信したトークン。 必須。 |
sandbox | boolean | 決済処理をテストするには、true に設定します。sandbox-secure.xsolla.com がsecure.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 | boolean | true の場合、ライトボックスフレームを閉じることはできません。既定はfalse です。 |
lightbox.closeByClick | boolean | true の場合、オーバーレイをクリックするとライトボックスが閉じます。既定はtrue です。 |
lightbox.closeByKeyboard | boolean | true の場合、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/paystation4/?token=TOKEN
。
テストには次のURLを使用してください。https://sandbox-secure.xsolla.com/paystation4/?token=TOKEN
。
access_token
パラメータにはプライベートユーザーデータが含まれます。このパラメータを取得するときは、必ずサーバー間通信を使用してください。Iframe
Iframeで決済UIを開くには:
postMessage
メカニズムを実装して、決済UIからイベントを受け取ります。- リンク
https://sandbox-secure.xsolla.com/paystation4/?token=TOKEN
をたどって決済UIを開き、TOKEN
は受信したトークンです。
ウェブフックの設定
イベント(決済状況の変更など)に関する通知を受け取りたい場合は、パブリッシャーアカウントでウェブフックを設定します:
- パブリッシャーアカウントであなたのプロジェクトを開きます。
- サイドメニューでプロジェクト設定をクリックしてウェブフックに移動します。
- ウェブフックトグルをオンにします。
- ウェブフックURLを指定します。
- プロジェクトのウェブフックに署名するための秘密鍵は、デフォルトで生成されます。新しい秘密鍵を生成する場合は、更新アイコンをクリックします。
- 設定を保存するをクリックします。
次のウェブフックを実装することをお勧めします:
ウェブフックが受信されたことを確認するには、サーバーは次のように応答する必要があります:
- メッセージ本文なしでHTTPコード204。
- 指定されたユーザーが見つからないか、無効な署名が渡された場合、問題を記述したHTTPコード400が表示されます。
支払処理をテストする
支払い処理をテストするには、サンドボックスモードを使用します。サンドボックスモードは独立した環境で、実際の支払いと拒否された支払いを除き、ライブ環境のすべての機能をサポートします。サンドボックスモードにアクセスするには、トークンを取得する際に"mode":"sandbox"
を送信します。
サンドボックスモードでは、次の方法で支払いプロセスをテストできます:
銀行カード決済をテストする
- サンドボックスモードで決済インターフェースを開く。
- 決済方法のグループからクレジット/デビットカードを選択する。
- 銀行カードの詳細情報を入力。その他のフィールドに任意の値を入力。間違った情報(カード番号または有効期限)を入力して、エラーを生成することも可能です。
- 今すぐ支払うをクリックします。
カード情報に加えて、以下の条件のうち少なくともひとつに該当する場合は、郵便番号の指定が必要です:
- ユーザーの国は、米国またはカナダです。
- 銀行識別番号(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決済をテストする
テストPayPalアカウントを作成する
決済プロセスをテストするには、PayPalサンドボックスモードのアカウントを作成する必要があります:
- PayPal開発者ウェブサイトを開きます。
- アカウントにログインするか、新規に作成します。
- 「
Sandbox accounts 」タブに移動します。 - 「
Sandbox test accounts 」ページで、「Create account 」をクリックします。 - 「
Personal (Buyer Account) 」アカウントタイプを選択して国を選択します。 - 「
Create 」をクリックします。
作成されたアカウントは、サンドボックスのアカウントリストに表示されます。
また、既に作成されているサンドボックスのアカウント情報を利用することも可能です:
sb-xmxij16980134@business.example.com | oi9_m_KW |
sb-p7pju16979920@business.example.com | 7%%p8ioS |
テスト支払いを行う
- サンドボックスモードで決済UIを開きます。
- 「PayPal」の決済方法を選択します。
- 「
Mock Response Code 」フィールドで0
を入力するか、または空白にしてください。 - 「ZIPコード」フィールドでに任意の5桁を入力します。

- 「支払う」をクリックします。PayPalアカウントにログインするためのウィンドウにリダイレクトされます。
- サンドボックスアカウントに関する情報を入力します:「
Email ID 」はメールアドレスで、「System Generated Password 」はパスワードです。この情報を見つけるには:- 「PayPal開発者ウェブサイト」でアカウントにログインします。
- 「
Sandbox accounts 」タブに移動します。 Sandbox test accounts ページでサンドボックスアカウントを選択します。- •••をクリックしてドロップダウンリストから「アカウントを表示/編集する」を選択します。開いたモーダルウィンドウにデータが表示されます。
- テスト決済を完了します。
ライブに行く
上記の手順を完了すると、実際の支払いの受け取りを開始できます:
- エクソラとのライセンス契約に署名していることを確認してください。
- トークンを取得するときは、リクエスト本文から
"sandbox": true
パラメータを削除します。 - 次のリンクを使用して決済UIを開きます:
https://secure.xsolla.com/paystation4/?token=TOKEN
。
誤字脱字などのテキストエラーを見つけましたか? テキストを選択し、Ctrl+Enterを押します。