Using the Javascript API

You can use our Javascript API to collect and submit the customer’s payment information from the browser using Javascript.

In contrast to the Secure Fields Form, you create the payment form yourself and control how the information is collected. This option reduces your PCI scope, requiring you to be SAQ A-EP compliant.

Including the Javascript SDK in your Checkout Page

To get started, include the Javascript SDK in your checkout page. Then call POS.setEnvironment() to set the environment (test or live) you want to use and call POS.setPublicKey() to authenticate yourself.

<html>
  <script language="JavaScript" type="text/javascript" src="https://js.paymentsos.com/v2/latest/token.min.js"></script>
  <script>
    POS.setEnvironment("test"); // Set your environment
    POS.setPublicKey("99346d84-5186-4221-9c16-dc51a8de27fb"); // Set your public key
  </script>
  <body>
    ...
  </body>
</html>

https://js.paymentsos.com/latest/token.min.js provides you with the latest release of our Javascript library. We recommend using the latest release for the most up to date security enhancements. However, if you prefer a static version of our Javascript library, then you can include the version number when referencing the script:

<script language="JavaScript" type="text/javascript" src="https://js.paymentsos.com/v2/0.0.1/token.min.js"></script>

Now collect and tokenize your customer’s card details. When your customer selects a card to make a payment, you’ll send the card’s token in the authorization or charge request.

To tokenize the card details, call POS.tokenize(), passing in the attributes required by the Create Token API. Register a callback in which to receive the token. You then send the token to your server, where you use it to accept a payment.

<script>
  POS.tokenize({
        "token_type": "credit_card",
        "holder_name": "MR C D HOLDER",
        "expiration_date": "09-2019",
        "card_number": "4111111111111111"
    },
    function (result) {

      console.log ("result obtained"+result);

        // Check for errors, if all is good, then proceed!
    }
  );
</script>

Using the JavaScript API to Collect the CVV Code

You can also use the JavaScript API to collect and tokenize just the CVV code. This is useful if you allow users to save their card details for use in future payments, but still need to pass the CVV code with each transaction. For more information, see Collecting the CVV Code using the JavaScript API.

What’s next?

Now that you’ve collected your customer’s card information, proceed to accept a payment.

Last modified January 31, 2022