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

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

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

トークンを取得する

決済UIを開くには、トークンを取得する必要があります。トークンとは、ゲームとユーザーに関する暗号化されたデータを含む文字列です。トークンを取得してユーザーを識別し、購入を許可するように実装する必要があります。

アプリケーションのバックエンドで、ユーザー認証トークンの取得を実装します。これを行うには、基本的なHTTP認証を含むHTTP POSTリクエストを使用し、リクエスト本文で必要なパラメータを渡します。

APIリファレンス
パラメータの全リストを参照してください。

トークンの有効期限は、最後にエクソーラ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インターフェース言語。

ユーザー認証トークンを取得するためのリクエスト例

Copy
Full screen
Small screen

    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>"
          }
        }
      }'

    応答で受け取ったユーザー認証トークンの例

    Copy
    Full screen
    Small screen

      {
          "token": "1230OWrp0KF6uqvmN8jWuzLyoXMzxTyK_lc_en"
      }

      決済UIを開く

      お知らせ

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

      サンドボックスモードで決済インターフェースを開くには、次のURLを使用してください:https://sandbox-secure.xsolla.com/paystation4/?token=ACCESS_TOKENACCESS_TOKEN前のステップで入手したトークンです。

      新しいウィンドウ

      決済UIを新しいウィンドウで開くには、以下のURLをご利用ください:https://sandbox-secure.xsolla.com/paystation4/?token=TOKENTOKENは取得したトークンです。

      お知らせ
      サンドボックスモードで決済UIを開くには、上記のリンクを使用します。プロジェクト起動後は、こちらのURLをご利用ください:https://secure.xsolla.com/paystation4/?token=TOKEN

      また、他のオプションを使って決済UIを開くこともできます:

      • Pay Station Embedを利用します。制限:ゲーム内ブラウザ(WebView)で開くと不具合が発生する場合があります。
      • iframe。制限:をゲーム内ブラウザ(WebView)やモバイル版アプリケーションで開くと、不具合が発生する場合があります。

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

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

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

      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>

      Pay Station Embedを使用すると、postMessage経由で決済UIからイベントを取得できます。これらのイベントは分析システムに送信できます。分析システムでイベント処理を設定するには、アカウントマネージャーに連絡するか、am@xsolla.comにメールを送信してください。

      エクソラチームは、決済UIのウェブサイトへの統合を簡素化するウィジェットを作成しました。ウィジェットスクリプトは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/paystation4/?token=TOKEN

      お知らせ
      https://のプレフィックスが付いたリンクは、決済画面を開くときにのみ使用する必要があります。

      テストには次のURLを使用してください。https://sandbox-secure.xsolla.com/paystation4/?token=TOKEN

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

      Iframe

      Iframeで決済UIを開くには:

      1. postMessageメカニズムを実装して、決済UIからイベントを受け取ります。
      2. リンクhttps://sandbox-secure.xsolla.com/paystation4/?token=TOKENをたどって決済UIを開き、TOKEN は受信したトークンです。

      ウェブフックの設定

      イベント(決済状況の変更など)に関する通知を受け取りたい場合は、パブリッシャーアカウントでウェブフックを設定します:

      1. パブリッシャーアカウントであなたのプロジェクトを開きます。
      2. サイドメニューでプロジェクト設定をクリックしてウェブフックに移動します。
      3. ウェブフックトグルをオンにします。
      4. ウェブフックURLを指定します。
      5. プロジェクトのウェブフックに署名するための秘密鍵は、デフォルトで生成されます。新しい秘密鍵を生成する場合は、更新アイコンをクリックします。
      6. 設定を保存するをクリックします。

      次のウェブフックを実装することをお勧めします:

      ウェブフックが受信されたことを確認するには、サーバーは次のように応答する必要があります:

      • メッセージ本文なしでHTTPコード204。
      • 指定されたユーザーが見つからないか、無効な署名が渡された場合、問題を記述したHTTPコード400が表示されます。

      お知らせ
      ウェブフックの詳細については、APIリファレンスを参照してください。

      支払処理をテストする

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

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

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

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

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

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

      • ユーザーの国は、米国またはカナダです。
      • 銀行識別番号(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。

      注意
      1回限りの購入と保存されたカードのテストに使用できるすべてのシナリオの説明を参照してください。

      PayPal決済をテストする

      テストPayPalアカウントを作成する

      決済プロセスをテストするには、PayPalサンドボックスモードのアカウントを作成する必要があります:

      1. PayPal開発者ウェブサイトを開きます。
      2. アカウントにログインするか、新規に作成します。
      3. Sandbox accounts」タブに移動します。
      4. Sandbox test accounts」ページで、「Create account」をクリックします。
      5. Personal (Buyer Account)」アカウントタイプを選択して国を選択します。
      6. Create」をクリックします。

      作成されたアカウントは、サンドボックスのアカウントリストに表示されます。

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

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

      テスト支払いを行う

      1. サンドボックスモードで決済UIを開きます。
      2. PayPal」の決済方法を選択します。
      3. Mock Response Code」フィールドで0を入力するか、または空白にしてください。
      4. ZIPコード」フィールドでに任意の5桁を入力します。

      1. 支払う」をクリックします。PayPalアカウントにログインするためのウィンドウにリダイレクトされます。
      2. サンドボックスアカウントに関する情報を入力します:「Email ID」はメールアドレスで、「System Generated Password」はパスワードです。この情報を見つけるには:
        1. PayPal開発者ウェブサイト」でアカウントにログインします。
        2. Sandbox accounts」タブに移動します。
        3. Sandbox test accountsページでサンドボックスアカウントを選択します。
        4. •••をクリックしてドロップダウンリストから「アカウントを表示/編集する」を選択します。開いたモーダルウィンドウにデータが表示されます。
      3. テスト決済を完了します。

      注意
      1回限りの購入と保存されたPayPalアカウントのテストに使用できるすべてのシナリオの説明を参照してください。

      ライブに行く

      上記の手順を完了すると、実際の支払いの受け取りを開始できます:

      1. エクソラとのライセンス契約に署名していることを確認してください。
      2. トークンを取得するときは、リクエスト本文から"sandbox": trueパラメータを削除します。
      3. 次のリンクを使用して決済UIを開きます:https://secure.xsolla.com/paystation4/?token=TOKEN

      注意
      最初の実際の支払いが行われた後、厳格なサンドボックス支払いポリシーが有効になります。サンドボックスモードでの支払いは、パブリッシャーアカウントでの会社設定 > ユーザーセクションで指定されたユーザーのみが利用できます。
      進捗状況
      ご意見ありがとうございました!
      最終更新日: 2021年7月5日

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

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