결제 솔루션 통합

추천을 추적하고 협력자에게 비용을 지급하려면 먼저 엑솔라 페이 스테이션을 통합해야 합니다. 요구 사항:

  1. 페이 스테이션이 성능 최적화 방문 페이지에서 통합되었습니다.
  2. 페이 스테이션은 파트너 네트워크 프로그램을 통해 트래픽을 사용하는 게임 방문 페이지에서 사용하는 유일한 결제 방법입니다.

토큰 가져오기

Note
권한 있는 사용자가 귀하의 웹사이트에서 구매할 것이면 토큰 가져오기를 구현하십시오. 권한이 없는 사용자에게 판매하려고 계획하고 있는 경우 Buy Button 상품을 연결하십시오.

결제 UI와 통합할 토큰을 입수해야 합니다. 액세스 토큰은 게임, 사용자 및 구매 매개변수를 식별하는 문자열입니다.

엑솔라 API는 기본 액세스 인증을 사용합니다. 판매자 ID를 사용자 이름으로 지정하고 API 키를 암호로 지정합니다.

토큰 검색 URL:

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

결제 UI에 전달하려는 매개 변수를 포함하여 HTTP POST 요청을 변경할 수 있습니다. 토큰 생성 메소드의 user.id, user.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를 열 수 있는 세 가지 방법:

Note
샌드박스 모드에서 결제 UI를 열려면 다음 URL을 사용합니다 https://sandbox-secure.xsolla.com/.

Pay Station Embed

Notice
이 방식의 결제 UI 열기는 게임 키 판매를 지원하지 않습니다. 게임 키를 판매하려면 다음 지침을 따르세요.

예시: 동기화 스크립트 로딩

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에서 이벤트를 받도록 해줍니다. 이러한 이벤트를 분석 시스템으로 보낼 수 있습니다. 분석 시스템에 이벤트 처리 기능을 설정하려면, 계정 관리자에게 연락하거나 am@xsolla.com로 메일을 보내 주세요.

스크립트는 저희 CDN에 위치해 있으며 이곳 에서 구할 수 있습니다. 스크립트를 개발자 웹 사이트와 연동하려면 이 URL을 사용하십시오. 자세한 내용을 알아보려면 Github 저장소 를 확인해 보십시오.

스크립트 초기화 파라미터 목록:

파라미터유형설명
access_token
string토큰. API에 의해 수신됩니다. 필수.
sandbox
booleanTrue로 설정하여 결제 프로세스를 테스트합니다. sandbox-secure.xsolla.comsecure.xsolla.com 대신 사용됩니다.
lightbox
object옵션 목록 관련 객체로서, Lightbox 열기에 사용할 수 있습니다(PC 버전)
lightbox.width
stringLightbox 프레임의 너비입니다. null인 경우, 페이 스테이션 너비에 따라 달라집니다. 기본값은 null입니다.
lightbox.height
stringLightbox 프레임 높이입니다. null인 경우, 페이 스테이션 높이에 따라 달라집니다. 기본값은 100%입니다.
lightbox.zIndex
integer속성에 의해 수직 스태킹 순서가 제어됩니다. 기본값은 1000입니다.
lightbox.overlayOpacity
integer오버레이의 불투명도(0~1)입니다. 기본값은 .6입니다.
lightbox.overlayBackground
string오버레이의 배경입니다. 기본 값은 #000000입니다.
lightbox.modal
booleantrue인 경우 Lightbox 프레임을 닫을 수 없습니다. 기본값은 false입니다.
lightbox.closeByClick
booleantrue인 경우 오버레이를 클릭하면 Lightbox가 닫힙니다. 기본값은 true입니다.
lightbox.closeByKeyboard
booleantrue인 경우 ESC 키를 누르면 Lightbox가 닫힙니다. 기본값은 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입니다.

