Partage via

Fournir des achats dans l’application avec l’API Digital Goods

  • Article

Si votre application web progressive (PWA) est répertoriée dans le Microsoft Store, vous pouvez fournir des produits et des abonnements dans l’application à l’aide de l’API De biens numériques et de l’API de demande de paiement.

API de biens numériques

L’API Digital Goods est une interface entre votre application PWA et le Microsoft Store. L’API Digital Goods prend en charge les éléments suivants :

  • Interrogation des détails d’un élément numérique à partir du serveur principal du Microsoft Store, tels que le nom, la description et le prix régional de l’article.
  • Consommation ou accusé de réception des achats.
  • Vérification des éléments numériques qui appartiennent actuellement à l’utilisateur.
  • Vérification de l’historique des achats de l’utilisateur.

Voir :

API de demande de paiement

L’API demande de paiement gère la transaction de paiement réelle lorsqu’un achat est effectué par un utilisateur. L’API de demande de paiement utilise les détails de l’article fourni par l’API De biens numériques pour effectuer l’achat dans l’application à l’aide du mode de paiement de facturation que l’utilisateur a configuré sur le Microsoft Store.

Voir :

Activer l’API Digital Goods

L’API Digital Goods est actuellement disponible pour le test dans Microsoft Edge. Pour tester l’API, utilisez l’une des méthodes suivantes :

Les détails sont ci-dessous.

Utiliser un canal de préversion pris en charge de Microsoft Edge sur votre machine de développement

Pour tester l’API Digital Goods localement, avant de déployer votre application en production, exécutez Edge Dev ou Edge Canary. Ces préversions de Edge ont l’API activée, dans le cadre d’une expérience en cours d’exécution.

Pour télécharger un canal en préversion (insider) de Microsoft Edge, consultez Devenir un Insider Microsoft Edge.

Inscrivez-vous à la version d’évaluation de l’origine, puis utilisez votre jeton sur votre site web

Pour tester l’API Digital Goods en production, avec vos utilisateurs, utilisez un jeton d’essai d’origine. Avec cette approche, lorsque vos utilisateurs téléchargent votre PWA à partir du Microsoft Store, l’API est activée.

Voir :

Vérification de la disponibilité de l’API Digital Goods

Pour détecter si vous avez correctement activé l’API sur votre site web à l’aide de votre jeton d’essai d’origine, case activée si la getDigitalGoodsService méthode existe sur l’objet window :

if ('getDigitalGoodsService' in window) {
  // The Digital Goods API is supported.
} else {
  console.log('DigitalGoodsService is not available.');
  // Use another payment method.
}

Voir aussi :

Connexion au service de facturation du Microsoft Store (window.getDigitalGoodsService méthode)

Utilisez la getDigitalGoodsService méthode de l’objet window pour vous connecter au service de facturation du Microsoft Store. Une interface DigitalGoodsService est retournée.

L’API Des biens numériques a été conçue pour être compatible avec différents navigateurs et magasins numériques, de la même façon que l’API de demande de paiement est indépendante du navigateur et peut être utilisée avec différents fournisseurs de paiement. Pour récupérer une instance du service pour la facturation du Microsoft Store, transmettez la chaîne "https://store.microsoft.com/billing" comme mode de paiement à la getDigitalGoodsService méthode .

Si la méthode génère une erreur, le mode de paiement De facturation du Microsoft Store n’est pas disponible (par exemple, lorsque l’utilisateur accède à votre PWA via le navigateur). Vous pouvez également fournir un autre mode de paiement pour les transactions.

if (window.getDigitalGoodsService === undefined) {
  // The Digital Goods API isn't supported in this context.
  return;
}
try {
  const digitalGoodsService = await window.getDigitalGoodsService("https://store.microsoft.com/billing");
  // Use the service here.
  ...
} catch (error) {
  // The preferred service provider is not available.
  // Use a web-based payment flow instead.
  return;
}

Ce mode getDigitalGoodsService("https://store.microsoft.com/billing") de paiement est disponible uniquement pour une PWA installée à partir du Microsoft Store, sur Windows. Aucun autre paramètre n’est nécessaire.

Voir aussi :

Interrogation des détails de l’élément (getDetails méthode)

Utilisez la getDetails méthode de l’interface DigitalGoodsService pour interroger les détails de l’élément.

Après avoir connecté le service Digital Goods au Microsoft Store, vous pouvez utiliser l’API pour accéder aux informations sur le produit et l’achat. La getDetails méthode vous permet d’obtenir des informations sur les éléments que vous avez configurés dans l’Espace partenaires. Affichez des informations telles que le titre, la description et le prix du produit dans l’interface utilisateur de votre application, afin que l’utilisateur sache ce qui est disponible à l’achat.

La getDetails méthode prend une liste d’ID d’élément, qui correspondent aux ID de produit des produits et abonnements dans l’application que vous avez créés dans l’Espace partenaires.

const itemDetails = await digitalGoodsService.getDetails(['shiny_sword', 'gem', 'monthly_subscription']);

for (item of itemDetails) {
  const priceStr = new Intl.NumberFormat(
      locale,
      {style: 'currency', currency: item.price.currency}
    ).format(item.price.value);

  // Do something with the item's data, such as displaying it in the PWA's UI.
  displayProductItem(item.itemId, item.title, priceStr, item.description);
}

