Katalogbenutzeroberfläche erstellen

Die Katalogbenutzeroberlfäche lässt sich auf drei Wege erstellen:

• mithilfe einer eigenen Benutzeroberfläche
• mithilfe der Xsolla-Bezahlstation
• mithilfe des Xsolla-Website-Baukastens

Mithilfe einer eigenen Benutzeroberfläche

Beim Anlegen eines Verzeichnisses in Ihrer eigenen Benutzeroberfläche können Sie:

• einen eigenen Datenspeicher und eine beliebige Autorisierungsoption nutzen. Implementieren Sie in diesem Fall die Katalogbenutzeroberfläche Ihrerseits.
• Ihre eigene Autorisierungsmethode und die Servermethode Abo-Modelle abrufen nutzen. Implementieren Sie die Katalogbenutzeroberfläche Ihrerseits, nachdem Sie die Liste der Abo-Modelle abgerufen haben.
• Xsolla-Login und clientseitige API-Aufrufe.

Xsolla-Login und clientseitige API-Aufrufe

So implementieren Sie einen Katalog:

1. Abrufen einer Liste von Abo-Modelle mit Client-Methoden:
   • Wenn in Ihrem Projekt abonnementbasierte Produkte konfiguriert sind, verwenden Sie die clientseitige Methode zum Abruf der Abo-Modelle nach Produkten
   • Wenn in Ihrem Projekt keine abonnementbasierten Produkte konfiguriert sind, verwenden Sie die clientseitige Methode zum Abruf der Liste der Abo-Modelle
2. Die empfangene Liste der Abo-Modelle muss in der Benutzeroberfläche angezeigt werden; implementieren Sie diesen Vorgang.

Clientseitige Methode zum Abrufen der Abo-Modelle nach Produkten

Nutzen Sie aufseiten Ihres Anwendungs-Clients eine HTTP GET-Anfrage, um den Abruf der Liste der Abo-Modelle zu implementieren: https://subscriptions.xsolla.com​/api/user/v1/projects/{project_id}/products/{​​productId}/plans.

Die Anfrage muss den Header Authorization: Bearer <client_user_jwt> enthalten, wobei <client_user_jwt> der JSON Web Token (JWT) des Benutzer ist – ein eindeutiger, nach dem Base64-Xsolla-Standard kodierter Token. So rufen Sie den Token ab:

• Nutzen Sie die API-Aufrufe Register new user und Auth by username, sofern die Autorisierung bei Ihrer Anwendung über Benutzername und Passwort erfolgt.
• Nutzen Sie den API-Aufruf Auth via social network, sofern die Autorisierung bei Ihrer Anwendung über ein soziales Netzwerk erfolgt.

Als Pfadparameter angeben:

• projectId – Projekt-ID. Diesen Parameter finden Sie im Kundenportal neben dem Projektnamen.

• productID – ID des abonnementbasierten Produkts. Wenden Sie sich dazu an Ihren Account Manager.

Als Abfrageparameter angeben:

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
}

Clientseitige Methode für den Abruf der Liste der Abo-Modelle

Nutzen Sie aufseiten Ihres Anwendungs-Clients eine HTTP GET-Anfrage, um den Abruf der Liste der Abo-Modelle zu implementieren: https://subscriptions.xsolla.com​/api/user/v1/projects/{project_id}/plans.

Die Anfrage muss den Header Authorization: Bearer <client_user_jwt> enthalten, wobei <client_user_jwt> der JSON Web Token (JWT) des Benutzer ist – ein eindeutiger, nach dem Base64-Xsolla-Standard kodierter Token. So rufen Sie den Token ab:

• Nutzen Sie die API-Aufrufe Register new user und Auth by username, sofern die Autorisierung bei Ihrer Anwendung über Benutzername und Passwort erfolgt.
• Nutzen Sie den API-Aufruf Auth via social network, sofern die Autorisierung bei Ihrer Anwendung über ein soziales Netzwerk erfolgt.

Geben Sie die Projekt-ID als Pfadparameter projectId an. Sie finden diesen Parameter im Kundenportal neben dem Projektnamen.

Als Abfrageparameter angeben:

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
}

Mithilfe der Xsolla-Bezahlstation

Wie ein Katalog im Zahlungsportal erstellt wird, hängt von den Autorisierungseinstellungen Ihres Projekts ab:

• eigenes Autorisierungssystem
• Xsolla-Login

Eigenes Autorisierungssystem

Wenn Ihre Anwendung ein eigenes Berechtigungssystem verwendet:

1. Implementieren Sie, dass der Token über den API-Aufruf Token erstellen abgerufen wird. Übermitteln Sie in der Anfrage die Benutzerinformationen in den Parametern user.id und user.email.
2. Implementieren Sie, dass das Zahlungsportals in Pay Station Embed, einem iframe oder einem neuen Fenster geöffnet wird.

{
    "user": {
        "id": {
            "value": "1234567",
            "hidden": true
        }
    },
    "settings": {
        "project_id": 123456,
        "language": "en",
        "currency": "USD"
    }
}

Xsolla-Login

Sofern Xsolla-Login in Ihrem Projekt eingerichtet ist:

Nutzen Sie aufseiten Ihres Anwendungs-Clients eine HTTP-POST-Anfrage, um das Öffnen des Zahlungsportals zu implementieren: https://subscriptions.xsolla.com​/api/user/v1/projects/{project_id}/subscriptions/buy.

Die Anfrage muss den Header Authorization: Bearer <client_user_jwt> enthalten, wobei <client_user_jwt> der JSON Web Token (JWT) des Benutzer ist – ein eindeutiger, nach dem Base64-Xsolla-Standard kodierter Token. So rufen Sie den Token ab:

• Nutzen Sie die API-Aufrufe Register new user und Auth by username, sofern die Autorisierung bei Ihrer Anwendung über Benutzername und Passwort erfolgt.
• Nutzen Sie den API-Aufruf Auth via social network, sofern die Autorisierung bei Ihrer Anwendung über ein soziales Netzwerk erfolgt.

Geben Sie die Projekt-ID als Pfadparameter projectId an. Sie finden diesen Parameter im Kundenportal neben dem Projektnamen.

Legen Sie country als Abfrageparameter fest – die aus zwei Buchstaben bestehende Bezeichnung des Landes des Nutzers nach der Norm ISO 3166-1 Alpha-2. Beeinflusst die Wahl des Gebietsschemas und der Währung. Wird dieser Parameter nicht übermittelt, wird das Land des Benutzers anhand seiner IP-Adresse ermittelt.

Parameter im Anfragerumpf:

Übermitteln Sie bei Bedarf die zusätzlichen Parameter für die Anpassung.

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

{
  "link_to_ps": "https://secure.xsolla.com/paystation2/?access_token=<access_token>"
}

Beispiel für die Anzeige des Abonnementkatalogs in der Xsolla-Bezahlstation:

Mithilfe des Xsolla-Website-Baukastens

Mit dem Website-Baukasten von Xsolla können Sie eine Website erstellen und darüber Abonnements verkaufen. Verwenden Sie dazu die Webshop-Vorlage. Mehr über das Konfigurieren von Rollen erfahren Sie in der Anleitung Webshop mit Benutzerauthentifizierung.