Re: [w3c/browser-payment-api] Detecting Payment Method Availability (#316)

@mattdevaney: After chatting with @ianbjacobs, we've come up with a solution that should resolve your issue: pre-query `canMakePayment()` on the merchant website before redirecting to your hosted site. As I understand your system currently is to give a merchant a link like this to embed on their website:

````html
<a class="worldpay-button"
   href="https://worldpay.com/checkout?cart=item1,1,USD,5.99">Buy</a>
````

In addition to this link, you should provide a javascript snippet that looks like this:

````html
<script src="https://worldpay.com/check-payment-request.js"></script>
````

The contents of the javascript file should check whether PaymentRequest is available and update the `Checkout` links on the site.

````javascript
if (PaymentRequest in window) {
  try {
    var pr = new PaymentRequest(supportedMethods, shoppingCartContents);
    if (pr.canMakePayment) {
      pr.canMakePayment()
        .then(function(result) {
          if (result) {
            var buttons = document.getElementsByClassName("worldpay-button");
            var i;
            for (i = 0; i < buttons.length; i++) {
              buttons[i].href += "&use-payment-request=true";
            }
          }
        })
        .catch(function(error) {
          logError(error);
        });
    } catch(error) {
      logError(error);
    }
  }
}
````

There're a several ways that you can customize the `supportedMethods` in the `canMakePayment()` method.

1. Custom JS file for each merchant, .e.g., `https://worldpay.com/payment-request/mom-and-pop-shop/can-make-payment.js`.
1. Custom JS file for each combination if payment methods, .e.g, `https://worldpay.com/payment-request/can-make-payment-visa-mastercard-bobpay.js`.
1. Server-side generated JS file from a template based on URL parameters, e.g., `https://worldpay.com/check-payment-request.js?methods=visa,mastercard,bobpay`.

It'd be great to hear what you and other hosted solution organizations (Shopify?) think about this solution.

-- 
You are receiving this because you are subscribed to this thread.
Reply to this email directly or view it on GitHub:
https://github.com/w3c/browser-payment-api/pull/316#issuecomment-265003258