카탈로그 UI 생성하기

카탈로그 UI를 생성하는 3가지 방법:

자체 인터페이스 사용하기

자체 인터페이스에서 디렉터리를 사용할 경우 사용 가능:

알림
SDK 라이브러리를 사용하여 자체 인터페이스에서 카탈로그를 구현할 수도 있습니다. 이미 만들어진 라이브러리는 엑솔라 API 작업에 즉시 사용 가능한 데이터 구조 및 방법을 제공하기에 엑솔라 제품과 프로젝트를 쉽게 통합할 수 있습니다.

엑솔라 로그인 및 클라이언트 측 API 호출

카탈로그를 구현하는 방법:
  1. 클라이언트 메소드를 사용하여 정기 결제 플랜 목록 가져오기:
  2. 인터페이스에서 수신한 플랜 목록 표시를 구현합니다.

제품별로 정기 결제 플랜을 가져오는 클라이언트 측 메소드

애플리케이션의 클라이언트 측에서 HTTP GET 요청을 사용하여 플랜 목록 가져오기를 구현하는 방법: https://subscriptions.xsolla.com​/api/user/v1/projects/{project_id}/products/{​​productId}/plans를 사용합니다.

요청에 Authorization: Bearer <client_user_jwt> 헤더를 포함해야 합니다. 여기서 <client_user_jwt>는 사용자의 JSON 웹 토큰(JWT)으로 Base64 표준에 따라 인코딩한 고유한 토큰입니다. 토큰을 받는 방법:

경로 매개변수로 지정하기:
  • projectId - 프로젝트 ID입니다. 이 매개 변수는 관리자 페이지의 프로젝트 이름 옆에서 확인할 수 있습니다.

  • productID - 구독 기반 제품 ID입니다. 이 ID를 가져오려면 고객 성공 매니저에게 문의하거나 csm@xsolla.com으로 이메일을 보내주세요.

쿼리 매개변수로 지정하기:
매개 변수유형설명
plan_id
array of integers요금제 ID입니다.
plan_external_id
array of strings플랜의 외부 ID입니다. 정기 결제 > 구독 플랜 > 내 플랜 섹션의 관리자 페이지이나 플랜 가져오기 API 호출을 통해 확인할 수 있습니다.
limit
integer페이지 요소 개수 한도입니다. 기본적으로 15개의 아이템이 표시됩니다.
offset
integer목록이 생성된 요소의 개수입니다. 개수는 기본적으로 0부터 세기 시작합니다.
locale
string두 글자 소문자로된 인터페이스 언어. ISO 639-1 값 허용. 이 매개 변수가 전달되지 않으면 사용자의 IP 주소에 따라 언어가 결정됩니다.
사용 가능한 값:
  • en - 영
  • ar - 아랍어
  • bg - 불가리아어
  • cn - 중국어(간체)
  • cs - 체코어
  • de - 독일어
  • es - 스페인어
  • fr - 프랑스어
  • he - 히브리어
  • it - 이탈리어아
  • ja - 일본어
  • ko - 한국어
  • pl - 폴란드어
  • pt - 포트투갈어
  • ro - 루마니아어
  • ru - 러시아어
  • th - 태국어
  • tr - 터키어
  • tw - 중국어(번체)
  • vi - 베트남어
엑솔라 목록에 없는 로케일을 전달하면 영어 로케일이 사용됩니다.
country
stringISO 3166-1 alpha-2에 따라 사용자의 국가를 식별하는 데 사용하는 두 글자 코드입니다. 이 매개변수는 로케일 및 통화 선택에 영향을 미칩니다. 이 매개변수를 전달하지 않으면 사용자의 IP 주소로 국가를 결정합니다.
Copy
Full screen
Small screen
  • curl
curl -X 'GET' \
'https://subscriptions.xsolla.com/api/user/v1/projects/{project_id}/products/{​​productId}/plans?country=RU  ' \
  -H 'accept: application/json' \
  -H 'Authorization: Bearer client_user_jwt'
Copy
Full screen
Small screen
  • javascript
{
  "items": [
    {
      "plan_id": 54321,
      "plan_external_id": "PlanExternalId",
      "plan_group_id": "TestGroupId",
      "plan_type": "all",
      "plan_name": "Localized plan name",
      "plan_description": "Localized plan description",
      "plan_start_date": "2021-04-11T13:51:02+03:00",
      "plan_end_date": "2031-04-11T13:51:02+03:00",
      "trial_period": 7,
      "period": {
        "value": 1,
        "unit": "month"
      },
      "charge": {
        "amount": 4.99,
        "setup_fee": 0.99,
        "currency": "USD"
      },
      "promotion": {
        "promotion_charge_amount": 3.99,
        "promotion_remaining_charges": 3
      }
    }
  ],
  "has_more": false
}

플랜 목록을 가져오는 클라이언트 측 메소드

애플리케이션의 클라이언트 측에서 HTTP GET 요청을 사용하여 플랜 목록 가져오기를 구현하는 방법: https://subscriptions.xsolla.com​/api/user/v1/projects/{project_id}/plans를 사용합니다.

