Crie a interface do catálogo

Há três maneiras de criar a interface do catálogo:

• usando a própria interface
• usando a Xsolla Pay Station
• usando o Xsolla Site Builder

Usando a própria interface

Ao criar um diretório em sua própria interface, você pode usar:

• Armazenamento de dados próprio e qualquer opção de autorização. Nesse caso, implemente a interface do catálogo do seu lado.
• Sua própria autorização e o método de servidor Obter Planos. Implemente a interface do catálogo do seu lado depois de obter a lista de planos.
• Xsolla Login e chamadas de API do lado do cliente.

Xsolla Login e chamadas de API do lado do cliente

1. Obtenha uma lista de planos de assinatura usando métodos de cliente:
   • se seu projeto tiver produtos baseados em assinatura configurados, use o método do lado do cliente para obter os planos de assinatura por produtos
   • Se o projeto não tiver produtos baseados em assinatura configurados, o método do lado do cliente para obter a lista de planos
2. Implemente a exibição da lista de planos recebidos na interface.

Método do lado do cliente para obter os planos de assinatura por produtos

No lado do cliente do seu aplicativo, use uma solicitação HTTP get para implementar a obtenção da lista de planos: https://subscriptions.xsolla.com​/api/user/v1/projects/{project_id}/products/{​​productId}/plans.

A solicitação deve conter um cabeçalho Authorization: Bearer <client_user_jwt>, onde <client_user_jwt> é o JSON Web Token (JWT) do usuário — um token exclusivo codificado em Base64. Para obter o token:

• Use Register new user e Auth by username, e as chamadas de API de senha se seu aplicativo usar autorização de login e senha.

• Use a chamada de API Auth via social network se seu aplicativo usar autorização por meio de redes sociais.

• projectId — ID do projeto. Você pode encontrar esse parâmetro em sua Conta de Distribuidor ao lado do nome do projeto.

• productID — ID do produto baseado na assinatura. Para obtê-lo, entre em contato com seu Gerente de Sucesso do Cliente ou envie um e-mail para csm@xsolla.com.

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'

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

Método do lado do cliente para obter a lista de planos

No lado do cliente do seu aplicativo, use uma solicitação HTTP GET para implementar a obtenção da lista de planos: https://subscriptions.xsolla.com​/api/user/v1/projects/{project_id}/plans.

A solicitação deve conter um cabeçalho Authorization: Bearer <client_user_jwt>, onde <client_user_jwt> é o JSON Web Token (JWT) do usuário — um token exclusivo codificado em Base64. Para obter o token:

• Use Register new user e Auth by username, e as chamadas de API de senha se seu aplicativo usar autorização de login e senha.

• Use a chamada de API Auth via social network se seu aplicativo usar autorização por meio de redes sociais.

Especifique como parâmetros de consulta:

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'

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

Usando a Xsolla Pay Station

1. Implemente a obtenção do token por meio da chamada de API Criar token do lado do servidor. Passe os seguintes parâmetros na solicitação:
   • user.id — ID do usuário em seu sistema de autorização.
   • user.email — e-mail do usuário. Deve ser válido de acordo com o protocolo RFC 822.
   • settings.project_id — ID do projeto. Você pode encontrar esse parâmetro em sua Conta de Distribuidor ao lado do nome do projeto.
2. Implemente a abertura da interface de pagamento de uma das seguintes maneiras:
   • Script Pay Station Embed
   • Iframe
   • Nova janela

{
    "user": {
        "name": {
            "value": "j.smith@email.com"
        },
        "id": {
            "value": "123a345b678c091d"
        }
    },
    "settings": {
        "project_id": 177226
    }
}

Um exemplo de exibição do catálogo de assinaturas na Xsolla Pay Station:

Usando o Xsolla Site Builder

O Xsolla Site Builder permite que você crie e configure seu site para vendas de assinaturas. Para fazer isso, use o modelo Web Shop para criar um site. Você pode ler mais sobre como configurar funções nas instruções Web Shop with user authentication.