결제 UI 열기
프로젝트 인증 설정에 따라 다음과 같이 결제 UI를 열 수 있습니다.
- 애플리케이션에서 자체 인증 시스템을 사용하는 경우 토큰 API 호출 생성하기를 통해
- 프로젝트에서 엑솔라 로그인을 사용하는 경우 클라이언트 API 호출을 통해
토큰 생성하기 API 호출을 통해
- 토큰 가져오기를 구현하여 결제 UI를 여는 방법:
- 결제 UI 열기를 구현하는 방법:
결제 방법 선택 페이지 표시 사용
결제 UI를 열었을 때 결제 방법 선택 페이지가 표시되도록 설정하려면 선택한 플랜의 ID와 함께 purchase.subscription.plan_id 매개변수를 토큰 생성 API 호출로 전달합니다. 필요한 경우 추가 사용자 정의 매개변수를 전달합니다.
Copy
요청 예제:
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",
"hidden": true
},
"email": {
"value": "user1234@game1234.com"
},
"name": {
"value": "UserName",
"hidden": false
}
},
"settings": {
"project_id": 12345,
"currency": "USD"
},
"purchase": {
"subscription": {
"plan_id": "54321"
}
}
}'결제 방식 선택 페이지의 예시:
결제 데이터 입력 페이지 표시 사용
결제 UI가 열릴 때 결제 데이터 입력 페이지를 표시하도록 설정하려면 토큰 생성 API 호출로 다음 매개변수를 전달합니다.
- 선택한 플랜의 ID와
purchase.subscription.plan_id. - 결제 방식 ID가 있는
settings.payment_method입니다. 게시자 계정의 프로젝트에서 식별자 목록을 확인하려면 페이 스테이션 > 결제 방식 섹션으로 이동하거나 계정 관리자에게 요청합니다.
필요한 경우 사용자 정의용 추가 매개 변수를 전달합니다.
Copy
- curl
요청 예제:
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",
"hidden": true
},
"email": {
"value": "user1234@game1234.com"
},
"name": {
"value": "UserName",
"hidden": false
}
},
"settings": {
"project_id": 12345,
"payment_method": 1380,
"currency": "USD"
},
"purchase": {
"subscription": {
"plan_id": "54321"
}
}
}'결제 데이터 입력 페이지의 예시:
구독 관리 및 청구 계정 페이지 표시 사용
열렸을 때 구독과 결제 계정을 관리하는 페이지를 표시하도록 하려면 settings.ui.mode = user_account 매개변수를 토큰 생성하기 API 호출에 전달합니다.
Copy
요청 예제:
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",
"hidden": true
}
},
"settings": {
"project_id": 146026,
"language": "en",
"currency": "USD",
"ui": {
"mode": "user_account",
"theme": "default_dark",
"desktop": {
"subscription_list": {
"layout": "grid"
}
}
}
}
}구독 관리 페이지 및 청구 계정의 예시:
클라이언트 API 메소드를 통해
- 다음 방법 중 하나로 결제 UI를 여는 클라이언트 메소드 구현하기:
- 결제 UI 열기를 구현하는 방법:
결제 방식 선택 페이지를 표시하거나 결제 데이터를 입력
애플리케이션의 클라이언트 측에서 HTTP POST 요청을 사용하여 결제 UI 열기를 구현: https://subscriptions.xsolla.com/api/user/v1/projects/{project_id}/subscriptions/buy
요청에 Authorization: Bearer <client_user_jwt> 헤더를 포함해야 합니다. 여기서 <client_user_jwt>는 사용자의 JSON 웹 토큰(JWT)으로 Base64 표준에 따라 인코딩한 고유한 토큰입니다. 토큰을 받는 방법:
- 애플리케이션에서 로그인과 암호 인증을 사용하는 경우
Register new user 와Auth by username 을 사용합니다. - 애플리케이션에서 소셜 네트워크를 통한 인증을 사용하는 경우
Auth via social network API 호출을 사용합니다.
project ID를 프로젝트 경로 매개변수로 지정합니다. 이 매개 변수는 게시자 계정의 프로젝트 이름 옆에서 찾을 수 있습니다.
country를 쿼리 매개변수로 지정합니다. ISO 3166-1 alpha-2에 따라 사용자의 국가를 두 글자 코드로 지정합니다. 이러한 설정은 로케일과 통화 선택에 영향을 줍니다. 이 매개변수를 전달하지 않으면 사용자의 IP 주소로 국가를 결정합니다.
요청에서 전달해야 하는 매개변수:
plan_external_id는 결제 방식 선택 페이지에서 결제 인터페이스를 엽니다.
결제 UI의 예시:
plan_external_id와settings.payment_method는 결제 데이터 입력 페이지에서 결제 인터페이스를 엽니다.
결제 UI의 예시:
요청 본문 매개변수:
| 매개 변수 | 유형 | 설명 |
|---|---|---|
| string | 필수입니다. 구독 플랜의 외부 ID입니다. 게시자 계정 > 구독 > 구독 플랜 섹션에서 확인할 수 있습니다. |
| object | 사용자 지정 프로젝트 설정와 관련된 객체입니다. |
| object | 인터페이스 설정입니다(객체). |
| string | 결제 UI의 크기입니다. 가능한 크기:
|
| string | 결제 UI 테마. default 또는 default_dark일 수 있습니다. |
| string | 장치 유형입니다. desktop(기본값) 또는 mobile이 가능합니다. |
| object | 데스크톱 버전의 인터페이스 설정입니다(객체). |
| object | 헤더 설정 데이터와 관련된 값입니다. |
| boolean | 페이 스테이션 데스크톱에 닫기 버튼을 표시할지를 설정합니다. 이 버튼은 페이 스테이션을 종료하고 settings.return_url 매개 변수에 지정된 URL로 사용자를 리디렉션합니다. 기본값은 false입니다. |
| boolean | 결제 UI에 헤더가 표시되는지 여부를 나타냅니다. |
| string | 헤더의 외관입니다. compact(이 경우 게임 이름과 사용자 ID는 헤더에 표시하지 않음) 혹은 normal일 수 있습니다. |
| boolean | true일 경우, 로고가 헤더에 표시됩니다(먼저 계정 관리자에게 이미지 파일을 제공하세요). |
| boolean | 프로젝트 이름이 헤더에 표시되는지 여부를 나타냅니다. |
| string | 헤더를 표시하는 설정 방식입니다. compact(프로젝트 이름 및 사용자 ID 표지 안 함) 또는 normal (기본값)을 설정할 수 있습니다. |
| string | 사용자는 오직 저장된 결제 방법을 사용해서 결제할 수 있습니다. saved_accounts일 수 있습니다. |
| boolean | 모바일 버전의 결제 UI에서 바닥글을 표시하거나 숨길지 여부입니다. |
| boolean | 페이 스테이션 모바일에 닫기 버튼을 표시할지를 설정합니다. 이 버튼은 페이 스테이션을 종료하고 settings.return_url 매개 변수에 지정된 URL로 사용자를 리디렉션합니다. 기본값은 false입니다. |
| string | EULA의 링크입니다. |
| string | 페이 스테이션의 인터페이스 모드. user_account만 가능합니다. 헤더는 계정 탐색 메뉴만 포함할 수 있으며 사용자는 제품을 선택하거나 결제를 할 수 없습니다. 이 모드는 데스크톱에서만 사용 가능합니다. |
| object | 사용자 계정에 관한 데이터가 담긴 객체. |
| object | 기록의 하위 메뉴입니다. |
| integer | 결제 UI의 드롭다운 메뉴에 섹션을 표시할지 여부입니다. true 혹은 false일 수 있습니다. 매개변수를 전달하지 않으면 섹션이 표시되지 않습니다. |
| integer | 결제 인터페이스의 드롭다운 메뉴에서 섹션의 위치입니다. |
| object | 내 계정 페이지입니다. |
| integer | 결제 UI의 드롭다운 메뉴에서 섹션의 위치입니다. |
| boolean | 결제 UI의 드롭다운 메뉴에 섹션을 표시할지 여부입니다. true 혹은 false일 수 있습니다. 매개변수를 전달하지 않으면 섹션이 표시되지 않습니다. |
| object | 내 결제 계정 페이지입니다. |
| integer | 결제 UI의 드롭다운 메뉴에서 섹션의 위치입니다. |
| boolean | 하위 메뉴를 표시할지 여부입니다. true 혹은 false일 수 있습니다. 매개변수를 전달하지 않으면 섹션을 표시하지 않습니다. |
| object | 구독 관리 페이지입니다. |
| boolean | 하위 메뉴를 표시할지 여부입니다. true 혹은 false일 수 있습니다. 매개변수를 전달하지 않으면 섹션을 표시하지 않습니다. |
settings.ui.user_account.subscriptions.order | integer | 결제 UI의 드롭다운 메뉴에서 섹션의 위치입니다. |
| string | 선호하는 결제 통화입니다. 통화의 3자리 정의가 ISO 4217에 따라 사용됩니다. |
| string | 게임의 트랜잭션 ID 입니다. 각 사용자 결제별로 고유해야 합니다. |
| integer | 결제 방식 ID입니다. 결제 방식 ID 목록은 게시자 계정에서 또는 결제 방식 가져오기 API 호출을 사용하여 가져올 수 있습니다. |
| string | 결제 후 사용자를 리디렉션하는 페이지입니다. 매개 변수 user_id, foreigninvoice, invoice_id, status가 링크에 자동으로 추가됩니다. |
| object | 리디렉션 정책 설정입니다(객체). |
| string | 결제 후 사용자를 반환 URL로 리디렉션하는 결제 상태입니다. none, successful, successful_or_canceled 혹은 any일 수 있습니다. |
settings.redirect_policy.delay | integer | 사용자가 복귀 URL로 자동 재지정된 이후 지연 시간(초). |
| string | 결제 후 사용자를 반환 URL로 리디렉션하는 결제 상태입니다. none, successful, successful_or_canceled 혹은 any일 수 있습니다. |
| string | 수동 리디렉션 버튼 텍스트입니다. |
필요한 경우 사용자 정의용 추가 매개변수를 전달하세요.
Copy
요청 예제:
curl -X 'POST' \
'https://subscriptions.xsolla.com/api/user/v1/projects/{project_id}/subscriptions/buy?country=RU ' \
-H 'accept: application/json' \
-H 'Authorization: Bearer client_user_jwt'
{
"plan_external_id": "PlanExternalId",
"settings": {
"ui": {
"size": "large",
"theme": "string",
"version": "desktop",
"desktop": {
"header": {
"is_visible": true,
"visible_logo": true,
"visible_name": true,
"type": "compact",
"close_button": true
}
},
"mobile": {
"mode": "saved_accounts",
"footer": {
"is_visible": true
},
"header": {
"close_button": true
}
},
"license_url": "string",
"mode": "user_account",
"user_account": {
"history": {
"enable": true,
"order": 1
},
"payment_accounts": {
"enable": true,
"order": 1
},
"info": {
"enable": true,
"order": 1
},
"subscriptions": {
"enable": true,
"order": 1
}
}
},
"currency": "string",
"locale": "string",
"external_id": "string",
"payment_method": 1,
"return_url": "string",
"redirect_policy": {
"redirect_conditions": "none",
"delay": 0,
"status_for_manual_redirection": "none",
"redirect_button_caption": "string"
}
}
}Copy
응답 예시:
{
"link_to_ps": "https://secure.xsolla.com/paystation2/?access_token=<access_token>"
}구독 관리 페이지 및 청구 계정 표시 사용
애플리케이션의 클라이언트 측에서 HTTP POST 요청을 사용하여 결제 UI 열기를 구현: https://subscriptions.xsolla.com/api/user/v1/projects/{project_id}/subscriptions/manage.
요청에 Authorization: Bearer <client_user_jwt> 헤더를 포함해야 합니다. 여기서 <client_user_jwt>는 사용자의 JSON 웹 토큰(JWT)으로 Base64 표준에 따라 인코딩한 고유한 토큰입니다. 토큰을 받는 방법:
- 애플리케이션에서 로그인과 암호 인증을 사용하는 경우
Register new user 와Auth by username 을 사용합니다. - 애플리케이션에서 소셜 네트워크를 통한 인증을 사용하는 경우
Auth via social network API 호출을 사용합니다.
project ID를 프로젝트 경로 매개변수로 지정합니다. 이 매개 변수는 게시자 계정의 프로젝트 이름 옆에서 찾을 수 있습니다.
country를 쿼리 매개변수로 지정합니다. ISO 3166-1 alpha-2에 따라 사용자의 국가를 두 글자 코드로 지정합니다. 이러한 설정은 로케일과 통화 선택에 영향을 줍니다. 이 매개변수를 전달하지 않으면 사용자의 IP 주소로 국가를 결정합니다.
필요한 경우 사용자 정의용 추가 매개변수를 전달하세요.
요청 본문 매개변수:
| 매개 변수 | 유형 | 설명 |
|---|---|---|
| string | 필수입니다. 구독 플랜의 외부 ID입니다. 게시자 계정 > 구독 > 구독 플랜 섹션에서 확인할 수 있습니다. |
| object | 사용자 지정 프로젝트 설정와 관련된 객체입니다. |
| object | 인터페이스 설정입니다(객체). |
| string | 결제 UI의 크기입니다. 가능한 크기:
|
| string | 결제 UI 테마. default 또는 default_dark일 수 있습니다. |
| string | 장치 유형입니다. desktop(기본값) 또는 mobile이 가능합니다. |
| object | 데스크톱 버전의 인터페이스 설정입니다(객체). |
| object | 헤더 설정 데이터와 관련된 값입니다. |
| boolean | 페이 스테이션 데스크톱에 닫기 버튼을 표시할지를 설정합니다. 이 버튼은 페이 스테이션을 종료하고 settings.return_url 매개 변수에 지정된 URL로 사용자를 리디렉션합니다. 기본값은 false입니다. |
| boolean | 결제 UI에 헤더가 표시되는지 여부를 나타냅니다. |
| string | 헤더의 외관입니다. compact(이 경우 게임 이름과 사용자 ID는 헤더에 표시하지 않음) 혹은 normal일 수 있습니다. |
| boolean | true일 경우, 로고가 헤더에 표시됩니다(먼저 계정 관리자에게 이미지 파일을 제공하세요). |
| boolean | 프로젝트 이름이 헤더에 표시되는지 여부를 나타냅니다. |
| string | 헤더를 표시하는 설정 방식입니다. compact(프로젝트 이름 및 사용자 ID 표지 안 함) 또는 normal (기본값)을 설정할 수 있습니다. |
| string | 사용자는 오직 저장된 결제 방법을 사용해서 결제할 수 있습니다. saved_accounts일 수 있습니다. |
| boolean | 모바일 버전의 결제 UI에서 바닥글을 표시하거나 숨길지 여부입니다. |
| boolean | 페이 스테이션 모바일에 닫기 버튼을 표시할지를 설정합니다. 이 버튼은 페이 스테이션을 종료하고 settings.return_url 매개 변수에 지정된 URL로 사용자를 리디렉션합니다. 기본값은 false입니다. |
| string | EULA의 링크입니다. |
| string | 페이 스테이션의 인터페이스 모드. user_account만 가능합니다. 헤더는 계정 탐색 메뉴만 포함할 수 있으며 사용자는 제품을 선택하거나 결제를 할 수 없습니다. 이 모드는 데스크톱에서만 사용 가능합니다. |
| object | 사용자 계정에 관한 데이터가 담긴 객체. |
| object | 기록의 하위 메뉴입니다. |
| integer | 결제 UI의 드롭다운 메뉴에 섹션을 표시할지 여부입니다. true 혹은 false일 수 있습니다. 매개변수를 전달하지 않으면 섹션이 표시되지 않습니다. |
| integer | 결제 인터페이스의 드롭다운 메뉴에서 섹션의 위치입니다. |
| object | 내 계정 페이지입니다. |
| integer | 결제 UI의 드롭다운 메뉴에서 섹션의 위치입니다. |
| boolean | 결제 UI의 드롭다운 메뉴에 섹션을 표시할지 여부입니다. true 혹은 false일 수 있습니다. 매개변수를 전달하지 않으면 섹션이 표시되지 않습니다. |
| object | 내 결제 계정 페이지입니다. |
| integer | 결제 UI의 드롭다운 메뉴에서 섹션의 위치입니다. |
| boolean | 하위 메뉴를 표시할지 여부입니다. true 혹은 false일 수 있습니다. 매개변수를 전달하지 않으면 섹션을 표시하지 않습니다. |
| object | 구독 관리 페이지입니다. |
| boolean | 하위 메뉴를 표시할지 여부입니다. true 혹은 false일 수 있습니다. 매개변수를 전달하지 않으면 섹션을 표시하지 않습니다. |
settings.ui.user_account.subscriptions.order | integer | 결제 UI의 드롭다운 메뉴에서 섹션의 위치입니다. |
| string | 선호하는 결제 통화입니다. 통화의 3자리 정의가 ISO 4217에 따라 사용됩니다. |
| string | 게임의 트랜잭션 ID 입니다. 각 사용자 결제별로 고유해야 합니다. |
| integer | 결제 방식 ID입니다. 결제 방식 ID 목록은 게시자 계정에서 또는 결제 방식 가져오기 API 호출을 사용하여 가져올 수 있습니다. |
| string | 결제 후 사용자를 리디렉션하는 페이지입니다. 매개 변수 user_id, foreigninvoice, invoice_id, status가 링크에 자동으로 추가됩니다. |
| object | 리디렉션 정책 설정입니다(객체). |
| string | 결제 후 사용자를 반환 URL로 리디렉션하는 결제 상태입니다. none, successful, successful_or_canceled 혹은 any일 수 있습니다. |
settings.redirect_policy.delay | integer | 사용자가 복귀 URL로 자동 재지정된 이후 지연 시간(초). |
| string | 결제 후 사용자를 반환 URL로 리디렉션하는 결제 상태입니다. none, successful, successful_or_canceled 혹은 any일 수 있습니다. |
| string | 수동 리디렉션 버튼 텍스트입니다. |
필요한 경우 사용자 정의용 추가 매개변수를 전달하세요.
Copy
요청 예제:
curl -X 'POST' \
'https://subscriptions.xsolla.com/api/user/v1/projects/{project_id}/subscriptions/manage?country=RU ' \
-H 'accept: application/json' \
-H 'Authorization: Bearer client_user_jwt'
{
"settings": {
"ui": {
"size": "large",
"theme": "string",
"version": "desktop",
"desktop": {
"header": {
"is_visible": true,
"visible_logo": true,
"visible_name": true,
"type": "compact",
"close_button": true
}
},
"mobile": {
"mode": "saved_accounts",
"footer": {
"is_visible": true
},
"header": {
"close_button": true
}
},
"license_url": "string",
"mode": "user_account",
"user_account": {
"history": {
"enable": true,
"order": 1
},
"payment_accounts": {
"enable": true,
"order": 1
},
"info": {
"enable": true,
"order": 1
},
"subscriptions": {
"enable": true,
"order": 1
}
}
},
"currency": "str",
"locale": "st",
"external_id": "string",
"payment_method": 1,
"return_url": "string",
"redirect_policy": {
"redirect_conditions": "none",
"delay": 0,
"status_for_manual_redirection": "none",
"redirect_button_caption": "string"
}
}
}Copy
응답 예시:
{
"link_to_ps": "https://secure.xsolla.com/paystation2/?access_token=<access_token>"
}결제 UI의 예시:
사용자 정의
결제 UI에서 다음 사용자 정의 옵션을 사용할 수 있습니다.
settings.ui.theme = default_dark매개변수를 토큰 생성 API 호출 혹은 결제 인터페이스를 여는 클라이언트 메서드로 전달하여 표준 라이트 인터페이스 테마를 다크 테마로 변경할 수 있습니다. 이 매개변수를 전달하지 않으면 기본값으로 라이트 인터페이스를 사용합니다.
다크 테마의 결제 UI 예시:
다크 테마 토큰 요청 예시:
Copy
- curl
요청 예제:
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",
"hidden": true
},
"email": {
"value": "user1234@game1234.com"
},
"name": {
"value": "UserName",
"hidden": false
}
},
"settings": {
"project_id": 12345,
"currency": "USD"
"ui": {
"theme": "default_dark"
}
}
}
'- 플랜 섹션의 자체 설명을 배치합니다. 이렇게 하려면
ui.desktop.subscription_list.description매개변수의 토큰 생성 API 호출로 설명 텍스트를 전달합니다.
주의
이 유형의 사용자 정의는 클라이언트 메소드를 구현할 때 사용할 수 없습니다.
결제 UI의 예시:
구독 관리 섹션과 플랜 섹션 설명이 있는 라이트 테마에 대한 토큰 요청의 예시:
Copy
- curl
요청 예제:
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",
"hidden": true
},
"email": {
"value": "user1234@game1234.com"
},
"name": {
"value": "UserName",
"hidden": false
}
},
"settings": {
"project_id": 12345,
"currency": "USD",
"ui": {
"desktop": {
"subscription_list": {
"description": "Your Description"
}
},
"user_account": {
"subscriptions": {
"order": 1,
"enable": true
}
}
}
}
}
'- 표준 구독 목록 보기를 블록 형식의 대체 보기 유형으로 변경합니다. 이렇게 하려면
settings.ui.desktop.subscription_list.layout = grid매개변수를 토큰 생성 API 호출로 전달합니다. 매개변수는 기본값으로list값을 사용합니다.
주의
이 유형의 사용자 정의는 클라이언트 메소드를 구현할 때 사용할 수 없습니다.
결제 UI의 예시:
대체 구독 목록 보기에 대한 토큰 요청의 예시:
Copy
요청 예제:
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",
"hidden": true
},
"email": {
"value": "user1234@game1234.com"
},
"name": {
"value": "UserName",
"hidden": false
}
},
"settings": {
"project_id": 111111,
"currency": "USD",
"ui": {
"desktop": {
"subscription_list": {
"layout": "grid"
}
}
}
}
}
'페이 스테이션을 사용자 정의하는 방법 가이드에서 여기에 사용하는 사용자 정의 설정과 매개변수에 대한 자세한 정보를 확인할 수 있습니다.
페이 스테이션 임베드 사용
예시: 동기화 스크립트 로딩
Copy
- 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>페이 스테이션 임베드는 postMessage를 통해 결제 UI에서 이벤트를 받도록 해줍니다. 이러한 이벤트를 분석 시스템으로 보낼 수 있습니다. 분석 시스템에 이벤트 처리 기능을 설정하려면, 계정 관리자에게 연락하거나 am@xsolla.com로 메일을 보내 주세요.
엑솔라 팀에서 웹사이트와의 결제 UI 통합을 간소화하는 위젯을 만들었습니다. 위젯 스크립트는 GitHub 리포지토리에서 사용할 수 있습니다.
스크립트 초기화 매개 변수 목록:
| 매개 변수 | 유형 | 설명 |
|---|---|---|
access_token | string | 토큰. API에 의해 수신됩니다. 필수. |
sandbox | boolean | true를 설정하여 결제 프로세스를 테스트합니다. sandbox-secure.xsolla.com이 secure.xsolla.com 대신 사용됩니다. |
lightbox | object | 옵션 목록 관련 객체로서, Lightbox 열기에 사용할 수 있습니다(PC 버전). |
lightbox.width | string | Lightbox 프레임 높이입니다. null인 경우, 페이 스테이션 높이에 따라 달라집니다. 기본값은 null입니다. |
lightbox.height | string | Lightbox 프레임 높이입니다.null인 경우, 페이 스테이션 높이에 따라 달라집니다. 기본값은 100%입니다. |
lightbox.zIndex | integer | 속성에 의해 수직 스태킹 순서가 제어됩니다. 기본값은 1000입니다. |
lightbox.overlayOpacity | integer | 오버레이의 불투명도(0~1)입니다. 기본값은 .6입니다. |
lightbox.overlayBackground | string | 오버레이의 배경입니다. 기본 값은 #000000입니다. |
lightbox.modal | boolean | true인 경우 Lightbox 프레임을 닫을 수 없습니다. 기본값은 false입니다. |
lightbox.closeByClick | boolean | true인 경우 오버레이를 클릭하면 Lightbox가 닫힙니다. 기본값은 true입니다. |
lightbox.closeByKeyboard | boolean | true인 경우 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을 사용합니다. 여기서 ACCESS_TOKEN은 토큰 생성하기 메소드로 얻은 토큰입니다. 결제 인터페이스를 여는 클라이언트 메소드를 구현할 때 이미 만들어진 링크를 가져올 수도 있습니다.
알림
지불 UI를 여는 경우에만 https:// 형식의 링크를 사용해야 합니다.
테스트 목적을 위해 다음 URL을 사용하십시오 https://sandbox-secure.xsolla.com/paystation3/?access_token=ACCESS_TOKEN.
주의
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을 사용합니다.
진행률
오자 또는 기타 텍스트 오류를 찾으셨나요? 텍스트를 선택하고 컨트롤+엔터를 누르세요.