요청에 Authorization: Bearer <client_user_jwt> 헤더를 포함해야 합니다. 여기서 <client_user_jwt>는 사용자의 JSON 웹 토큰(JWT)으로 Base64 표준에 따라 인코딩한 고유한 토큰입니다. 토큰을 받는 방법:

프로젝트 ID를 projectId 경로 매개변수로 지정합니다. 이 매개 변수는 관리자 페이지의 프로젝트 이름 옆에서 찾을 수 있습니다.

쿼리 매개변수로 지정하기:

매개 변수유형설명
plan_id
array of integers요금제 ID입니다.
plan_external_id
array of strings플랜의 외부 ID입니다. 정기 결제 > 구독 플랜 > 내 플랜 섹션의 관리자 페이지이나 플랜 가져오기 API 호출을 통해 확인할 수 있습니다.
limit
integer페이지 요소 개수 한도입니다. 기본적으로 15개의 아이템이 표시됩니다.
offset
integer목록이 생성된 요소의 개수입니다. 개수는 기본적으로 0부터 세기 시작합니다.
locale
string두 글자 소문자로된 인터페이스 언어. ISO 639-1 값 허용. 이 매개 변수가 전달되지 않으면 사용자의 IP 주소에 따라 언어가 결정됩니다.
사용 가능한 값:
  • en - 영
  • ar - 아랍어
  • bg - 불가리아어
  • cn - 중국어(간체)
  • cs - 체코어
  • de - 독일어
  • es - 스페인어
  • fr - 프랑스어
  • he - 히브리어
  • it - 이탈리어아
  • ja - 일본어
  • ko - 한국어
  • pl - 폴란드어
  • pt - 포트투갈어
  • ro - 루마니아어
  • ru - 러시아어
  • th - 태국어
  • tr - 터키어
  • tw - 중국어(번체)
  • vi - 베트남어
엑솔라 목록에 없는 로케일을 전달하면 영어 로케일이 사용됩니다.
country
stringISO 3166-1 alpha-2에 따라 사용자의 국가를 식별하는 데 사용하는 두 글자 코드입니다. 이 매개변수는 로케일 및 통화 선택에 영향을 미칩니다. 이 매개변수를 전달하지 않으면 사용자의 IP 주소로 국가를 결정합니다.
Copy
Full screen
Small screen
  • curl
curl -X 'GET' \
'https://subscriptions.xsolla.com/api/user/v1/projects/{project_id}/plans?country=RU  ' \
  -H 'accept: application/json' \
  -H 'Authorization: Bearer client_user_jwt'
Copy
Full screen
Small screen
  • javascript
{
  "items": [
    {
      "plan_id": 54321,
      "plan_external_id": "PlanExternalId",
      "plan_group_id": "TestGroupId",
      "plan_type": "all",
      "plan_name": "Localized plan name",
      "plan_description": "Localized plan description",
      "plan_start_date": "2021-04-11T13:51:02+03:00",
      "plan_end_date": "2031-04-11T13:51:02+03:00",
      "trial_period": 7,
      "period": {
        "value": 1,
        "unit": "month"
      },
      "charge": {
        "amount": 4.99,
        "setup_fee": 0.99,
        "currency": "USD"
      },
      "promotion": {
        "promotion_charge_amount": 3.99,
        "promotion_remaining_charges": 3
      }
    }
  ],
  "has_more": false
}

엑솔라 페이 스테이션 사용하기

  1. 서버 측 토큰 생성하기 API 호출을 통해 토큰 가져오기를 구현합니다. 요청에서 다음 매개변수를 전달합니다.
    • user.id - 인증 시스템의 사용자 ID
    • user.email - RFC 822 프로토콜을 따르는 사용자 이메일
    • settings.project_id - 프로젝트 이름 옆의 관리자 페이지에서 찾을 수 있는 프로젝트 ID 매개변수
  2. 결제 UI 열기를 구현하는 방법:
Copy
Full screen
Small screen
  • javascript
{
    "user": {
        "name": {
            "value": "j.smith@email.com"
        },
        "id": {
            "value": "123a345b678c091d"
        }
    },
    "settings": {
        "project_id": 177226
    }
}

엑솔라 페이 스테이션에 정기 결제 카탈로그를 표시하는 예시:

엑솔라 웹사이트 빌더 사용하기

엑솔라 웹사이트 빌더를 사용하여 정기 결제 판매용 사이트를 생성하고 설정할 수 있습니다. 이렇게 하려면 웹샵 솔루션 템플릿을 사용하여 사이트를 생성해야 합니다. 사용자 인증을 사용하는 웹샵 솔루션 지침에서 역할 설정에 대한 자세한 내용을 확인할 수 있습니다.

이 기사가 도움이 되었나요?
감사합니다!
개선해야 할 점이 있을까요? 메시지
유감입니다
이 기사가 도움이 안 된 이유를 설명해 주세요. 메시지
의견을 보내 주셔서 감사드립니다!
메시지를 검토한 후 사용자 경험 향상에 사용하겠습니다.
마지막 업데이트: 2024년 7월 31일

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

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