From 1770ad06670267189a1df16baa78d2829314b49c Mon Sep 17 00:00:00 2001 From: Michael Hoffman Date: Wed, 27 Nov 2024 08:30:34 -0800 Subject: [PATCH 01/26] enter todo's --- .../how-to/digital-goods-api.md | 18 ++++++++++++++---- 1 file changed, 14 insertions(+), 4 deletions(-) diff --git a/microsoft-edge/progressive-web-apps-chromium/how-to/digital-goods-api.md b/microsoft-edge/progressive-web-apps-chromium/how-to/digital-goods-api.md index c7c9351edd..e7123d3d64 100644 --- a/microsoft-edge/progressive-web-apps-chromium/how-to/digital-goods-api.md +++ b/microsoft-edge/progressive-web-apps-chromium/how-to/digital-goods-api.md @@ -39,13 +39,18 @@ See [Payment Request API](https://developer.mozilla.org/docs/Web/API/Payment_Req ## Checking whether the Digital Goods API is available To detect whether you've correctly enabled the API on your website, check for the `getDigitalGoodsService` method in the window object: + ```javascript if ('getDigitalGoodsService' in window) { - // Digital Goods API is supported! + // The Digital Goods API is supported. } else { console.log('DigitalGoodsService is not available.'); - // Use other payment method + // Use another payment method. } ``` @@ -58,10 +63,15 @@ Use the `getDigitalGoodsService` method to connect to the Microsoft Store Billin The Digital Goods API was designed to be compatible with various browsers and digital stores, similar to how the Payment Request API is browser-agnostic and can be used with different payment providers. To retrieve an instance of the service for Microsoft Store Billing, pass the string `"https://store.microsoft.com/billing"` as the payment method to the `getDigitalGoodsService` method. If the method throws an error, the Microsoft Store Billing payment method is not available (such as when the user is accessing your PWA through the browser). Alternatively, consider providing a different payment method for transactions. + ```javascript if (window.getDigitalGoodsService === undefined) { - // Digital Goods API is not supported in this context. + // The Digital Goods API isn't supported in this context. return; } try { @@ -69,7 +79,7 @@ try { // Use the service here. ... } catch (error) { - // Our preferred service provider is not available. + // The preferred service provider is not available. // Use a web-based payment flow instead. return; } From 7ecb4b296e8ab3905245103d85589f72830d86ce Mon Sep 17 00:00:00 2001 From: Michael Hoffman Date: Mon, 2 Dec 2024 08:53:32 -0800 Subject: [PATCH 02/26] answers to reviewer Qs --- .../how-to/digital-goods-api.md | 22 ++++++++++--------- 1 file changed, 12 insertions(+), 10 deletions(-) diff --git a/microsoft-edge/progressive-web-apps-chromium/how-to/digital-goods-api.md b/microsoft-edge/progressive-web-apps-chromium/how-to/digital-goods-api.md index e7123d3d64..061abf2cab 100644 --- a/microsoft-edge/progressive-web-apps-chromium/how-to/digital-goods-api.md +++ b/microsoft-edge/progressive-web-apps-chromium/how-to/digital-goods-api.md @@ -35,15 +35,20 @@ The Payment Request API⁠⁠ handles the actual payment transaction when a purc See [Payment Request API](https://developer.mozilla.org/docs/Web/API/Payment_Request_API) at MDN. + +## Origin trial and flag + +There's an origin trial and Edge flag for this feature. As of December 1, 2024, this origin trial is likely to end soon, graduating the feature to be incorporated in Microsoft Edge. See [Experimental features and origin trials for PWAs](https://learn.microsoft.com/en-us/microsoft-edge/progressive-web-apps-chromium/how-to/origin-trials). + +The Edge Experiments flag in `edge://flags/` will be enabled by default, when this feature ships in Edge Stable. + +This feature ships with a pre-release of Microsoft Edge. + + ## Checking whether the Digital Goods API is available To detect whether you've correctly enabled the API on your website, check for the `getDigitalGoodsService` method in the window object: - ```javascript if ('getDigitalGoodsService' in window) { @@ -63,11 +68,6 @@ Use the `getDigitalGoodsService` method to connect to the Microsoft Store Billin The Digital Goods API was designed to be compatible with various browsers and digital stores, similar to how the Payment Request API is browser-agnostic and can be used with different payment providers. To retrieve an instance of the service for Microsoft Store Billing, pass the string `"https://store.microsoft.com/billing"` as the payment method to the `getDigitalGoodsService` method. If the method throws an error, the Microsoft Store Billing payment method is not available (such as when the user is accessing your PWA through the browser). Alternatively, consider providing a different payment method for transactions. - ```javascript if (window.getDigitalGoodsService === undefined) { @@ -85,6 +85,8 @@ try { } ``` +This payment method `getDigitalGoodsService("https://store.microsoft.com/billing")` will be available only for a Microsoft Edge-based PWA that's installed from the Microsoft Store, on Windows. No other settings are needed. + ## Querying item details (`getDetails` method) From 32081a0424b72dc79b603fc9536cb64640cae24f Mon Sep 17 00:00:00 2001 From: Michael Hoffman Date: Mon, 2 Dec 2024 14:26:49 -0800 Subject: [PATCH 03/26] PaymentRequest ref link --- .../how-to/digital-goods-api.md | 8 ++++++-- 1 file changed, 6 insertions(+), 2 deletions(-) diff --git a/microsoft-edge/progressive-web-apps-chromium/how-to/digital-goods-api.md b/microsoft-edge/progressive-web-apps-chromium/how-to/digital-goods-api.md index 061abf2cab..2b7750be0d 100644 --- a/microsoft-edge/progressive-web-apps-chromium/how-to/digital-goods-api.md +++ b/microsoft-edge/progressive-web-apps-chromium/how-to/digital-goods-api.md @@ -6,7 +6,7 @@ ms.author: msedgedevrel ms.topic: conceptual ms.service: microsoft-edge ms.subservice: pwa -ms.date: 11/25/2024 +ms.date: 12/02/2024 --- # Provide in-app purchases with the Digital Goods API @@ -130,7 +130,7 @@ Use the `show` method to purchase an item, after you construct a request that co Once your products and details are displayed to the user, you can implement the purchase flow by using the Payment Request API. When combined with the Digital Goods API, the only required input parameter is `methodData`. -Use the `supportedMethods` member of the `methodData`⁠⁠ parameter in the `PaymentRequest` to identify Microsoft Store Billing as the payment method with the string `"https://store.microsoft.com/billing"`. Then in the `data` member, pass along the item ID as the `sku`. +Use the `supportedMethods` member of the `methodData`⁠⁠ parameter in the [PaymentRequest interface](https://www.w3.org/TR/payment-request/#dom-paymentrequest) to identify Microsoft Store Billing as the payment method with the string `"https://store.microsoft.com/billing"`. Then in the `data` member, pass along the item ID as the `sku`. ```javascript const details = await digitalGoodsService.getDetails(['monthly_subscription']); @@ -158,6 +158,9 @@ This will display the Store purchase UI to the user, where the user can view det In the `details` property of the payment response, a purchase token is returned. +See also: +* [PaymentRequest interface](https://www.w3.org/TR/payment-request/#dom-paymentrequest) in _W3C Payment Request API_. + ## Acknowledging a purchase @@ -228,6 +231,7 @@ for (const purchase of purchaseList) { W3C: * [Digital Goods API: Draft Community Group Report](https://wicg.github.io/digital-goods/) * [Payment Request API](https://www.w3.org/TR/payment-request/) +* [PaymentRequest interface](https://www.w3.org/TR/payment-request/#dom-paymentrequest) in _Payment Request API_. * [PaymentCurrencyAmount dictionary](https://www.w3.org/TR/payment-request/#dom-paymentcurrencyamount) in _Payment Request API_. MDN: From b1141295d2d4fd1fd197708f452cfe5193686f75 Mon Sep 17 00:00:00 2001 From: Michael Hoffman Date: Tue, 3 Dec 2024 17:43:29 -0800 Subject: [PATCH 04/26] link to OT, omit Edge-based --- .../how-to/digital-goods-api.md | 7 +++++-- 1 file changed, 5 insertions(+), 2 deletions(-) diff --git a/microsoft-edge/progressive-web-apps-chromium/how-to/digital-goods-api.md b/microsoft-edge/progressive-web-apps-chromium/how-to/digital-goods-api.md index 2b7750be0d..a9d2c0308c 100644 --- a/microsoft-edge/progressive-web-apps-chromium/how-to/digital-goods-api.md +++ b/microsoft-edge/progressive-web-apps-chromium/how-to/digital-goods-api.md @@ -38,12 +38,15 @@ See [Payment Request API](https://developer.mozilla.org/docs/Web/API/Payment_Req ## Origin trial and flag -There's an origin trial and Edge flag for this feature. As of December 1, 2024, this origin trial is likely to end soon, graduating the feature to be incorporated in Microsoft Edge. See [Experimental features and origin trials for PWAs](https://learn.microsoft.com/en-us/microsoft-edge/progressive-web-apps-chromium/how-to/origin-trials). +There's an origin trial and Microsoft Edge flag for this feature. See [Digital Goods API](https://developer.microsoft.com/microsoft-edge/origin-trials/trials/4b4a9ead-d912-4349-87b3-25e5e50b4f13) at _Microsoft Edge Developer_ > _Origin Trials_. The Edge Experiments flag in `edge://flags/` will be enabled by default, when this feature ships in Edge Stable. This feature ships with a pre-release of Microsoft Edge. +See also: +* [Experimental features and origin trials for PWAs](./origin-trials.md) + ## Checking whether the Digital Goods API is available @@ -85,7 +88,7 @@ try { } ``` -This payment method `getDigitalGoodsService("https://store.microsoft.com/billing")` will be available only for a Microsoft Edge-based PWA that's installed from the Microsoft Store, on Windows. No other settings are needed. +This payment method `getDigitalGoodsService("https://store.microsoft.com/billing")` will be available only for a PWA that's installed from the Microsoft Store, on Windows. No other settings are needed. From 451bef8c74847982b260e581f793756bcff7ea33 Mon Sep 17 00:00:00 2001 From: Michael Hoffman Date: Wed, 4 Dec 2024 08:54:12 -0800 Subject: [PATCH 05/26] inc rvw --- .../how-to/digital-goods-api.md | 25 ++++++++++++++++--- 1 file changed, 21 insertions(+), 4 deletions(-) diff --git a/microsoft-edge/progressive-web-apps-chromium/how-to/digital-goods-api.md b/microsoft-edge/progressive-web-apps-chromium/how-to/digital-goods-api.md index a9d2c0308c..2e8758e42f 100644 --- a/microsoft-edge/progressive-web-apps-chromium/how-to/digital-goods-api.md +++ b/microsoft-edge/progressive-web-apps-chromium/how-to/digital-goods-api.md @@ -36,13 +36,30 @@ See [Payment Request API](https://developer.mozilla.org/docs/Web/API/Payment_Req -## Origin trial and flag +## Enable the Digital Goods API -There's an origin trial and Microsoft Edge flag for this feature. See [Digital Goods API](https://developer.microsoft.com/microsoft-edge/origin-trials/trials/4b4a9ead-d912-4349-87b3-25e5e50b4f13) at _Microsoft Edge Developer_ > _Origin Trials_. +The Digital Goods API is currently available in pre-release versions of Microsoft Edge. To use the API, either enable the feature locally in Microsoft Edge, or register in the Digital Goods API origin trial to test the API in production. -The Edge Experiments flag in `edge://flags/` will be enabled by default, when this feature ships in Edge Stable. -This feature ships with a pre-release of Microsoft Edge. + +#### Enable the feature locally + +To enable the Digital Goods API on your developer machine only, for testing: + +TODO: How do you enable the flags `msWebAppDigitalGoods`, `AppStoreBilling` and `DigitalGoodsApi`? They are excluded from `edge://flags`. + + + + + + +#### Use the origin trial to test the feature in production + +To test the Digital Goods API in production, register in the origin trial. See: +* [Digital Goods API](https://developer.microsoft.com/microsoft-edge/origin-trials/trials/4b4a9ead-d912-4349-87b3-25e5e50b4f13) at _Microsoft Edge Developer_ > _Origin Trials_. +* [Registering for an origin trial](../../origin-trials/index.md#registering-for-an-origin-trial) in _Use origin trials in Microsoft Edge_. + + See also: * [Experimental features and origin trials for PWAs](./origin-trials.md) From 1673c7805ceb866f8feff552ec4c0518404a3e7c Mon Sep 17 00:00:00 2001 From: Michael Hoffman Date: Sat, 14 Dec 2024 09:27:48 -0800 Subject: [PATCH 06/26] versions supported --- .../how-to/digital-goods-api.md | 11 +++++++---- 1 file changed, 7 insertions(+), 4 deletions(-) diff --git a/microsoft-edge/progressive-web-apps-chromium/how-to/digital-goods-api.md b/microsoft-edge/progressive-web-apps-chromium/how-to/digital-goods-api.md index 2e8758e42f..6152885749 100644 --- a/microsoft-edge/progressive-web-apps-chromium/how-to/digital-goods-api.md +++ b/microsoft-edge/progressive-web-apps-chromium/how-to/digital-goods-api.md @@ -46,10 +46,11 @@ The Digital Goods API is currently available in pre-release versions of Microsof To enable the Digital Goods API on your developer machine only, for testing: -TODO: How do you enable the flags `msWebAppDigitalGoods`, `AppStoreBilling` and `DigitalGoodsApi`? They are excluded from `edge://flags`. +The `msWebAppDigitalGoods`, `AppStoreBilling` and `DigitalGoodsApi` flags are currently enabled as part of a running experiment, and will be enabled by default in the code once this feature reaches Edge Stable release. You can start using the API now by running Edge Dev or Edge Canary version 115.0.1860.0 or later. - - +Alternatively, you can use the API in your own Beta and Stable version of Microsoft Edge by launching Edge with the following command-line argument: + +`--enable-features=msWebAppDigitalGoods, AppStoreBilling, DigitalGoodsApi` @@ -59,7 +60,9 @@ To test the Digital Goods API in production, register in the origin trial. See: * [Digital Goods API](https://developer.microsoft.com/microsoft-edge/origin-trials/trials/4b4a9ead-d912-4349-87b3-25e5e50b4f13) at _Microsoft Edge Developer_ > _Origin Trials_. * [Registering for an origin trial](../../origin-trials/index.md#registering-for-an-origin-trial) in _Use origin trials in Microsoft Edge_. - +To use this API, you must install a prerelease version 115.0.1860.0 of Microsoft Edge (or a later release), such as: +* Edge Dev 115.0.1860.0 +* Edge Canary 115.0.1860.0 See also: * [Experimental features and origin trials for PWAs](./origin-trials.md) From b50ceb3896cb5453bb9d557a717a1412fdc2108b Mon Sep 17 00:00:00 2001 From: Michael Hoffman Date: Mon, 16 Dec 2024 10:45:19 -0800 Subject: [PATCH 07/26] ident type, ways to use API --- .../how-to/digital-goods-api.md | 109 +++++++++++++----- 1 file changed, 81 insertions(+), 28 deletions(-) diff --git a/microsoft-edge/progressive-web-apps-chromium/how-to/digital-goods-api.md b/microsoft-edge/progressive-web-apps-chromium/how-to/digital-goods-api.md index 6152885749..1dbce7fa37 100644 --- a/microsoft-edge/progressive-web-apps-chromium/how-to/digital-goods-api.md +++ b/microsoft-edge/progressive-web-apps-chromium/how-to/digital-goods-api.md @@ -32,46 +32,57 @@ See: The Payment Request API⁠⁠ handles the actual payment transaction when a purchase is made by a user. The Payment Request API uses the item details that the Digital Goods API provides, to make the in-app purchase by using whichever billing payment method the user has set up at the Microsoft Store. -See [Payment Request API](https://developer.mozilla.org/docs/Web/API/Payment_Request_API) at MDN. +See: +* [Payment Request API](https://developer.mozilla.org/docs/Web/API/Payment_Request_API) at MDN. ## Enable the Digital Goods API -The Digital Goods API is currently available in pre-release versions of Microsoft Edge. To use the API, either enable the feature locally in Microsoft Edge, or register in the Digital Goods API origin trial to test the API in production. +The Digital Goods API is currently available in pre-release versions of Microsoft Edge. To use the API, do any of the following: +* [Use a supported preview channel of Microsoft Edge on your dev machine](#use-a-supported-preview-channel-of-microsoft-edge-on-your-dev-machine). +* [Start Beta or Stable Edge with command-line arguments on your dev machine](#start-beta-or-stable-edge-with-command-line-arguments-on-your-dev-machine). +* [Register for the origin trial, then use your token at your website](#register-for-the-origin-trial-then-use-your-token-at-your-website). + +Details are below. -#### Enable the feature locally +#### Use a supported preview channel of Microsoft Edge on your dev machine -To enable the Digital Goods API on your developer machine only, for testing: +Approach 1: Run Edge Dev or Edge Canary version 115.0.1860.0 or later. With this approach, you use the Digital Goods API on your developer machine only, for testing. -The `msWebAppDigitalGoods`, `AppStoreBilling` and `DigitalGoodsApi` flags are currently enabled as part of a running experiment, and will be enabled by default in the code once this feature reaches Edge Stable release. You can start using the API now by running Edge Dev or Edge Canary version 115.0.1860.0 or later. +That version of Edge has the `msWebAppDigitalGoods`, `AppStoreBilling` and `DigitalGoodsApi` flags enabled, as part of a running experiment. These flags will be enabled by default when the Digital Goods API reaches Edge Stable release. -Alternatively, you can use the API in your own Beta and Stable version of Microsoft Edge by launching Edge with the following command-line argument: + + +#### Start Beta or Stable Edge with command-line arguments on your dev machine + +Approach 2: Start Edge Stable or Edge Beta with command-line arguments. With this approach, you use the Digital Goods API on your developer machine only, for testing. + +Start Edge Stable or Edge Beta (prior to version 115.0.1860.0) at the command line, using the following command-line argument to enable the set of three flags: `--enable-features=msWebAppDigitalGoods, AppStoreBilling, DigitalGoodsApi` -#### Use the origin trial to test the feature in production +#### Register for the origin trial, then use your token at your website + +Approach 3: Use an origin trial token. With this approach, you and your users can use Edge Stable, to test the Digital Goods API in production. You register in the origin trial for the Digital Goods API, and then use your origin trial token at your website. -To test the Digital Goods API in production, register in the origin trial. See: +See: * [Digital Goods API](https://developer.microsoft.com/microsoft-edge/origin-trials/trials/4b4a9ead-d912-4349-87b3-25e5e50b4f13) at _Microsoft Edge Developer_ > _Origin Trials_. -* [Registering for an origin trial](../../origin-trials/index.md#registering-for-an-origin-trial) in _Use origin trials in Microsoft Edge_. +* [Use origin trials in Microsoft Edge](../../origin-trials/index.md) To use this API, you must install a prerelease version 115.0.1860.0 of Microsoft Edge (or a later release), such as: * Edge Dev 115.0.1860.0 * Edge Canary 115.0.1860.0 -See also: -* [Experimental features and origin trials for PWAs](./origin-trials.md) - ## Checking whether the Digital Goods API is available -To detect whether you've correctly enabled the API on your website, check for the `getDigitalGoodsService` method in the window object: +To detect whether you've correctly enabled the API on your website by using your origin trial token, check whether the `getDigitalGoodsService` method exists on the `window` object: ```javascript if ('getDigitalGoodsService' in window) { @@ -82,11 +93,18 @@ if ('getDigitalGoodsService' in window) { } ``` + + -## Connecting to the Microsoft Store Billing service (`getDigitalGoodsService` method) +## Connecting to the Microsoft Store Billing service (`window.getDigitalGoodsService` method) -Use the `getDigitalGoodsService` method to connect to the Microsoft Store Billing service. + + +Use the `getDigitalGoodsService` method of the `window` object to connect to the Microsoft Store Billing service. The Digital Goods API was designed to be compatible with various browsers and digital stores, similar to how the Payment Request API is browser-agnostic and can be used with different payment providers. To retrieve an instance of the service for Microsoft Store Billing, pass the string `"https://store.microsoft.com/billing"` as the payment method to the `getDigitalGoodsService` method. @@ -108,12 +126,19 @@ try { } ``` -This payment method `getDigitalGoodsService("https://store.microsoft.com/billing")` will be available only for a PWA that's installed from the Microsoft Store, on Windows. No other settings are needed. +This payment method `getDigitalGoodsService("https://store.microsoft.com/billing")` is available only for a PWA that's installed from the Microsoft Store, on Windows. No other settings are needed. + + ## Querying item details (`getDetails` method) + + Use the `getDetails` method to query item details. After connecting the Digital Goods service to Microsoft Store, you can use the API to access product and purchase information. The `getDetails` method lets you get information about the items you’ve set up in the Partner Center. Display information such as the product title, description, and price in your app UI, so the user knows what's available for purchase. @@ -142,18 +167,22 @@ The item's `price` is a `PaymentCurrencyAmount` that contains the current price See also: * [StoreProduct.InAppOfferToken Property](/uwp/api/windows.services.store.storeproduct.inappoffertoken) -* [PaymentCurrencyAmount dictionary](https://www.w3.org/TR/payment-request/#dom-paymentcurrencyamount) in _Payment Request API_ at W3C. +* [PaymentCurrencyAmount dictionary](https://www.w3.org/TR/payment-request/#dom-paymentcurrencyamount) in _Payment Request API: Candidate Recommendation Draft_ at W3C. +* [Value (about PaymentCurrencyAmount object)](https://developer.mozilla.org/docs/Web/API/PaymentRequestEvent/total#value) in _PaymentRequestEvent: total property_ at MDN > References > Web APIs > PaymentRequestEvent, in Payment Handler API (experimental). * [Intl.NumberFormat](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Intl/NumberFormat) at MDN. + -## Purchasing an item (`show` method) +## Purchasing an item (`PaymentRequest.show` method) -Use the `show` method to purchase an item, after you construct a request that contains the item details. +Use the `show` method of `PaymentRequest` to purchase an item, after you construct a request that contains the item details. Once your products and details are displayed to the user, you can implement the purchase flow by using the Payment Request API. When combined with the Digital Goods API, the only required input parameter is `methodData`. -Use the `supportedMethods` member of the `methodData`⁠⁠ parameter in the [PaymentRequest interface](https://www.w3.org/TR/payment-request/#dom-paymentrequest) to identify Microsoft Store Billing as the payment method with the string `"https://store.microsoft.com/billing"`. Then in the `data` member, pass along the item ID as the `sku`. +Use the `supportedMethods` member of the `methodData`⁠⁠ parameter in the `PaymentRequest` interface to identify Microsoft Store Billing as the payment method with the string `"https://store.microsoft.com/billing"`. Then in the `data` member, pass along the item ID as the `sku`. ```javascript const details = await digitalGoodsService.getDetails(['monthly_subscription']); @@ -182,7 +211,10 @@ This will display the Store purchase UI to the user, where the user can view det In the `details` property of the payment response, a purchase token is returned. See also: -* [PaymentRequest interface](https://www.w3.org/TR/payment-request/#dom-paymentrequest) in _W3C Payment Request API_. +* [PaymentRequest](https://developer.mozilla.org/docs/Web/API/PaymentRequest) at MDN > References > Web APIs > PaymentRequest > Payment Request API. + * [PaymentRequest: show() method](https://developer.mozilla.org/en-US/docs/Web/API/PaymentRequest/show) at MDN > References > Web APIs > PaymentRequest > Payment Request API. +* [PaymentRequest interface](https://www.w3.org/TR/payment-request/#dom-paymentrequest) in _Payment Request API: Candidate Recommendation Draft_ at W3C. + * [show() method](https://www.w3.org/TR/payment-request/#dom-paymentrequest-show) in _Payment Request API: Candidate Recommendation Draft_ at W3C. @@ -196,6 +228,8 @@ Some stores might require that you (the developer) acknowledge a purchase after ## Consuming a purchase (`consume` method) + + Use the `consume` method to consume a purchase. A _consumable purchase_ is a purchase that's designed to be purchased multiple times. A consumable purchase usually needs to be marked as "consumed" before the purchase can be purchased again by the user. An example of a consumable purchase is an in-game powerup that makes the player stronger for a short period of time. @@ -205,11 +239,16 @@ To mark a purchase as "consumed", use the `consume` method: ```javascript digitalGoodsService.consume(purchaseToken); ``` + ## Checking existing purchases (`listPurchases` method) + + Use the `listPurchases` method to check existing purchases. This method returns information about the user's existing purchases. This method allows a client to get a list of items that are currently owned or purchased by the user. This may be necessary, to do either of the following: * Check for entitlements, such as whether a subscription, promotional code, or permanent upgrade is active. @@ -247,15 +286,29 @@ for (const purchase of purchaseList) { ## See also + -* [Digital Goods API For Microsoft Store PWA Explainer](https://github.com/MicrosoftEdge/MSEdgeExplainers/blob/main/PwaDigitalGoods/explainer.md) +Local: +* [Use origin trials in Microsoft Edge](../../origin-trials/index.md) + +Other docsets: * [StoreProduct.InAppOfferToken Property](/uwp/api/windows.services.store.storeproduct.inappoffertoken) -W3C: -* [Digital Goods API: Draft Community Group Report](https://wicg.github.io/digital-goods/) -* [Payment Request API](https://www.w3.org/TR/payment-request/) -* [PaymentRequest interface](https://www.w3.org/TR/payment-request/#dom-paymentrequest) in _Payment Request API_. -* [PaymentCurrencyAmount dictionary](https://www.w3.org/TR/payment-request/#dom-paymentcurrencyamount) in _Payment Request API_. +Origin trials: +* [Digital Goods API](https://developer.microsoft.com/microsoft-edge/origin-trials/trials/4b4a9ead-d912-4349-87b3-25e5e50b4f13) at _Microsoft Edge Developer_ > _Origin Trials_. + +GitHub: +* [Digital Goods API For Microsoft Store PWA Explainer](https://github.com/MicrosoftEdge/MSEdgeExplainers/blob/main/PwaDigitalGoods/explainer.md) +* [Digital Goods API: Draft Community Group Report](https://wicg.github.io/digital-goods/) at GitHub. MDN: -* [Intl.NumberFormat](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Intl/NumberFormat) +* [Payment Request API](https://developer.mozilla.org/docs/Web/API/Payment_Request_API) at MDN > References > Web APIs. + * [PaymentRequest](https://developer.mozilla.org/docs/Web/API/PaymentRequest) at MDN > References > Web APIs > PaymentRequest > Payment Request API. + * [Value (about PaymentCurrencyAmount object)](https://developer.mozilla.org/docs/Web/API/PaymentRequestEvent/total#value) in _PaymentRequestEvent: total property_ at MDN > References > Web APIs > PaymentRequestEvent, in Payment Handler API (experimental). +* [Intl.NumberFormat](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Intl/NumberFormat) at MDN. + +W3C: +* [Payment Request API: Candidate Recommendation Draft](https://www.w3.org/TR/payment-request/) at W3C. + * [PaymentRequest interface](https://www.w3.org/TR/payment-request/#dom-paymentrequest) in _Payment Request API: Candidate Recommendation Draft_ at W3C. + * [show() method](https://www.w3.org/TR/payment-request/#dom-paymentrequest-show) in _Payment Request API: Candidate Recommendation Draft_ at W3C. + * [PaymentCurrencyAmount dictionary](https://www.w3.org/TR/payment-request/#dom-paymentcurrencyamount) in _Payment Request API: Candidate Recommendation Draft_ at W3C. From 0763cbda54ddbf5602bb453ecc6238bd881ed0d9 Mon Sep 17 00:00:00 2001 From: Michael Hoffman Date: Mon, 16 Dec 2024 11:03:25 -0800 Subject: [PATCH 08/26] link to Edge preview dl site --- .../how-to/digital-goods-api.md | 8 +++----- 1 file changed, 3 insertions(+), 5 deletions(-) diff --git a/microsoft-edge/progressive-web-apps-chromium/how-to/digital-goods-api.md b/microsoft-edge/progressive-web-apps-chromium/how-to/digital-goods-api.md index 1dbce7fa37..ffdbe2c97c 100644 --- a/microsoft-edge/progressive-web-apps-chromium/how-to/digital-goods-api.md +++ b/microsoft-edge/progressive-web-apps-chromium/how-to/digital-goods-api.md @@ -54,6 +54,8 @@ Approach 1: Run Edge Dev or Edge Canary version 115.0.1860.0 or later. With thi That version of Edge has the `msWebAppDigitalGoods`, `AppStoreBilling` and `DigitalGoodsApi` flags enabled, as part of a running experiment. These flags will be enabled by default when the Digital Goods API reaches Edge Stable release. +To download a preview (insider) channel of Microsoft Edge, see [Become a Microsoft Edge Insider](https://aka.ms/microsoftedge). + #### Start Beta or Stable Edge with command-line arguments on your dev machine @@ -71,12 +73,8 @@ Start Edge Stable or Edge Beta (prior to version 115.0.1860.0) at the command li Approach 3: Use an origin trial token. With this approach, you and your users can use Edge Stable, to test the Digital Goods API in production. You register in the origin trial for the Digital Goods API, and then use your origin trial token at your website. See: -* [Digital Goods API](https://developer.microsoft.com/microsoft-edge/origin-trials/trials/4b4a9ead-d912-4349-87b3-25e5e50b4f13) at _Microsoft Edge Developer_ > _Origin Trials_. * [Use origin trials in Microsoft Edge](../../origin-trials/index.md) - -To use this API, you must install a prerelease version 115.0.1860.0 of Microsoft Edge (or a later release), such as: -* Edge Dev 115.0.1860.0 -* Edge Canary 115.0.1860.0 +* [Digital Goods API](https://developer.microsoft.com/microsoft-edge/origin-trials/trials/4b4a9ead-d912-4349-87b3-25e5e50b4f13) at _Microsoft Edge Developer_ > _Origin Trials_. From b84045a40b48395e292d0ab1ea99025a76260854 Mon Sep 17 00:00:00 2001 From: Michael Hoffman Date: Wed, 18 Dec 2024 10:17:34 -0800 Subject: [PATCH 09/26] type of each method --- .../how-to/digital-goods-api.md | 106 +++++++++--------- 1 file changed, 54 insertions(+), 52 deletions(-) diff --git a/microsoft-edge/progressive-web-apps-chromium/how-to/digital-goods-api.md b/microsoft-edge/progressive-web-apps-chromium/how-to/digital-goods-api.md index ffdbe2c97c..b1997989cd 100644 --- a/microsoft-edge/progressive-web-apps-chromium/how-to/digital-goods-api.md +++ b/microsoft-edge/progressive-web-apps-chromium/how-to/digital-goods-api.md @@ -6,7 +6,7 @@ ms.author: msedgedevrel ms.topic: conceptual ms.service: microsoft-edge ms.subservice: pwa -ms.date: 12/02/2024 +ms.date: 12/18/2024 --- # Provide in-app purchases with the Digital Goods API @@ -39,10 +39,9 @@ See: ## Enable the Digital Goods API -The Digital Goods API is currently available in pre-release versions of Microsoft Edge. To use the API, do any of the following: -* [Use a supported preview channel of Microsoft Edge on your dev machine](#use-a-supported-preview-channel-of-microsoft-edge-on-your-dev-machine). -* [Start Beta or Stable Edge with command-line arguments on your dev machine](#start-beta-or-stable-edge-with-command-line-arguments-on-your-dev-machine). -* [Register for the origin trial, then use your token at your website](#register-for-the-origin-trial-then-use-your-token-at-your-website). +The Digital Goods API is currently available for testing in Microsoft Edge. To test the API, use either of the following ways: +* To test your code locally: [Use a supported preview channel of Microsoft Edge on your dev machine](#use-a-supported-preview-channel-of-microsoft-edge-on-your-dev-machine). +* To test your code in your Microsoft Store PWA: [Register for the origin trial, then use your token at your website](#register-for-the-origin-trial-then-use-your-token-at-your-website). Details are below. @@ -50,27 +49,15 @@ Details are below. #### Use a supported preview channel of Microsoft Edge on your dev machine -Approach 1: Run Edge Dev or Edge Canary version 115.0.1860.0 or later. With this approach, you use the Digital Goods API on your developer machine only, for testing. - -That version of Edge has the `msWebAppDigitalGoods`, `AppStoreBilling` and `DigitalGoodsApi` flags enabled, as part of a running experiment. These flags will be enabled by default when the Digital Goods API reaches Edge Stable release. +To test the Digital Goods API locally, before deploying your app to production, run Edge Dev or Edge Canary. These preview versions of Edge have the API enabled, as part of a running experiment. To download a preview (insider) channel of Microsoft Edge, see [Become a Microsoft Edge Insider](https://aka.ms/microsoftedge). - -#### Start Beta or Stable Edge with command-line arguments on your dev machine - -Approach 2: Start Edge Stable or Edge Beta with command-line arguments. With this approach, you use the Digital Goods API on your developer machine only, for testing. - -Start Edge Stable or Edge Beta (prior to version 115.0.1860.0) at the command line, using the following command-line argument to enable the set of three flags: - -`--enable-features=msWebAppDigitalGoods, AppStoreBilling, DigitalGoodsApi` - - #### Register for the origin trial, then use your token at your website -Approach 3: Use an origin trial token. With this approach, you and your users can use Edge Stable, to test the Digital Goods API in production. You register in the origin trial for the Digital Goods API, and then use your origin trial token at your website. +To test the Digital Goods API in production, with your users, use an origin trial token. With this approach, when your users download your PWA from the Microsoft Store, they will have the API enabled. See: * [Use origin trials in Microsoft Edge](../../origin-trials/index.md) @@ -80,7 +67,7 @@ See: ## Checking whether the Digital Goods API is available -To detect whether you've correctly enabled the API on your website by using your origin trial token, check whether the `getDigitalGoodsService` method exists on the `window` object: +To detect whether you've correctly enabled the API on your website by using your origin trial token, check whether the `getDigitalGoodsService` method exists on the `Window` object: ```javascript if ('getDigitalGoodsService' in window) { @@ -91,18 +78,14 @@ if ('getDigitalGoodsService' in window) { } ``` - +* [getDigitalGoodsService() method](https://wicg.github.io/digital-goods/#getdigitalgoodsservice-method) on the `Window` interface, in _Digital Goods API: Draft Community Group Report_. ## Connecting to the Microsoft Store Billing service (`window.getDigitalGoodsService` method) - - -Use the `getDigitalGoodsService` method of the `window` object to connect to the Microsoft Store Billing service. +Use the `getDigitalGoodsService` method of the `Window` object to connect to the Microsoft Store Billing service. A [DigitalGoodsService interface](https://wicg.github.io/digital-goods/#digitalgoodsservice) is returned. The Digital Goods API was designed to be compatible with various browsers and digital stores, similar to how the Payment Request API is browser-agnostic and can be used with different payment providers. To retrieve an instance of the service for Microsoft Store Billing, pass the string `"https://store.microsoft.com/billing"` as the payment method to the `getDigitalGoodsService` method. @@ -126,18 +109,15 @@ try { This payment method `getDigitalGoodsService("https://store.microsoft.com/billing")` is available only for a PWA that's installed from the Microsoft Store, on Windows. No other settings are needed. - +* [getDigitalGoodsService() method](https://wicg.github.io/digital-goods/#getdigitalgoodsservice-method) on the `Window` interface, in _Digital Goods API: Draft Community Group Report_. +* [DigitalGoodsService interface](https://wicg.github.io/digital-goods/#digitalgoodsservice) in _Digital Goods API: Draft Community Group Report_. ## Querying item details (`getDetails` method) - - -Use the `getDetails` method to query item details. +Use the `getDetails` method of the `DigitalGoodsService` interface to query item details. After connecting the Digital Goods service to Microsoft Store, you can use the API to access product and purchase information. The `getDetails` method lets you get information about the items you’ve set up in the Partner Center. Display information such as the product title, description, and price in your app UI, so the user knows what's available for purchase. @@ -163,20 +143,28 @@ The item ID is a string that represents the primary key of the items. In the Mi The item's `price` is a `PaymentCurrencyAmount` that contains the current price of the item in the user's current region and currency. The `price` is designed to be formatted for the user's current locale by using `Intl.NumberFormat`, as shown above. -See also: -* [StoreProduct.InAppOfferToken Property](/uwp/api/windows.services.store.storeproduct.inappoffertoken) -* [PaymentCurrencyAmount dictionary](https://www.w3.org/TR/payment-request/#dom-paymentcurrencyamount) in _Payment Request API: Candidate Recommendation Draft_ at W3C. -* [Value (about PaymentCurrencyAmount object)](https://developer.mozilla.org/docs/Web/API/PaymentRequestEvent/total#value) in _PaymentRequestEvent: total property_ at MDN > References > Web APIs > PaymentRequestEvent, in Payment Handler API (experimental). + + +#### See also + +Digital Goods API: Draft Community Group Report +* [DigitalGoodsService interface](https://wicg.github.io/digital-goods/#digitalgoodsservice) in _Digital Goods API: Draft Community Group Report_. + * [getDetails() method](https://wicg.github.io/digital-goods/#getDetails-method) in _Digital Goods API: Draft Community Group Report_. + +Learn.microsoft.com: +* [StoreProduct.InAppOfferToken Property](/uwp/api/windows.services.store.storeproduct.inappoffertoken). + +W3C: +* [PaymentCurrencyAmount dictionary](https://www.w3.org/TR/payment-request/#dom-paymentcurrencyamount) in _Payment Request API: W3C Candidate Recommendation Draft_. + +MDN: * [Intl.NumberFormat](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Intl/NumberFormat) at MDN. - ## Purchasing an item (`PaymentRequest.show` method) -Use the `show` method of `PaymentRequest` to purchase an item, after you construct a request that contains the item details. +Use the `show` method of the `PaymentRequest` interface to purchase an item, after you construct a request that contains the item details. Once your products and details are displayed to the user, you can implement the purchase flow by using the Payment Request API. When combined with the Digital Goods API, the only required input parameter is `methodData`. @@ -209,8 +197,12 @@ This will display the Store purchase UI to the user, where the user can view det In the `details` property of the payment response, a purchase token is returned. See also: + +MDN: * [PaymentRequest](https://developer.mozilla.org/docs/Web/API/PaymentRequest) at MDN > References > Web APIs > PaymentRequest > Payment Request API. * [PaymentRequest: show() method](https://developer.mozilla.org/en-US/docs/Web/API/PaymentRequest/show) at MDN > References > Web APIs > PaymentRequest > Payment Request API. + +W3C: * [PaymentRequest interface](https://www.w3.org/TR/payment-request/#dom-paymentrequest) in _Payment Request API: Candidate Recommendation Draft_ at W3C. * [show() method](https://www.w3.org/TR/payment-request/#dom-paymentrequest-show) in _Payment Request API: Candidate Recommendation Draft_ at W3C. @@ -226,9 +218,7 @@ Some stores might require that you (the developer) acknowledge a purchase after ## Consuming a purchase (`consume` method) - - -Use the `consume` method to consume a purchase. +Use the `consume` method of the `DigitalGoodsService` interface to consume a purchase. A _consumable purchase_ is a purchase that's designed to be purchased multiple times. A consumable purchase usually needs to be marked as "consumed" before the purchase can be purchased again by the user. An example of a consumable purchase is an in-game powerup that makes the player stronger for a short period of time. @@ -237,17 +227,15 @@ To mark a purchase as "consumed", use the `consume` method: ```javascript digitalGoodsService.consume(purchaseToken); ``` - + +See also: +* [consume() method](https://wicg.github.io/digital-goods/#consume-method) of the `DigitalGoodsService` interface, in _Digital Goods API: Draft Community Group Report_. ## Checking existing purchases (`listPurchases` method) - - -Use the `listPurchases` method to check existing purchases. This method returns information about the user's existing purchases. This method allows a client to get a list of items that are currently owned or purchased by the user. This may be necessary, to do either of the following: +Use the `listPurchases` method of the `DigitalGoodsService` interface to check existing purchases. This method returns information about the user's existing purchases. This method allows a client to get a list of items that are currently owned or purchased by the user. This may be necessary, to do either of the following: * Check for entitlements, such as whether a subscription, promotional code, or permanent upgrade is active. @@ -266,11 +254,14 @@ for (const purchase of purchaseList) { The `listPurchases` method doesn't return consumed products or expired subscriptions. +See also: +* [listPurchases() method](https://wicg.github.io/digital-goods/#listPurchases-method) of the `DigitalGoodsService` interface, in _Digital Goods API: Draft Community Group Report_. + ## Getting the purchase history (`listPurchaseHistory` method) -Use the `listPurchaseHistory` method to get the purchase history. This method returns a list that shows the most recent purchase made by the user for each item, regardless of whether the purchase is expired, canceled, or consumed. This method returns a list of `PurchaseDetails` containing the `itemId` and `purchaseToken` for each purchase. +Use the `listPurchaseHistory` method of the `DigitalGoodsService` interface to get the purchase history. This method returns a list that shows the most recent purchase made by the user for each item, regardless of whether the purchase is expired, canceled, or consumed. This method returns a list of `PurchaseDetails` containing the `itemId` and `purchaseToken` for each purchase. ```javascript const purchaseList = await digitalGoodsService.listPurchaseHistory(); @@ -281,6 +272,10 @@ for (const purchase of purchaseList) { } ``` +See also: +* [listPurchaseHistory() method](https://wicg.github.io/digital-goods/#listPurchaseHistory-method) of the `DigitalGoodsService` interface, in _Digital Goods API: Draft Community Group Report_. +* [PurchaseDetails dictionary](https://wicg.github.io/digital-goods/#purchaseDetails-dictionary) in _Digital Goods API: Draft Community Group Report_. + ## See also @@ -298,15 +293,22 @@ Origin trials: GitHub: * [Digital Goods API For Microsoft Store PWA Explainer](https://github.com/MicrosoftEdge/MSEdgeExplainers/blob/main/PwaDigitalGoods/explainer.md) * [Digital Goods API: Draft Community Group Report](https://wicg.github.io/digital-goods/) at GitHub. + * [getDigitalGoodsService() method](https://wicg.github.io/digital-goods/#getdigitalgoodsservice-method) on the `Window` interface, in _Digital Goods API: Draft Community Group Report_. + * [DigitalGoodsService interface](https://wicg.github.io/digital-goods/#digitalgoodsservice) in _Digital Goods API: Draft Community Group Report_. + * [getDetails() method](https://wicg.github.io/digital-goods/#getDetails-method) of the `DigitalGoodsService` interface, in _Digital Goods API: Draft Community Group Report_. + * [listPurchases() method](https://wicg.github.io/digital-goods/#listPurchases-method) of the `DigitalGoodsService` interface, in _Digital Goods API: Draft Community Group Report_. + * [listPurchaseHistory() method](https://wicg.github.io/digital-goods/#listPurchaseHistory-method) of the `DigitalGoodsService` interface, in _Digital Goods API: Draft Community Group Report_. + * [consume() method](https://wicg.github.io/digital-goods/#consume-method) of the `DigitalGoodsService` interface, in _Digital Goods API: Draft Community Group Report_. + * [PurchaseDetails dictionary](https://wicg.github.io/digital-goods/#purchaseDetails-dictionary) in _Digital Goods API: Draft Community Group Report_. MDN: * [Payment Request API](https://developer.mozilla.org/docs/Web/API/Payment_Request_API) at MDN > References > Web APIs. * [PaymentRequest](https://developer.mozilla.org/docs/Web/API/PaymentRequest) at MDN > References > Web APIs > PaymentRequest > Payment Request API. - * [Value (about PaymentCurrencyAmount object)](https://developer.mozilla.org/docs/Web/API/PaymentRequestEvent/total#value) in _PaymentRequestEvent: total property_ at MDN > References > Web APIs > PaymentRequestEvent, in Payment Handler API (experimental). + * [Value (about PaymentCurrencyAmount object)](https://developer.mozilla.org/docs/Web/API/PaymentRequestEvent/total#value) in _PaymentRequestEvent: total property_ at MDN > References > Web APIs > PaymentRequestEvent, in Payment Handler API (experimental). * [Intl.NumberFormat](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Intl/NumberFormat) at MDN. W3C: * [Payment Request API: Candidate Recommendation Draft](https://www.w3.org/TR/payment-request/) at W3C. * [PaymentRequest interface](https://www.w3.org/TR/payment-request/#dom-paymentrequest) in _Payment Request API: Candidate Recommendation Draft_ at W3C. * [show() method](https://www.w3.org/TR/payment-request/#dom-paymentrequest-show) in _Payment Request API: Candidate Recommendation Draft_ at W3C. - * [PaymentCurrencyAmount dictionary](https://www.w3.org/TR/payment-request/#dom-paymentcurrencyamount) in _Payment Request API: Candidate Recommendation Draft_ at W3C. + * [PaymentCurrencyAmount dictionary](https://www.w3.org/TR/payment-request/#dom-paymentcurrencyamount) in _Payment Request API: W3C Candidate Recommendation Draft_. From 962c79efbef5b59bd1cd40cf8b0e03bb8ddf9e6d Mon Sep 17 00:00:00 2001 From: Michael Hoffman Date: Wed, 18 Dec 2024 10:32:48 -0800 Subject: [PATCH 10/26] window object --- .../progressive-web-apps-chromium/how-to/digital-goods-api.md | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/microsoft-edge/progressive-web-apps-chromium/how-to/digital-goods-api.md b/microsoft-edge/progressive-web-apps-chromium/how-to/digital-goods-api.md index b1997989cd..4ff62d06f8 100644 --- a/microsoft-edge/progressive-web-apps-chromium/how-to/digital-goods-api.md +++ b/microsoft-edge/progressive-web-apps-chromium/how-to/digital-goods-api.md @@ -67,7 +67,7 @@ See: ## Checking whether the Digital Goods API is available -To detect whether you've correctly enabled the API on your website by using your origin trial token, check whether the `getDigitalGoodsService` method exists on the `Window` object: +To detect whether you've correctly enabled the API on your website by using your origin trial token, check whether the `getDigitalGoodsService` method exists on the `window` object: ```javascript if ('getDigitalGoodsService' in window) { @@ -85,7 +85,7 @@ See also: ## Connecting to the Microsoft Store Billing service (`window.getDigitalGoodsService` method) -Use the `getDigitalGoodsService` method of the `Window` object to connect to the Microsoft Store Billing service. A [DigitalGoodsService interface](https://wicg.github.io/digital-goods/#digitalgoodsservice) is returned. +Use the `getDigitalGoodsService` method of the `window` object to connect to the Microsoft Store Billing service. A [DigitalGoodsService interface](https://wicg.github.io/digital-goods/#digitalgoodsservice) is returned. The Digital Goods API was designed to be compatible with various browsers and digital stores, similar to how the Payment Request API is browser-agnostic and can be used with different payment providers. To retrieve an instance of the service for Microsoft Store Billing, pass the string `"https://store.microsoft.com/billing"` as the payment method to the `getDigitalGoodsService` method. From 962b308ff4ff94300db22b69ca370c301ac7573a Mon Sep 17 00:00:00 2001 From: Michael Hoffman Date: Wed, 18 Dec 2024 10:39:44 -0800 Subject: [PATCH 11/26] clean up See Also --- .../how-to/digital-goods-api.md | 9 +++------ 1 file changed, 3 insertions(+), 6 deletions(-) diff --git a/microsoft-edge/progressive-web-apps-chromium/how-to/digital-goods-api.md b/microsoft-edge/progressive-web-apps-chromium/how-to/digital-goods-api.md index 4ff62d06f8..9f654d803e 100644 --- a/microsoft-edge/progressive-web-apps-chromium/how-to/digital-goods-api.md +++ b/microsoft-edge/progressive-web-apps-chromium/how-to/digital-goods-api.md @@ -281,15 +281,13 @@ See also: ## See also -Local: +Origin trials: * [Use origin trials in Microsoft Edge](../../origin-trials/index.md) +* [Digital Goods API](https://developer.microsoft.com/microsoft-edge/origin-trials/trials/4b4a9ead-d912-4349-87b3-25e5e50b4f13) at _Microsoft Edge Developer_ > _Origin Trials_. -Other docsets: +Windows App Development: * [StoreProduct.InAppOfferToken Property](/uwp/api/windows.services.store.storeproduct.inappoffertoken) -Origin trials: -* [Digital Goods API](https://developer.microsoft.com/microsoft-edge/origin-trials/trials/4b4a9ead-d912-4349-87b3-25e5e50b4f13) at _Microsoft Edge Developer_ > _Origin Trials_. - GitHub: * [Digital Goods API For Microsoft Store PWA Explainer](https://github.com/MicrosoftEdge/MSEdgeExplainers/blob/main/PwaDigitalGoods/explainer.md) * [Digital Goods API: Draft Community Group Report](https://wicg.github.io/digital-goods/) at GitHub. @@ -304,7 +302,6 @@ GitHub: MDN: * [Payment Request API](https://developer.mozilla.org/docs/Web/API/Payment_Request_API) at MDN > References > Web APIs. * [PaymentRequest](https://developer.mozilla.org/docs/Web/API/PaymentRequest) at MDN > References > Web APIs > PaymentRequest > Payment Request API. - * [Value (about PaymentCurrencyAmount object)](https://developer.mozilla.org/docs/Web/API/PaymentRequestEvent/total#value) in _PaymentRequestEvent: total property_ at MDN > References > Web APIs > PaymentRequestEvent, in Payment Handler API (experimental). * [Intl.NumberFormat](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Intl/NumberFormat) at MDN. W3C: From f4d2d2ec94f288685d6ea489482f61b48c16f2cb Mon Sep 17 00:00:00 2001 From: Michael Hoffman Date: Wed, 18 Dec 2024 10:47:57 -0800 Subject: [PATCH 12/26] how acknowledge? --- .../how-to/digital-goods-api.md | 5 ++++- 1 file changed, 4 insertions(+), 1 deletion(-) diff --git a/microsoft-edge/progressive-web-apps-chromium/how-to/digital-goods-api.md b/microsoft-edge/progressive-web-apps-chromium/how-to/digital-goods-api.md index 9f654d803e..2631097272 100644 --- a/microsoft-edge/progressive-web-apps-chromium/how-to/digital-goods-api.md +++ b/microsoft-edge/progressive-web-apps-chromium/how-to/digital-goods-api.md @@ -212,7 +212,10 @@ W3C: The payment response returns a _purchase token_ string, which can be used for direct communication between your server and the service provider beyond the Digital Goods API. Such communication can allow you to independently verify information about the purchase before granting entitlements. -Some stores might require that you (the developer) acknowledge a purchase after the purchase has succeeded, to confirm that the purchase has been recorded. +Some stores might require that you (the developer) acknowledge a purchase after the purchase has succeeded, to confirm that the purchase has been recorded. + +See also: +* [PaymentResponse interface](https://www.w3.org/TR/payment-request/#paymentresponse-interface) in _Payment Request API: W3C Candidate Recommendation Draft_. From ada5765adb896dae612efa806fec98f5d0d80c1c Mon Sep 17 00:00:00 2001 From: Michael Hoffman Date: Thu, 19 Dec 2024 08:18:09 -0800 Subject: [PATCH 13/26] clean links per rvw --- .../how-to/digital-goods-api.md | 62 +++++++------------ 1 file changed, 21 insertions(+), 41 deletions(-) diff --git a/microsoft-edge/progressive-web-apps-chromium/how-to/digital-goods-api.md b/microsoft-edge/progressive-web-apps-chromium/how-to/digital-goods-api.md index 2631097272..7566d49b73 100644 --- a/microsoft-edge/progressive-web-apps-chromium/how-to/digital-goods-api.md +++ b/microsoft-edge/progressive-web-apps-chromium/how-to/digital-goods-api.md @@ -6,7 +6,7 @@ ms.author: msedgedevrel ms.topic: conceptual ms.service: microsoft-edge ms.subservice: pwa -ms.date: 12/18/2024 +ms.date: 12/19/2024 --- # Provide in-app purchases with the Digital Goods API @@ -24,7 +24,7 @@ The Digital Goods API is an interface between your PWA app and the Microsoft Sto See: * [Digital Goods API For Microsoft Store PWA Explainer](https://github.com/MicrosoftEdge/MSEdgeExplainers/blob/main/PwaDigitalGoods/explainer.md) -* [Digital Goods API: Draft Community Group Report](https://wicg.github.io/digital-goods/) +* [Digital Goods API specification](https://wicg.github.io/digital-goods/) @@ -79,7 +79,7 @@ if ('getDigitalGoodsService' in window) { ``` See also: -* [getDigitalGoodsService() method](https://wicg.github.io/digital-goods/#getdigitalgoodsservice-method) on the `Window` interface, in _Digital Goods API: Draft Community Group Report_. +* [getDigitalGoodsService() method](https://wicg.github.io/digital-goods/#getdigitalgoodsservice-method) on the `Window` interface, in _Digital Goods API specification_. @@ -110,8 +110,8 @@ try { This payment method `getDigitalGoodsService("https://store.microsoft.com/billing")` is available only for a PWA that's installed from the Microsoft Store, on Windows. No other settings are needed. See also: -* [getDigitalGoodsService() method](https://wicg.github.io/digital-goods/#getdigitalgoodsservice-method) on the `Window` interface, in _Digital Goods API: Draft Community Group Report_. -* [DigitalGoodsService interface](https://wicg.github.io/digital-goods/#digitalgoodsservice) in _Digital Goods API: Draft Community Group Report_. +* [getDigitalGoodsService() method](https://wicg.github.io/digital-goods/#getdigitalgoodsservice-method) on the `Window` interface, in _Digital Goods API specification_. +* [DigitalGoodsService interface](https://wicg.github.io/digital-goods/#digitalgoodsservice) in _Digital Goods API specification_. @@ -147,12 +147,11 @@ The item's `price` is a `PaymentCurrencyAmount` that contains the current price #### See also -Digital Goods API: Draft Community Group Report -* [DigitalGoodsService interface](https://wicg.github.io/digital-goods/#digitalgoodsservice) in _Digital Goods API: Draft Community Group Report_. - * [getDetails() method](https://wicg.github.io/digital-goods/#getDetails-method) in _Digital Goods API: Draft Community Group Report_. +Digital Goods API specification +* [getDetails() method](https://wicg.github.io/digital-goods/#getDetails-method) in _Digital Goods API specification_. -Learn.microsoft.com: -* [StoreProduct.InAppOfferToken Property](/uwp/api/windows.services.store.storeproduct.inappoffertoken). +Windows App Development: +* [StoreProduct.InAppOfferToken Property](/uwp/api/windows.services.store.storeproduct.inappoffertoken) W3C: * [PaymentCurrencyAmount dictionary](https://www.w3.org/TR/payment-request/#dom-paymentcurrencyamount) in _Payment Request API: W3C Candidate Recommendation Draft_. @@ -197,26 +196,9 @@ This will display the Store purchase UI to the user, where the user can view det In the `details` property of the payment response, a purchase token is returned. See also: - -MDN: * [PaymentRequest](https://developer.mozilla.org/docs/Web/API/PaymentRequest) at MDN > References > Web APIs > PaymentRequest > Payment Request API. * [PaymentRequest: show() method](https://developer.mozilla.org/en-US/docs/Web/API/PaymentRequest/show) at MDN > References > Web APIs > PaymentRequest > Payment Request API. -W3C: -* [PaymentRequest interface](https://www.w3.org/TR/payment-request/#dom-paymentrequest) in _Payment Request API: Candidate Recommendation Draft_ at W3C. - * [show() method](https://www.w3.org/TR/payment-request/#dom-paymentrequest-show) in _Payment Request API: Candidate Recommendation Draft_ at W3C. - - - -## Acknowledging a purchase - -The payment response returns a _purchase token_ string, which can be used for direct communication between your server and the service provider beyond the Digital Goods API. Such communication can allow you to independently verify information about the purchase before granting entitlements. - -Some stores might require that you (the developer) acknowledge a purchase after the purchase has succeeded, to confirm that the purchase has been recorded. - -See also: -* [PaymentResponse interface](https://www.w3.org/TR/payment-request/#paymentresponse-interface) in _Payment Request API: W3C Candidate Recommendation Draft_. - ## Consuming a purchase (`consume` method) @@ -232,7 +214,7 @@ digitalGoodsService.consume(purchaseToken); ``` See also: -* [consume() method](https://wicg.github.io/digital-goods/#consume-method) of the `DigitalGoodsService` interface, in _Digital Goods API: Draft Community Group Report_. +* [consume() method](https://wicg.github.io/digital-goods/#consume-method) of the `DigitalGoodsService` interface, in _Digital Goods API specification_. @@ -258,7 +240,7 @@ for (const purchase of purchaseList) { The `listPurchases` method doesn't return consumed products or expired subscriptions. See also: -* [listPurchases() method](https://wicg.github.io/digital-goods/#listPurchases-method) of the `DigitalGoodsService` interface, in _Digital Goods API: Draft Community Group Report_. +* [listPurchases() method](https://wicg.github.io/digital-goods/#listPurchases-method) of the `DigitalGoodsService` interface, in _Digital Goods API specification_. @@ -276,8 +258,8 @@ for (const purchase of purchaseList) { ``` See also: -* [listPurchaseHistory() method](https://wicg.github.io/digital-goods/#listPurchaseHistory-method) of the `DigitalGoodsService` interface, in _Digital Goods API: Draft Community Group Report_. -* [PurchaseDetails dictionary](https://wicg.github.io/digital-goods/#purchaseDetails-dictionary) in _Digital Goods API: Draft Community Group Report_. +* [listPurchaseHistory() method](https://wicg.github.io/digital-goods/#listPurchaseHistory-method) of the `DigitalGoodsService` interface, in _Digital Goods API specification_. +* [PurchaseDetails dictionary](https://wicg.github.io/digital-goods/#purchaseDetails-dictionary) in _Digital Goods API specification_. @@ -293,14 +275,14 @@ Windows App Development: GitHub: * [Digital Goods API For Microsoft Store PWA Explainer](https://github.com/MicrosoftEdge/MSEdgeExplainers/blob/main/PwaDigitalGoods/explainer.md) -* [Digital Goods API: Draft Community Group Report](https://wicg.github.io/digital-goods/) at GitHub. - * [getDigitalGoodsService() method](https://wicg.github.io/digital-goods/#getdigitalgoodsservice-method) on the `Window` interface, in _Digital Goods API: Draft Community Group Report_. - * [DigitalGoodsService interface](https://wicg.github.io/digital-goods/#digitalgoodsservice) in _Digital Goods API: Draft Community Group Report_. - * [getDetails() method](https://wicg.github.io/digital-goods/#getDetails-method) of the `DigitalGoodsService` interface, in _Digital Goods API: Draft Community Group Report_. - * [listPurchases() method](https://wicg.github.io/digital-goods/#listPurchases-method) of the `DigitalGoodsService` interface, in _Digital Goods API: Draft Community Group Report_. - * [listPurchaseHistory() method](https://wicg.github.io/digital-goods/#listPurchaseHistory-method) of the `DigitalGoodsService` interface, in _Digital Goods API: Draft Community Group Report_. - * [consume() method](https://wicg.github.io/digital-goods/#consume-method) of the `DigitalGoodsService` interface, in _Digital Goods API: Draft Community Group Report_. - * [PurchaseDetails dictionary](https://wicg.github.io/digital-goods/#purchaseDetails-dictionary) in _Digital Goods API: Draft Community Group Report_. +* [Digital Goods API specification](https://wicg.github.io/digital-goods/) at GitHub. + * [getDigitalGoodsService() method](https://wicg.github.io/digital-goods/#getdigitalgoodsservice-method) on the `Window` interface, in _Digital Goods API specification_. + * [DigitalGoodsService interface](https://wicg.github.io/digital-goods/#digitalgoodsservice) in _Digital Goods API specification_. + * [getDetails() method](https://wicg.github.io/digital-goods/#getDetails-method) of the `DigitalGoodsService` interface, in _Digital Goods API specification_. + * [listPurchases() method](https://wicg.github.io/digital-goods/#listPurchases-method) of the `DigitalGoodsService` interface, in _Digital Goods API specification_. + * [listPurchaseHistory() method](https://wicg.github.io/digital-goods/#listPurchaseHistory-method) of the `DigitalGoodsService` interface, in _Digital Goods API specification_. + * [consume() method](https://wicg.github.io/digital-goods/#consume-method) of the `DigitalGoodsService` interface, in _Digital Goods API specification_. + * [PurchaseDetails dictionary](https://wicg.github.io/digital-goods/#purchaseDetails-dictionary) in _Digital Goods API specification_. MDN: * [Payment Request API](https://developer.mozilla.org/docs/Web/API/Payment_Request_API) at MDN > References > Web APIs. @@ -309,6 +291,4 @@ MDN: W3C: * [Payment Request API: Candidate Recommendation Draft](https://www.w3.org/TR/payment-request/) at W3C. - * [PaymentRequest interface](https://www.w3.org/TR/payment-request/#dom-paymentrequest) in _Payment Request API: Candidate Recommendation Draft_ at W3C. - * [show() method](https://www.w3.org/TR/payment-request/#dom-paymentrequest-show) in _Payment Request API: Candidate Recommendation Draft_ at W3C. * [PaymentCurrencyAmount dictionary](https://www.w3.org/TR/payment-request/#dom-paymentcurrencyamount) in _Payment Request API: W3C Candidate Recommendation Draft_. From b4f0e711e21359c2dbb0fdf5877f58ebe24391ca Mon Sep 17 00:00:00 2001 From: Michael Hoffman Date: Thu, 19 Dec 2024 08:40:54 -0800 Subject: [PATCH 14/26] trim link descs --- .../how-to/digital-goods-api.md | 54 +++++++++---------- 1 file changed, 27 insertions(+), 27 deletions(-) diff --git a/microsoft-edge/progressive-web-apps-chromium/how-to/digital-goods-api.md b/microsoft-edge/progressive-web-apps-chromium/how-to/digital-goods-api.md index 7566d49b73..84081c78dc 100644 --- a/microsoft-edge/progressive-web-apps-chromium/how-to/digital-goods-api.md +++ b/microsoft-edge/progressive-web-apps-chromium/how-to/digital-goods-api.md @@ -61,7 +61,7 @@ To test the Digital Goods API in production, with your users, use an origin tria See: * [Use origin trials in Microsoft Edge](../../origin-trials/index.md) -* [Digital Goods API](https://developer.microsoft.com/microsoft-edge/origin-trials/trials/4b4a9ead-d912-4349-87b3-25e5e50b4f13) at _Microsoft Edge Developer_ > _Origin Trials_. +* [Digital Goods API](https://developer.microsoft.com/microsoft-edge/origin-trials/trials/4b4a9ead-d912-4349-87b3-25e5e50b4f13) at _Origin Trials_. @@ -79,7 +79,7 @@ if ('getDigitalGoodsService' in window) { ``` See also: -* [getDigitalGoodsService() method](https://wicg.github.io/digital-goods/#getdigitalgoodsservice-method) on the `Window` interface, in _Digital Goods API specification_. +* [getDigitalGoodsService() method](https://wicg.github.io/digital-goods/#getdigitalgoodsservice-method) on the `Window` interface. @@ -110,8 +110,8 @@ try { This payment method `getDigitalGoodsService("https://store.microsoft.com/billing")` is available only for a PWA that's installed from the Microsoft Store, on Windows. No other settings are needed. See also: -* [getDigitalGoodsService() method](https://wicg.github.io/digital-goods/#getdigitalgoodsservice-method) on the `Window` interface, in _Digital Goods API specification_. -* [DigitalGoodsService interface](https://wicg.github.io/digital-goods/#digitalgoodsservice) in _Digital Goods API specification_. +* [getDigitalGoodsService() method](https://wicg.github.io/digital-goods/#getdigitalgoodsservice-method) on the `Window` interface. +* [DigitalGoodsService interface](https://wicg.github.io/digital-goods/#digitalgoodsservice) @@ -148,16 +148,16 @@ The item's `price` is a `PaymentCurrencyAmount` that contains the current price #### See also Digital Goods API specification -* [getDetails() method](https://wicg.github.io/digital-goods/#getDetails-method) in _Digital Goods API specification_. +* [getDetails() method](https://wicg.github.io/digital-goods/#getDetails-method) Windows App Development: * [StoreProduct.InAppOfferToken Property](/uwp/api/windows.services.store.storeproduct.inappoffertoken) W3C: -* [PaymentCurrencyAmount dictionary](https://www.w3.org/TR/payment-request/#dom-paymentcurrencyamount) in _Payment Request API: W3C Candidate Recommendation Draft_. +* [PaymentCurrencyAmount dictionary](https://www.w3.org/TR/payment-request/#dom-paymentcurrencyamount) MDN: -* [Intl.NumberFormat](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Intl/NumberFormat) at MDN. +* [Intl.NumberFormat](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Intl/NumberFormat) @@ -196,8 +196,8 @@ This will display the Store purchase UI to the user, where the user can view det In the `details` property of the payment response, a purchase token is returned. See also: -* [PaymentRequest](https://developer.mozilla.org/docs/Web/API/PaymentRequest) at MDN > References > Web APIs > PaymentRequest > Payment Request API. - * [PaymentRequest: show() method](https://developer.mozilla.org/en-US/docs/Web/API/PaymentRequest/show) at MDN > References > Web APIs > PaymentRequest > Payment Request API. +* [PaymentRequest](https://developer.mozilla.org/docs/Web/API/PaymentRequest) at MDN. + * [PaymentRequest: show() method](https://developer.mozilla.org/en-US/docs/Web/API/PaymentRequest/show) @@ -214,7 +214,7 @@ digitalGoodsService.consume(purchaseToken); ``` See also: -* [consume() method](https://wicg.github.io/digital-goods/#consume-method) of the `DigitalGoodsService` interface, in _Digital Goods API specification_. +* [consume() method](https://wicg.github.io/digital-goods/#consume-method) of the `DigitalGoodsService` interface. @@ -240,7 +240,7 @@ for (const purchase of purchaseList) { The `listPurchases` method doesn't return consumed products or expired subscriptions. See also: -* [listPurchases() method](https://wicg.github.io/digital-goods/#listPurchases-method) of the `DigitalGoodsService` interface, in _Digital Goods API specification_. +* [listPurchases() method](https://wicg.github.io/digital-goods/#listPurchases-method) of the `DigitalGoodsService` interface. @@ -258,8 +258,8 @@ for (const purchase of purchaseList) { ``` See also: -* [listPurchaseHistory() method](https://wicg.github.io/digital-goods/#listPurchaseHistory-method) of the `DigitalGoodsService` interface, in _Digital Goods API specification_. -* [PurchaseDetails dictionary](https://wicg.github.io/digital-goods/#purchaseDetails-dictionary) in _Digital Goods API specification_. +* [listPurchaseHistory() method](https://wicg.github.io/digital-goods/#listPurchaseHistory-method) of the `DigitalGoodsService` interface. +* [PurchaseDetails dictionary](https://wicg.github.io/digital-goods/#purchaseDetails-dictionary) @@ -268,27 +268,27 @@ See also: Origin trials: * [Use origin trials in Microsoft Edge](../../origin-trials/index.md) -* [Digital Goods API](https://developer.microsoft.com/microsoft-edge/origin-trials/trials/4b4a9ead-d912-4349-87b3-25e5e50b4f13) at _Microsoft Edge Developer_ > _Origin Trials_. +* [Digital Goods API](https://developer.microsoft.com/microsoft-edge/origin-trials/trials/4b4a9ead-d912-4349-87b3-25e5e50b4f13) at _Origin Trials_. Windows App Development: * [StoreProduct.InAppOfferToken Property](/uwp/api/windows.services.store.storeproduct.inappoffertoken) GitHub: * [Digital Goods API For Microsoft Store PWA Explainer](https://github.com/MicrosoftEdge/MSEdgeExplainers/blob/main/PwaDigitalGoods/explainer.md) -* [Digital Goods API specification](https://wicg.github.io/digital-goods/) at GitHub. - * [getDigitalGoodsService() method](https://wicg.github.io/digital-goods/#getdigitalgoodsservice-method) on the `Window` interface, in _Digital Goods API specification_. - * [DigitalGoodsService interface](https://wicg.github.io/digital-goods/#digitalgoodsservice) in _Digital Goods API specification_. - * [getDetails() method](https://wicg.github.io/digital-goods/#getDetails-method) of the `DigitalGoodsService` interface, in _Digital Goods API specification_. - * [listPurchases() method](https://wicg.github.io/digital-goods/#listPurchases-method) of the `DigitalGoodsService` interface, in _Digital Goods API specification_. - * [listPurchaseHistory() method](https://wicg.github.io/digital-goods/#listPurchaseHistory-method) of the `DigitalGoodsService` interface, in _Digital Goods API specification_. - * [consume() method](https://wicg.github.io/digital-goods/#consume-method) of the `DigitalGoodsService` interface, in _Digital Goods API specification_. - * [PurchaseDetails dictionary](https://wicg.github.io/digital-goods/#purchaseDetails-dictionary) in _Digital Goods API specification_. +* [Digital Goods API specification](https://wicg.github.io/digital-goods/) + * [getDigitalGoodsService() method](https://wicg.github.io/digital-goods/#getdigitalgoodsservice-method) on the `Window` interface. + * [DigitalGoodsService interface](https://wicg.github.io/digital-goods/#digitalgoodsservice) + * [getDetails() method](https://wicg.github.io/digital-goods/#getDetails-method) + * [listPurchases() method](https://wicg.github.io/digital-goods/#listPurchases-method) + * [listPurchaseHistory() method](https://wicg.github.io/digital-goods/#listPurchaseHistory-method) + * [consume() method](https://wicg.github.io/digital-goods/#consume-method) + * [PurchaseDetails dictionary](https://wicg.github.io/digital-goods/#purchaseDetails-dictionary) MDN: -* [Payment Request API](https://developer.mozilla.org/docs/Web/API/Payment_Request_API) at MDN > References > Web APIs. - * [PaymentRequest](https://developer.mozilla.org/docs/Web/API/PaymentRequest) at MDN > References > Web APIs > PaymentRequest > Payment Request API. -* [Intl.NumberFormat](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Intl/NumberFormat) at MDN. +* [Payment Request API](https://developer.mozilla.org/docs/Web/API/Payment_Request_API) + * [PaymentRequest](https://developer.mozilla.org/docs/Web/API/PaymentRequest) +* [Intl.NumberFormat](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Intl/NumberFormat) W3C: -* [Payment Request API: Candidate Recommendation Draft](https://www.w3.org/TR/payment-request/) at W3C. - * [PaymentCurrencyAmount dictionary](https://www.w3.org/TR/payment-request/#dom-paymentcurrencyamount) in _Payment Request API: W3C Candidate Recommendation Draft_. +* [Payment Request API](https://www.w3.org/TR/payment-request/) + * [PaymentCurrencyAmount dictionary](https://www.w3.org/TR/payment-request/#dom-paymentcurrencyamount) From b7fe7bd59269232452b845ac8b2831c4bcacc020 Mon Sep 17 00:00:00 2001 From: Michael Hoffman Date: Thu, 19 Dec 2024 09:11:54 -0800 Subject: [PATCH 15/26] PaymentRequestEvent.methodData --- .../how-to/digital-goods-api.md | 14 ++++++++++---- 1 file changed, 10 insertions(+), 4 deletions(-) diff --git a/microsoft-edge/progressive-web-apps-chromium/how-to/digital-goods-api.md b/microsoft-edge/progressive-web-apps-chromium/how-to/digital-goods-api.md index 84081c78dc..d503f718ea 100644 --- a/microsoft-edge/progressive-web-apps-chromium/how-to/digital-goods-api.md +++ b/microsoft-edge/progressive-web-apps-chromium/how-to/digital-goods-api.md @@ -167,7 +167,12 @@ Use the `show` method of the `PaymentRequest` interface to purchase an item, aft Once your products and details are displayed to the user, you can implement the purchase flow by using the Payment Request API. When combined with the Digital Goods API, the only required input parameter is `methodData`. -Use the `supportedMethods` member of the `methodData`⁠⁠ parameter in the `PaymentRequest` interface to identify Microsoft Store Billing as the payment method with the string `"https://store.microsoft.com/billing"`. Then in the `data` member, pass along the item ID as the `sku`. +In the `PaymentRequest` constructor's `methodData`⁠⁠ parameter (type =`PaymentRequestEvent`): +* Use the `supportedMethods` member to identify Microsoft Store Billing as the payment method with the string `"https://store.microsoft.com/billing"`. +* In the `data` member, pass along the item ID as the `sku`: + + ```javascript const details = await digitalGoodsService.getDetails(['monthly_subscription']); @@ -196,8 +201,8 @@ This will display the Store purchase UI to the user, where the user can view det In the `details` property of the payment response, a purchase token is returned. See also: -* [PaymentRequest](https://developer.mozilla.org/docs/Web/API/PaymentRequest) at MDN. - * [PaymentRequest: show() method](https://developer.mozilla.org/en-US/docs/Web/API/PaymentRequest/show) +* [PaymentRequest: show() method](https://developer.mozilla.org/docs/Web/API/PaymentRequest/show) +* [PaymentRequestEvent: methodData property](https://developer.mozilla.org/docs/Web/API/PaymentRequestEvent/methodData) @@ -286,7 +291,8 @@ GitHub: MDN: * [Payment Request API](https://developer.mozilla.org/docs/Web/API/Payment_Request_API) - * [PaymentRequest](https://developer.mozilla.org/docs/Web/API/PaymentRequest) + * [PaymentRequest: show() method](https://developer.mozilla.org/docs/Web/API/PaymentRequest/show) + * [PaymentRequestEvent: methodData property](https://developer.mozilla.org/docs/Web/API/PaymentRequestEvent/methodData) * [Intl.NumberFormat](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Intl/NumberFormat) W3C: From ad84e8e9584013d0240651805231b2ef232e57f7 Mon Sep 17 00:00:00 2001 From: Michael Hoffman Date: Thu, 19 Dec 2024 09:24:07 -0800 Subject: [PATCH 16/26] link PaymentRequest ctor --- .../how-to/digital-goods-api.md | 7 +++++-- 1 file changed, 5 insertions(+), 2 deletions(-) diff --git a/microsoft-edge/progressive-web-apps-chromium/how-to/digital-goods-api.md b/microsoft-edge/progressive-web-apps-chromium/how-to/digital-goods-api.md index d503f718ea..e5fc90425a 100644 --- a/microsoft-edge/progressive-web-apps-chromium/how-to/digital-goods-api.md +++ b/microsoft-edge/progressive-web-apps-chromium/how-to/digital-goods-api.md @@ -201,7 +201,9 @@ This will display the Store purchase UI to the user, where the user can view det In the `details` property of the payment response, a purchase token is returned. See also: -* [PaymentRequest: show() method](https://developer.mozilla.org/docs/Web/API/PaymentRequest/show) +* [Payment Request API](https://developer.mozilla.org/docs/Web/API/Payment_Request_API) + * [PaymentRequest: PaymentRequest() constructor](https://developer.mozilla.org/docs/Web/API/PaymentRequest/PaymentRequest) + * [PaymentRequest: show() method](https://developer.mozilla.org/docs/Web/API/PaymentRequest/show) * [PaymentRequestEvent: methodData property](https://developer.mozilla.org/docs/Web/API/PaymentRequestEvent/methodData) @@ -291,8 +293,9 @@ GitHub: MDN: * [Payment Request API](https://developer.mozilla.org/docs/Web/API/Payment_Request_API) + * [PaymentRequest: PaymentRequest() constructor](https://developer.mozilla.org/docs/Web/API/PaymentRequest/PaymentRequest) * [PaymentRequest: show() method](https://developer.mozilla.org/docs/Web/API/PaymentRequest/show) - * [PaymentRequestEvent: methodData property](https://developer.mozilla.org/docs/Web/API/PaymentRequestEvent/methodData) +* [PaymentRequestEvent: methodData property](https://developer.mozilla.org/docs/Web/API/PaymentRequestEvent/methodData) * [Intl.NumberFormat](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Intl/NumberFormat) W3C: From e56bae14e4e3a1f90f1ac291da310bdf6733d989 Mon Sep 17 00:00:00 2001 From: Michael Hoffman Date: Thu, 19 Dec 2024 09:36:20 -0800 Subject: [PATCH 17/26] remove PaymentRequestEvent --- .../progressive-web-apps-chromium/how-to/digital-goods-api.md | 4 +--- 1 file changed, 1 insertion(+), 3 deletions(-) diff --git a/microsoft-edge/progressive-web-apps-chromium/how-to/digital-goods-api.md b/microsoft-edge/progressive-web-apps-chromium/how-to/digital-goods-api.md index e5fc90425a..bc24759ed3 100644 --- a/microsoft-edge/progressive-web-apps-chromium/how-to/digital-goods-api.md +++ b/microsoft-edge/progressive-web-apps-chromium/how-to/digital-goods-api.md @@ -167,7 +167,7 @@ Use the `show` method of the `PaymentRequest` interface to purchase an item, aft Once your products and details are displayed to the user, you can implement the purchase flow by using the Payment Request API. When combined with the Digital Goods API, the only required input parameter is `methodData`. -In the `PaymentRequest` constructor's `methodData`⁠⁠ parameter (type =`PaymentRequestEvent`): +In the `PaymentRequest` constructor's `methodData`⁠⁠ parameter: * Use the `supportedMethods` member to identify Microsoft Store Billing as the payment method with the string `"https://store.microsoft.com/billing"`. * In the `data` member, pass along the item ID as the `sku`: @@ -204,7 +204,6 @@ See also: * [Payment Request API](https://developer.mozilla.org/docs/Web/API/Payment_Request_API) * [PaymentRequest: PaymentRequest() constructor](https://developer.mozilla.org/docs/Web/API/PaymentRequest/PaymentRequest) * [PaymentRequest: show() method](https://developer.mozilla.org/docs/Web/API/PaymentRequest/show) -* [PaymentRequestEvent: methodData property](https://developer.mozilla.org/docs/Web/API/PaymentRequestEvent/methodData) @@ -295,7 +294,6 @@ MDN: * [Payment Request API](https://developer.mozilla.org/docs/Web/API/Payment_Request_API) * [PaymentRequest: PaymentRequest() constructor](https://developer.mozilla.org/docs/Web/API/PaymentRequest/PaymentRequest) * [PaymentRequest: show() method](https://developer.mozilla.org/docs/Web/API/PaymentRequest/show) -* [PaymentRequestEvent: methodData property](https://developer.mozilla.org/docs/Web/API/PaymentRequestEvent/methodData) * [Intl.NumberFormat](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Intl/NumberFormat) W3C: From d8fd3344c6bc36bece2593a22ef23132e99203ac Mon Sep 17 00:00:00 2001 From: Michael Hoffman Date: Thu, 19 Dec 2024 09:43:23 -0800 Subject: [PATCH 18/26] del w3 "Payment Req api" --- .../progressive-web-apps-chromium/how-to/digital-goods-api.md | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/microsoft-edge/progressive-web-apps-chromium/how-to/digital-goods-api.md b/microsoft-edge/progressive-web-apps-chromium/how-to/digital-goods-api.md index bc24759ed3..feab6dba7c 100644 --- a/microsoft-edge/progressive-web-apps-chromium/how-to/digital-goods-api.md +++ b/microsoft-edge/progressive-web-apps-chromium/how-to/digital-goods-api.md @@ -297,5 +297,4 @@ MDN: * [Intl.NumberFormat](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Intl/NumberFormat) W3C: -* [Payment Request API](https://www.w3.org/TR/payment-request/) - * [PaymentCurrencyAmount dictionary](https://www.w3.org/TR/payment-request/#dom-paymentcurrencyamount) +* [PaymentCurrencyAmount dictionary](https://www.w3.org/TR/payment-request/#dom-paymentcurrencyamount) From 53465544992c8e560ce82e1939f03026c6373e03 Mon Sep 17 00:00:00 2001 From: Michael Hoffman Date: Thu, 19 Dec 2024 09:46:20 -0800 Subject: [PATCH 19/26] on the > of the iface --- .../how-to/digital-goods-api.md | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/microsoft-edge/progressive-web-apps-chromium/how-to/digital-goods-api.md b/microsoft-edge/progressive-web-apps-chromium/how-to/digital-goods-api.md index feab6dba7c..a9baa0756e 100644 --- a/microsoft-edge/progressive-web-apps-chromium/how-to/digital-goods-api.md +++ b/microsoft-edge/progressive-web-apps-chromium/how-to/digital-goods-api.md @@ -79,7 +79,7 @@ if ('getDigitalGoodsService' in window) { ``` See also: -* [getDigitalGoodsService() method](https://wicg.github.io/digital-goods/#getdigitalgoodsservice-method) on the `Window` interface. +* [getDigitalGoodsService() method](https://wicg.github.io/digital-goods/#getdigitalgoodsservice-method) of the `Window` interface. @@ -110,7 +110,7 @@ try { This payment method `getDigitalGoodsService("https://store.microsoft.com/billing")` is available only for a PWA that's installed from the Microsoft Store, on Windows. No other settings are needed. See also: -* [getDigitalGoodsService() method](https://wicg.github.io/digital-goods/#getdigitalgoodsservice-method) on the `Window` interface. +* [getDigitalGoodsService() method](https://wicg.github.io/digital-goods/#getdigitalgoodsservice-method) of the `Window` interface. * [DigitalGoodsService interface](https://wicg.github.io/digital-goods/#digitalgoodsservice) @@ -282,7 +282,7 @@ Windows App Development: GitHub: * [Digital Goods API For Microsoft Store PWA Explainer](https://github.com/MicrosoftEdge/MSEdgeExplainers/blob/main/PwaDigitalGoods/explainer.md) * [Digital Goods API specification](https://wicg.github.io/digital-goods/) - * [getDigitalGoodsService() method](https://wicg.github.io/digital-goods/#getdigitalgoodsservice-method) on the `Window` interface. + * [getDigitalGoodsService() method](https://wicg.github.io/digital-goods/#getdigitalgoodsservice-method) of the `Window` interface. * [DigitalGoodsService interface](https://wicg.github.io/digital-goods/#digitalgoodsservice) * [getDetails() method](https://wicg.github.io/digital-goods/#getDetails-method) * [listPurchases() method](https://wicg.github.io/digital-goods/#listPurchases-method) From 8291243089025242ac1ede42de766989a5dcd753 Mon Sep 17 00:00:00 2001 From: Michael Hoffman Date: Thu, 19 Dec 2024 10:02:01 -0800 Subject: [PATCH 20/26] conjoin methodData sents --- .../how-to/digital-goods-api.md | 15 ++++++--------- 1 file changed, 6 insertions(+), 9 deletions(-) diff --git a/microsoft-edge/progressive-web-apps-chromium/how-to/digital-goods-api.md b/microsoft-edge/progressive-web-apps-chromium/how-to/digital-goods-api.md index a9baa0756e..1a65477f0d 100644 --- a/microsoft-edge/progressive-web-apps-chromium/how-to/digital-goods-api.md +++ b/microsoft-edge/progressive-web-apps-chromium/how-to/digital-goods-api.md @@ -161,18 +161,13 @@ MDN: -## Purchasing an item (`PaymentRequest.show` method) +## Purchasing an item (`PaymentRequest` constructor and `show` method) -Use the `show` method of the `PaymentRequest` interface to purchase an item, after you construct a request that contains the item details. +After your products and details are displayed to the user, implement the purchase flow by using the Payment Request API. To purchase an item, construct a request that contains the item details by using the `PaymentRequest` constructor, and then use the `show` method of the `PaymentRequest` object. -Once your products and details are displayed to the user, you can implement the purchase flow by using the Payment Request API. When combined with the Digital Goods API, the only required input parameter is `methodData`. - -In the `PaymentRequest` constructor's `methodData`⁠⁠ parameter: +When combined with the Digital Goods API, the only required input parameter for the `PaymentRequest` constructor is `methodData`. In that parameter: * Use the `supportedMethods` member to identify Microsoft Store Billing as the payment method with the string `"https://store.microsoft.com/billing"`. -* In the `data` member, pass along the item ID as the `sku`: - - +* In the `data` member, pass along the item ID as the `sku`. ```javascript const details = await digitalGoodsService.getDetails(['monthly_subscription']); @@ -204,6 +199,7 @@ See also: * [Payment Request API](https://developer.mozilla.org/docs/Web/API/Payment_Request_API) * [PaymentRequest: PaymentRequest() constructor](https://developer.mozilla.org/docs/Web/API/PaymentRequest/PaymentRequest) * [PaymentRequest: show() method](https://developer.mozilla.org/docs/Web/API/PaymentRequest/show) +* [PaymentResponse: details property](https://developer.mozilla.org/docs/Web/API/PaymentResponse/details) @@ -294,6 +290,7 @@ MDN: * [Payment Request API](https://developer.mozilla.org/docs/Web/API/Payment_Request_API) * [PaymentRequest: PaymentRequest() constructor](https://developer.mozilla.org/docs/Web/API/PaymentRequest/PaymentRequest) * [PaymentRequest: show() method](https://developer.mozilla.org/docs/Web/API/PaymentRequest/show) +* [PaymentResponse: details property](https://developer.mozilla.org/docs/Web/API/PaymentResponse/details) * [Intl.NumberFormat](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Intl/NumberFormat) W3C: From 3de6c4724a80b4fc31089707578a42f4c7d5b2a4 Mon Sep 17 00:00:00 2001 From: Michael Hoffman Date: Thu, 19 Dec 2024 10:08:12 -0800 Subject: [PATCH 21/26] show method of request obj --- .../progressive-web-apps-chromium/how-to/digital-goods-api.md | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/microsoft-edge/progressive-web-apps-chromium/how-to/digital-goods-api.md b/microsoft-edge/progressive-web-apps-chromium/how-to/digital-goods-api.md index 1a65477f0d..6a3c57f7e6 100644 --- a/microsoft-edge/progressive-web-apps-chromium/how-to/digital-goods-api.md +++ b/microsoft-edge/progressive-web-apps-chromium/how-to/digital-goods-api.md @@ -181,13 +181,13 @@ const request = new PaymentRequest([ ]); ``` -Then call the `show` method to start the payment flow: +Then call the `show` method of the `PaymentRequest` object, to start the payment flow: ```javascript const response = await request.show(); ``` -This will display the Store purchase UI to the user, where the user can view details about the product that they're trying to purchase. During this process, the current browser session is temporarily disabled until the purchase flow is complete. The user can either cancel the transaction, or proceed with the payment: +This displays the Store purchase UI to the user, where the user can view details about the product that they're trying to purchase. During this process, the current browser session is temporarily disabled until the purchase flow is complete. The user can either cancel the transaction, or proceed with the payment: * If the user cancels the payment, the Promise that's returned by the `show` method will be rejected with an error. From 611974f438dd87862bfa02229afd786a401a4e62 Mon Sep 17 00:00:00 2001 From: Michael Hoffman Date: Thu, 19 Dec 2024 10:09:58 -0800 Subject: [PATCH 22/26] why call show() --- .../progressive-web-apps-chromium/how-to/digital-goods-api.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/microsoft-edge/progressive-web-apps-chromium/how-to/digital-goods-api.md b/microsoft-edge/progressive-web-apps-chromium/how-to/digital-goods-api.md index 6a3c57f7e6..3aaaa851d0 100644 --- a/microsoft-edge/progressive-web-apps-chromium/how-to/digital-goods-api.md +++ b/microsoft-edge/progressive-web-apps-chromium/how-to/digital-goods-api.md @@ -163,7 +163,7 @@ MDN: ## Purchasing an item (`PaymentRequest` constructor and `show` method) -After your products and details are displayed to the user, implement the purchase flow by using the Payment Request API. To purchase an item, construct a request that contains the item details by using the `PaymentRequest` constructor, and then use the `show` method of the `PaymentRequest` object. +After your products and details are displayed to the user, implement the purchase flow by using the Payment Request API. To purchase an item, first construct a request that contains the item details by using the `PaymentRequest` constructor, and then use the `show` method of the `PaymentRequest` object to start the payment flow. When combined with the Digital Goods API, the only required input parameter for the `PaymentRequest` constructor is `methodData`. In that parameter: * Use the `supportedMethods` member to identify Microsoft Store Billing as the payment method with the string `"https://store.microsoft.com/billing"`. From bb9d6172d518a5d87cfd93c284cf1527b0d62b6a Mon Sep 17 00:00:00 2001 From: Michael Hoffman Date: Thu, 19 Dec 2024 10:22:24 -0800 Subject: [PATCH 23/26] move misc api link down --- .../how-to/digital-goods-api.md | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/microsoft-edge/progressive-web-apps-chromium/how-to/digital-goods-api.md b/microsoft-edge/progressive-web-apps-chromium/how-to/digital-goods-api.md index 3aaaa851d0..9fdcf89171 100644 --- a/microsoft-edge/progressive-web-apps-chromium/how-to/digital-goods-api.md +++ b/microsoft-edge/progressive-web-apps-chromium/how-to/digital-goods-api.md @@ -272,9 +272,6 @@ Origin trials: * [Use origin trials in Microsoft Edge](../../origin-trials/index.md) * [Digital Goods API](https://developer.microsoft.com/microsoft-edge/origin-trials/trials/4b4a9ead-d912-4349-87b3-25e5e50b4f13) at _Origin Trials_. -Windows App Development: -* [StoreProduct.InAppOfferToken Property](/uwp/api/windows.services.store.storeproduct.inappoffertoken) - GitHub: * [Digital Goods API For Microsoft Store PWA Explainer](https://github.com/MicrosoftEdge/MSEdgeExplainers/blob/main/PwaDigitalGoods/explainer.md) * [Digital Goods API specification](https://wicg.github.io/digital-goods/) @@ -295,3 +292,6 @@ MDN: W3C: * [PaymentCurrencyAmount dictionary](https://www.w3.org/TR/payment-request/#dom-paymentcurrencyamount) + +Windows App Development: +* [StoreProduct.InAppOfferToken Property](/uwp/api/windows.services.store.storeproduct.inappoffertoken) From 07796a37e030f38e98d55adee9723c8d11f88771 Mon Sep 17 00:00:00 2001 From: Michael Hoffman Date: Thu, 19 Dec 2024 10:39:49 -0800 Subject: [PATCH 24/26] express lead-in like code listing --- .../how-to/digital-goods-api.md | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/microsoft-edge/progressive-web-apps-chromium/how-to/digital-goods-api.md b/microsoft-edge/progressive-web-apps-chromium/how-to/digital-goods-api.md index 9fdcf89171..d97c7d1f46 100644 --- a/microsoft-edge/progressive-web-apps-chromium/how-to/digital-goods-api.md +++ b/microsoft-edge/progressive-web-apps-chromium/how-to/digital-goods-api.md @@ -165,9 +165,9 @@ MDN: After your products and details are displayed to the user, implement the purchase flow by using the Payment Request API. To purchase an item, first construct a request that contains the item details by using the `PaymentRequest` constructor, and then use the `show` method of the `PaymentRequest` object to start the payment flow. -When combined with the Digital Goods API, the only required input parameter for the `PaymentRequest` constructor is `methodData`. In that parameter: -* Use the `supportedMethods` member to identify Microsoft Store Billing as the payment method with the string `"https://store.microsoft.com/billing"`. -* In the `data` member, pass along the item ID as the `sku`. +When combined with the Digital Goods API, the only required input parameter for the `PaymentRequest` constructor is `methodData`. In the constructor's parameter: +* In the `supportedMethods` member, specify Microsoft Store Billing as the payment method, as the string `'https://store.microsoft.com/billing'`. +* In the `data` member, pass along the `itemId` as the `sku`. ```javascript const details = await digitalGoodsService.getDetails(['monthly_subscription']); From cf155f276595ad13828ceb98aacfd369be76c07f Mon Sep 17 00:00:00 2001 From: Michael Hoffman Date: Thu, 19 Dec 2024 10:51:40 -0800 Subject: [PATCH 25/26] clean up Response --- .../how-to/digital-goods-api.md | 10 +++++----- 1 file changed, 5 insertions(+), 5 deletions(-) diff --git a/microsoft-edge/progressive-web-apps-chromium/how-to/digital-goods-api.md b/microsoft-edge/progressive-web-apps-chromium/how-to/digital-goods-api.md index d97c7d1f46..af79ac96d7 100644 --- a/microsoft-edge/progressive-web-apps-chromium/how-to/digital-goods-api.md +++ b/microsoft-edge/progressive-web-apps-chromium/how-to/digital-goods-api.md @@ -191,15 +191,14 @@ This displays the Store purchase UI to the user, where the user can view details * If the user cancels the payment, the Promise that's returned by the `show` method will be rejected with an error. -* If the user successfully pays and completes the purchase, the Promise will resolve with a `PaymentResponse`. - -In the `details` property of the payment response, a purchase token is returned. +* If the user successfully pays and completes the purchase, the Promise will resolve with a `PaymentResponse`. In the `details` property of the payment response, a purchase token is returned. See also: * [Payment Request API](https://developer.mozilla.org/docs/Web/API/Payment_Request_API) * [PaymentRequest: PaymentRequest() constructor](https://developer.mozilla.org/docs/Web/API/PaymentRequest/PaymentRequest) * [PaymentRequest: show() method](https://developer.mozilla.org/docs/Web/API/PaymentRequest/show) -* [PaymentResponse: details property](https://developer.mozilla.org/docs/Web/API/PaymentResponse/details) + * [PaymentResponse](https://developer.mozilla.org/docs/Web/API/PaymentResponse/) + * [PaymentResponse: details property](https://developer.mozilla.org/docs/Web/API/PaymentResponse/details) @@ -287,7 +286,8 @@ MDN: * [Payment Request API](https://developer.mozilla.org/docs/Web/API/Payment_Request_API) * [PaymentRequest: PaymentRequest() constructor](https://developer.mozilla.org/docs/Web/API/PaymentRequest/PaymentRequest) * [PaymentRequest: show() method](https://developer.mozilla.org/docs/Web/API/PaymentRequest/show) -* [PaymentResponse: details property](https://developer.mozilla.org/docs/Web/API/PaymentResponse/details) + * [PaymentResponse](https://developer.mozilla.org/docs/Web/API/PaymentResponse/) + * [PaymentResponse: details property](https://developer.mozilla.org/docs/Web/API/PaymentResponse/details) * [Intl.NumberFormat](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Intl/NumberFormat) W3C: From e7192dc2a86475fcd0c9a93638d48dc167c462f0 Mon Sep 17 00:00:00 2001 From: Michael Hoffman Date: Thu, 19 Dec 2024 11:02:05 -0800 Subject: [PATCH 26/26] clarif PurchaseDetails list --- .../progressive-web-apps-chromium/how-to/digital-goods-api.md | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/microsoft-edge/progressive-web-apps-chromium/how-to/digital-goods-api.md b/microsoft-edge/progressive-web-apps-chromium/how-to/digital-goods-api.md index af79ac96d7..697f78a37d 100644 --- a/microsoft-edge/progressive-web-apps-chromium/how-to/digital-goods-api.md +++ b/microsoft-edge/progressive-web-apps-chromium/how-to/digital-goods-api.md @@ -247,7 +247,9 @@ See also: ## Getting the purchase history (`listPurchaseHistory` method) -Use the `listPurchaseHistory` method of the `DigitalGoodsService` interface to get the purchase history. This method returns a list that shows the most recent purchase made by the user for each item, regardless of whether the purchase is expired, canceled, or consumed. This method returns a list of `PurchaseDetails` containing the `itemId` and `purchaseToken` for each purchase. +Use the `listPurchaseHistory` method of the `DigitalGoodsService` interface to get the purchase history. + +This method returns a list of `PurchaseDetails` containing the `itemId` and `purchaseToken` for each purchase. The list includes the most recent purchase made by the user for each item, regardless of whether the purchase is expired, canceled, or consumed. ```javascript const purchaseList = await digitalGoodsService.listPurchaseHistory();