La séquence retournée itemDetails peut être dans n’importe quel ordre et ne pas inclure d’élément si l’élément n’existe pas sur le serveur (autrement dit, s’il n’y a pas de correspondance 1:1 entre la liste d’entrée et la liste de sortie).

L’ID d’élément est une chaîne qui représente la clé primaire des éléments. Dans le Microsoft Store, l’ID d’élément est InAppOfferToken. Il n’existe aucune fonction pour obtenir une liste d’ID d’élément ; Les ID d’élément doivent être codés en dur dans le code client ou extraits de votre propre serveur (serveur du développeur).

Le de l’élément price est un PaymentCurrencyAmount qui contient le prix actuel de l’article dans la région et la devise actuelles de l’utilisateur. Le price est conçu pour être mis en forme pour les paramètres régionaux actuels de l’utilisateur à l’aide Intl.NumberFormatde , comme indiqué ci-dessus.

Voir aussi

Spécification de l’API Digital Goods

développement Windows App :

W3C :

MDN :

Achat d’un élément (PaymentRequest constructeur et show méthode)

Une fois vos produits et détails affichés à l’utilisateur, implémentez le flux d’achat à l’aide de l’API de demande de paiement. Pour acheter un élément, commencez par construire une requête qui contient les détails de l’élément à l’aide du PaymentRequest constructeur, puis utilisez la show méthode de l’objet PaymentRequest pour démarrer le flux de paiement.

Lorsqu’il est combiné avec l’API Digital Goods, le seul paramètre d’entrée requis pour le PaymentRequest constructeur est methodData. Dans le paramètre du constructeur :

  • Dans le supportedMethods membre , spécifiez Facturation du Microsoft Store comme mode de paiement, en tant que chaîne 'https://store.microsoft.com/billing'.
  • Dans le data membre , transmettez le itemId en tant que sku.
const details = await digitalGoodsService.getDetails(['monthly_subscription']);
const item = details[0];

const request = new PaymentRequest([
  {
    supportedMethods: 'https://store.microsoft.com/billing',
    data: { sku: item.itemId }
  }
]);

Appelez ensuite la show méthode de l’objet PaymentRequest pour démarrer le flux de paiement :

const response = await request.show();

Cela affiche l’interface utilisateur d’achat du Windows Store à l’utilisateur, où l’utilisateur peut afficher des détails sur le produit qu’il tente d’acheter. Pendant ce processus, la session de navigateur active est temporairement désactivée jusqu’à ce que le flux d’achat soit terminé. L’utilisateur peut annuler la transaction ou procéder au paiement :

  • Si l’utilisateur annule le paiement, la promesse retournée par la show méthode est rejetée avec une erreur.

  • Si l’utilisateur paie et termine l’achat, la promesse se résout avec un PaymentResponse. Dans la details propriété de la réponse de paiement, un jeton d’achat est retourné.

Voir aussi :

Consommation d’un achat (consume méthode)

Utilisez la consume méthode de l’interface DigitalGoodsService pour consommer un achat.

Un achat consommable est un achat conçu pour être acheté plusieurs fois. Un achat consommable doit généralement être marqué comme « consommé » avant que l’achat puisse être à nouveau acheté par l’utilisateur. Un exemple d’achat consommable est un powerup dans le jeu qui rend le joueur plus fort pendant une courte période de temps.

Pour marquer un achat comme étant « consommé », utilisez la consume méthode suivante :

digitalGoodsService.consume(purchaseToken);

Voir aussi :

Vérification des achats existants (listPurchases méthode)

Utilisez la listPurchases méthode de l’interface DigitalGoodsService pour case activée des achats existants. Cette méthode retourne des informations sur les achats existants de l’utilisateur. Cette méthode permet à un client d’obtenir la liste des éléments actuellement détenus ou achetés par l’utilisateur. Cela peut être nécessaire pour effectuer l’une des opérations suivantes :

  • Vérifiez les droits, par exemple si un abonnement, un code promotionnel ou une mise à niveau permanente est actif.

  • Récupérer après des interruptions de réseau lors d’un achat, par exemple lorsque l’article est acheté mais pas encore reconnu.

La listPurchases méthode retourne les ID d’élément et les jetons d’achat. Avant d’accorder un droit, vous devez vérifier l’ID d’élément retourné ou le jeton d’achat retourné, à l’aide d’une API de développeur à fournisseur directe, comme indiqué ci-dessous :

const purchaseList = await digitalGoodsService.listPurchases();

for (const purchase of purchaseList) {
  // Handle the purchase data in your PWA.
  verifyAndGrantEntitlement(purchase.itemId, purchase.purchaseToken);
}

La listPurchases méthode ne retourne pas les produits consommés ou les abonnements expirés.

Voir aussi :

Obtention de l’historique des achats (listPurchaseHistory méthode)

Utilisez la listPurchaseHistory méthode de l’interface DigitalGoodsService pour obtenir l’historique des achats.

Cette méthode retourne une liste de PurchaseDetails contenant et itemIdpurchaseToken pour chaque achat. La liste inclut l’achat le plus récent effectué par l’utilisateur pour chaque article, que l’achat soit arrivé à expiration, annulé ou consommé.

const purchaseList = await digitalGoodsService.listPurchaseHistory();

for (const purchase of purchaseList) {
  // Handle the expired purchase data in your PWA.
  verifyAndCheckExpiredEntitlement(purchase.itemId, purchase.purchaseToken);
}

Voir aussi :

Voir aussi

Essais d’origine :

GitHub :

MDN :

W3C :

développement Windows App :