Payments

Tokenization

20min

Introduction

Tokenization converts sensitive data into non-sensitive data (tokens). It allows businesses to securely store and transmit sensitive data while protecting user privacy. This guide explains tokenization, why you should use Moyasar, and how to get started.



How does tokenization work?

Tokenization is like having a locked safe for your customers sensitive information. When a customer makes a payment on your website, instead of storing their credit card information, you can use Moyasar's tokenization service to generate a random string of characters, called a token, to represent their sensitive data. The token is securely stored by Moyasar, and only the token is transmitted to your system.



Why use Moyasar's tokenization services?

Moyasar's tokenization service offers several benefits over traditional methods of handling sensitive data. For example:

  • Reduce the risk of data breaches and fraud.
  • Improve the user experience by eliminating the need to repeatedly enter sensitive data.
  • Save time and resources by automating the process of handling sensitive data.
  • Moyasar also has robust security measures in place to protect user data, including encryption, data backup, and compliance with industry standards. e.g.PCI DSS Level 1.


What types of cards can Moyasar tokenize?

Moyasar can be used to tokenize the following cards:

  • Mada
  • Visa
  • Mastercard


Before Starting

To start using Moyasar's tokenization services, follow these steps:



Setting Up Moyasar's Form

Step 1: Include Moyasar's Scripts

The current up-to-date version of the library is 1.14.0 which can be used through the official Moyasar CDN server:

  • https://cdn.moyasar.com/mpf/1.14.0/moyasar.js
  • https://cdn.moyasar.com/mpf/1.14.0/moyasar.css

You can start the integration by including the previous URLs in the head section of your website as follows:

HTML


Step 2: Instantiating The Payment Form

Once you decide on a good place for the form, add an empty <div> tag and then invoke the init method on our global Moyasar class.

HTML


Step 3: Enable Tokenization

To enable tokenization, add the credit_card configuration option to your form, here is an example:

HTML




. Resulting Form



The form uses our Payment APIs to perform required actions, you can learn more about it on Moyasar API Docs.

Learn more about available configuration keys here form configuration.



Step 4: Save Payment ID & Token

Save the payment ID and token before redirecting the user to 3-D Secure, which grants you the ability to verify payment details in case your user's connection drops.

To save the payment ID and the credit card token you can provide the on_completed configuration option with a URL, or a callback function. You will get a payment object containing the details of the payment, here is an example:

JSON


Option 1: URL

When providing a URL the library will make a POST request containing the payment object, here is an example:

JS


The URL can be anything you choose, but keep in mind your endpoint must return a 201 Created HTTP status code for the form to proceed.

If any other status code is returned, a network connection error will appear, and redirection to 3D Secure will be aborted.

Option 2: Callback Function

The other option is to provide a callback function, and due to the asynchronous nature of JavaScript, you need to return a Promise object which lets the form wait until your task is completed.

JS



Best Practices For Using Tokenization Services

To ensure the security of your data when using tokenization services, follow these best practices:

  • Only store the tokenized data and avoid storing the original data.
  • Store the token in a safe location.

Resources

For more information about tokenization please see the documentation for Moyasar API tokenization.

Updated 15 Aug 2024
Did this page help you?