Intégrer le magasin dans le jeu

Après avoir créé et configuré des biens (objets virtuels, monnaies virtuelles, lots, clés) dans votre Compte éditeur, ajoutez In-Game Store à votre jeu :

1. Implémentez l’affichage du catalogue des objets.
2. Implémentez la logique de vente des objets.

Affichage du catalogue des objets

Implémentez l’affichage du catalogue des objets via les appels In-Game Store API :

Vente des objets

Vous pouvez vendre des objets comme suit :

1. Achat rapide d’un bien. Il s’agit de la vente d’une UGS dans n’importe quelle quantité (par exemple, 100 potions identiques ou un montant quelconque de monnaie virtuelle).
2. Achat via le panier. Dans ce cas, le joueur remplit le panier, ajoute ou supprime des biens, ou modifie leur quantité.

Achat rapide

Achat via le panier

1. Pour configurer le panier et obtenir le jeton :
   • Sur le client — si vous voulez implémenter vous-même le panier dans votre application ;
   • Sur le serveur — si vous voulez utiliser une solution Xsolla (les appels In-Game Store API) pour gérer le panier.
2. Pour ouvrir l’interface de paiement.

Remplir et acheter le panier sur le client

Implémentez vous-même la logique d’ajout et de suppression de biens. De plus, gardez à l’esprit que, avant l’appel à l’API pour remplir le panier, l’utilisateur n’aura pas d’informations sur les promotions qui seront appliquées à l’achat. Cela signifie que le coût total et les informations sur les objets bonus ajoutés ne seront pas connus à l’avance.

1. Une fois que le joueur a rempli son panier, appelez l'API Remplir le panier d'objets. Les informations actuelles sur les biens sélectionnés (prix avant et après les remises, objets bonus) seront passées dans la réponse.
2. Appelez l'API Créer une commande à partir de tous les objets du panier actuel. L'ID de la commande et le jeton de paiement seront passés dans la réponse. La commande créée aura le statut New.
3. Ouvrez l'interface de paiement.

Remplir et acheter le panier sur le serveur

Cette option peut nécessiter plus de temps pour configurer le panier, car chaque modification du panier doit être accompagnée d’appels API.

Suivez les étapes suivantes :

1. Modifiez le panier :
   • Pour ajouter un bien ou modifier la quantité d’un bien, appelez l’API Mettre à jour un objet du panier par ID de panier ;
   • Pour supprimer un bien, appelez l’API Supprimer un objet du panier par ID de panier.

2. Appelez l'API Créer une commande à partir de tous les objets du panier actuel. L'ID de la commande et le jeton de paiement seront passés dans la réponse. La commande créée aura le statut New.
3. Ouvrez l'interface de paiement.

Ouverture de l'interface de paiement

Pour payer les biens, ouvrez l’interface de paiement. Le jeton permettant d’ouvrir l’interface de paiement sera passé dans la réponse à l’appel API Créer une commande à partir de tous les objets du panier actuel.

Implémentez l’ouverture de l’interface de paiement de l’une des manières suivantes :

• Dans une nouvelle fenêtre. Pour ouvrir l’interface de paiement dans une nouvelle fenêtre du navigateur, utilisez le lien : https://secure.xsolla.com/paystation3/?access_token=ACCESS_TOKEN où ACCESS_TOKEN est le jeton reçu lors de la création de la commande.
• Via un widget. Utilisez le script Xsolla PayStation Widget (le fichier README contient les instructions).

Tester la procédure de paiement

Pour tester le flux de paiement, utilisez le mode bac à sable. Faites usage d’une carte bancaire de test et de n’importe quel compte.

Obtenir le statut de la commande de l'utilisateur

Utilisez les moyens suivants pour obtenir le statut de la commande de l’utilisateur :

1. Côté serveur via les webhooks.
2. Côté client via l’API WebSocket API ou IGS API.

Obtenir le statut de la commande de l'utilisateur côté serveur via des webhooks

Obtenir le statut de la commande de l'utilisateur côté client via WebSocket API ou IGS API

1. WebSocket API.
2. Short-polling.

Obtenir l'état d'une commande côté client à l'aide de l'API WebSocket

La solution utilise WebSockets pour obtenir les statuts des commandes sans récupérer d’informations détaillées sur celles-ci. Cette méthode est préférable, car elle établit une seule connexion entre le client (par exemple, votre site web ou votre application mobile) et le serveur Xsolla, évitant ainsi une charge supplémentaire pour le client ou le serveur.

Effectuez les étapes suivantes:

1. Pour permettre au serveur Xsolla WebSocket et à votre client d’identifier les messages d’état des commandes, créez une connexion :

const client = new Centrifuge(
connectionURL,
{
data: {
  user_external_id: user_external_id,
  auth: auth,
  project_id: project_id
}
}
)
connectionURL - wss://ws-store.xsolla.com/connection/websocket
auth - user JWT token

2. Pour recevoir de nouveaux messages sur les statuts des commandes, abonnez-vous aux événements à l'aide de la fonction client.on :

client.on('publication', (ctx) => {
   //handle the status
});

3. Déclenchez l'établissement effectif de la connexion :

client.connect()

4. Pour recevoir l'historique des changements de statuts des commandes, connectez la méthode API d'historique.

client.on('subscribed', function (ctx) {
   client.history(ctx.channel, { limit: -1, since: { offset: 0 }, reverse: false }).then(function (resp) {
resp.publications.forEach((ctx) => {
   /handle the status
});

   }, function (err) {
       //handle the status
   });
});

Exemple de corps de message:

{
order_id: 59614241,
status: 'new'
}

Les statuts de commande suivants sont possibles :

• New — la commande a été créée, mais n’est pas encore payée ;
• Paid — la commande est payée ;
• Done — la commande a été livrée (tous les reçus ont été envoyés, les livraisons ont été effectuées du côté de Xsolla, des plateformes externes, etc.) ;
• Canceled — la commande a été annulée et le paiement a été remboursé à l’utilisateur.

Recommandations d’utilisation de websocket :

• Le temps d’attente maximum pour une réponse via websocket est de 5 minutes.
• La connexion doit être établie lors de l’ouverture de l’interface de paiement.
• La connexion doit être interrompue après réception du statut final de la commande, soit Canceled ou Done.
• En cas d’expiration de la durée de vie de la websocket ou de problèmes de connexion, utilisez le short-polling.

  Short-polling

  Pour obtenir des informations détaillées sur les biens de la commande après le passage au statut approprié, appelez l’API Lire une commande.

  Note

  Une interrogation périodique du statut de la commande est utilisée : une simple requête HTTP qui reçoit le statut de la commande et des informations sur celle-ci. Le délai recommandé entre les requêtes est de 3 secondes.
  Cet article vous a été utile ?

  Oui

  Non

  Merci !

  Que pouvons-nous améliorer ? Message Envoyer

  Nous sommes désolés de l'apprendre

  Dites-nous pourquoi vous n'avez pas trouvé cet article utile. Message Envoyer

  Merci pour votre commentaire !

  Nous examinerons votre message et l'utiliserons pour améliorer votre expérience.
  Dernière mise à jour: 8 Novembre 2024

  Faute de frappe ou autre erreur dans le texte ? Sélectionnez le texte concerné et appuyez sur Ctrl+Entée.