Payment Request API: What is the Payee Account?

Question

I was looking at the Payment Request API which is apparently available on some browsers but I was wondering, where/how do you set the account to which the payments get sent? I see nowhere in the following code that specifies an account to which the payment will be sent upon success:

function onBuyClicked() {
  if (!window.PaymentRequest) {
    // PaymentRequest API is not available. Forwarding to
    // legacy form based experience.
    location.href = '/checkout';
    return;
  }

  // Supported payment methods
  var supportedInstruments = [{
      supportedMethods: ['basic-card']
      data: {
        supportedNetworks: [
          'visa', 'mastercard', 'amex', 'discover',
          'diners', 'jcb', 'unionpay'
        ]
      }
  }];

  // Checkout details
  var details = {
    displayItems: [{
      label: 'Original donation amount',
      amount: { currency: 'USD', value: '65.00' }
    }, {
      label: 'Friends and family discount',
      amount: { currency: 'USD', value: '-10.00' }
    }],
    total: {
      label: 'Total due',
      amount: { currency: 'USD', value : '55.00' }
    }
  };

  // 1. Create a `PaymentRequest` instance
  var request = new PaymentRequest(supportedInstruments, details);

  // 2. Show the native UI with `.show()`
  request.show()
  // 3. Process the payment
  .then(result => {
    // POST the payment information to the server
    return fetch('/pay', {
      method: 'POST',
      credentials: 'include',
      headers: {
        'Content-Type': 'application/json'
      },
      body: JSON.stringify(result.toJSON())
    }).then(response => {
      // 4. Display payment results
      if (response.status === 200) {
        // Payment successful
        return result.complete('success');
      } else {
        // Payment failure
        return result.complete('fail');
      }
    }).catch(() => {
      return result.complete('fail');
    });
  });
}

document.querySelector('#start').addEventListener('click', onBuyClicked);

Ref. https://developers.google.com/web/fundamentals/discovery-and-monetization/payment-request/deep-dive-into-payment-request

Ref. https://www.w3.org/TR/payment-request/

Answer 1

Long story short: you don't.

Payment Request API is not a replacement for payment processors. The browser itself has no means to process the funds transfer to your account - it can't even validate whether the provided payment method is valid (though Android Pay can do this).

Per Introducing the Payment Request API doc (emphasis mine):

...

The browser then presents the payments UI to the user, who selects a payment method and authorizes the transaction. A payment method can be as straightforward as a credit card that is already stored by the browser, or as esoteric as third-party application written specifically to deliver payments to the site (this functionality is coming soon). After the user authorizes the transaction, all the necessary payment details are sent directly back to the site. For example, for a credit card payment, the site will get back a card number, a cardholder name, an expiration date, and a CVC.

...

In other words, the Payment Request API is just an easier, safer way for you to collect the user's card number and other info necessary to process a payment. Once you receive this information, it's pretty much the same as if the user submitted it via a normal form. You still need a payment processor (or something similar) to actually create a transaction.