Navigator.mozPay()

The mozPay function is used to perform payments. It enables an app to use in-app payments.

Syntax

var request = navigator.mozPay(jwts);

Parameters

jwts

An array of JSON Web Tokens.

Return value

A DOMRequest object.

Example

// Begin a purchase. Typically you would attach this to the click handler on a Buy button.
purchaseSomething("A nice unicorn");

function purchaseSomething(productID) {
  var xhr = new XMLHttpRequest();
  xhr.responseType = 'json';

  // Prepare to send a productID to your server and
  // receive an array of JWTs.
  xhr.open('POST', '/create_jwts');

  xhr.addEventListener('load', function () {
    // Retrieve the JWTs and a transactionID from a JSON response, such as:
    // {"jwts": ["jwt1...", "jwt2..."], "transactionID": "1234"}
    var jwts = xhr.response.jwts;
    var transactionID = xhr.response.transactionID;

    // Pass the JSON Web Tokens to the payment provider
    var request = navigator.mozPay(jwts);

    // Set up the success/error handler for the payment window.
    request.onsuccess = function () {
      console.log('The user payment flow completed successfully');
      // Although the payment flow completed, you need to poll your server and wait 
      // for a verified payment result to be sure the payment went through.
      waitForPaymentResult(transactionID);
    };
    request.onerror = function () {
      console.log('Sorry, the payment flow had an error:', this.error.name);
    };
  })

  // Initiate the payment request by sending information to
  // get the signed JSON Web Tokens. In our example, productID 
  // is the ID of the product the user wants to puchase.
  xhr.send(productID);
}

function waitForPaymentResult(transactionID) {
  var xhr = new XMLHttpRequest();
  xhr.responseType = 'json';

  // Prepare to check if a postback/chargeback has been received for transactionID.
  xhr.open('GET', '/payment_result/' + transactionID);

  xhr.addEventListener('load', function () {
    // Retrieve the result, such as:
    // {"result": "postback received"} or {"result": "still waiting"}
    if (xhr.response.result == 'postback received') {
      // A postback notice was received and you verified the incoming JWT signature.
      console.log('Success! The product has been purchased');
    } else {
      // No postback/chargeback has been sent to your server yet. Try again in 3 seconds.
      window.setTimeout(function() { waitForPaymentResult(transactionID); }, 3000);
    }
  });

  // Send the request to check the transactionID status.
  xhr.send();
}

Specifications

Not part of any specification. However this topic is heavily discussed at W3C in the Web Payment Community Group.

See also

• In-app Payment
• Mozilla Web Payment full specification on the Mozilla Wiki
• DOMRequest