결제 인터페이스 관련하여 발생하는 이벤트는 스크립트를 통해 추적할 수 있습니다. 인터페이스 이벤트 유형에 따라 다양한 작업을 웹 페이지에서 수행할 수 있습니다.

이벤트 목록:

파라미터설명
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_TOKEN, 여기에서 ACCESS_TOKEN은 이전 단계에서 입수한 토큰입니다. 테스트 목적으로 다음 URL을 사용합니다. https://sandbox-secure.xsolla.com/paystation3/?access_token=ACCESS_TOKEN

새 창

새 창에서 결제 UI를 열려면 다음 링크를 사용합니다. https://secure.xsolla.com/paystation3/?access_token=ACCESS_TOKEN, 여기에서 ACCESS_TOKEN은 이전 단계에서 입수한 토큰입니다. 테스트 목적으로 다음 URL을 사용하십시오. https://sandbox-secure.xsolla.com/paystation3/?access_token=ACCESS_TOKEN.

웹훅 설정

페이 스테이션의 경우 다음과 같은 웹훅을 구현해야 합니다.
Webhook 목록
예시를 포함해 웹훅에 대해 더 자세히 알아봅니다.

메시지 본문 없이 HTTP 코드 204로 응답하여 웹훅을 수신하였음을 확인합니다.

웹훅 핸들러를 테스트하려면 프로젝트 설정 > 웹훅 섹션을 여십시오.

Note
웹훅을 설정한 후, 페이 스테이션 설정을 열고 체크아웃켜짐으로 설정합니다.

결제 처리 테스트

결제 프로세스를 테스트하려면

  • 샌드박스.
  • 를 사용하여 실제로 지불하고 게시자 계정을 통해 환불을 시작할 수 있습니다.

엑솔라 샌드박스는 실제 결제를 제외한 결제 프로세스 관련 모든 기능을 지원하는 독립형 환경입니다. "mode":"sandbox"를 전송하여 샌드박스에 액세스할 수 있습니다(토큰 입수 시 가능).

은행 카드 결제 테스트 방법:
  1. 샌드박스 모드로 결제 UI를 엽니다.
  2. 결제 방식에서 신용/직불 카드 그룹을 선택합니다.
  3. 은행 카드 세부 정보를 입력합니다. 나머지 필드에 값을 입력합니다. 오류를 확인하기 위해 잘못된 세부 정보(카드 번호, 만료일, CVV)를 입력할 수도 있습니다.
테스트 카드 목록
테스트 은행 카드 목록을 봅니다.
Note

사용자의 국가가 미국이나 캐나다라면 카드 세부 정보뿐만 아니라 우편 번호도 명시해야 합니다. 유효한 우편 코드(예: 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.

Notice
실제 결제 금액을 수령하려면 우선 "mode":"sandbox"를 제거하십시오.

실제 지불을 통해 결제 프로세스를 테스트하려면 다음과 같은 방법으로 은행 카드를 사용하는 것이 좋습니다.

  1. 결제 UI를 엽니다.
  2. 결제 방법으로 신용 카드/직불 카드를 선택합니다.
  3. 유효한 은행 카드 세부 정보를 입력합니다.
  4. 결제를 완료한 후, 게시자 계정의 거래 검색 섹션으로 이동하십시오.
  5. 테스트 거래를 선택하고 환불을 누르십시오(거래가 완료된 상태에서 수행해야 함).

Note
결제 프로세스를 테스트하려면 Visa 및 MasterCard 카드 사용을 권장합니다.

구동

실제 결제 처리를 시작하는 방법:

  1. 엑솔라와 계약했음을 확인합니다.
  2. secure.xsolla.com 링크로 페이 스테이션을 엽니다. 또는 샌드박스-secure.xsolla.comsecure.xsolla.com페이 스테이션 임베드 스크립트에서 변경합니다.
  3. "mode":"sandbox"토큰 가져오기를 할 때 제거합니다.

진행률
의견을 보내 주셔서 감사드립니다!
마지막 업데이트: 2021년 7월 5일

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

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