Tokenize cards with Secure Fields

Secure Fields is a highly customizable payment form, which allows customers to enter their payment details directly on your checkout page or in your app. We process these and exchange them for a secure token. You can then use this token to request a payment, without having to process or store any sensitive information yourself.

Secure Fields uses iframes for handling payment information, so you remain PCI-compliant. Your customer inputs their card details directly into our iframes, then we send you a token representing those details, so you can request a payment.

📘
Secure Fields are useful to tokenize cards and keep the PCI scope away. They do not intervene in the payment acceptance process. If you wish an end-to-end payment acceptance solution for your clients, look into our Drop-in solution.

What is tokenization?

Tokenization refers to the process of collecting sensitive payment information directly and returning a short-term, single-use token that represents this information. During this process, we handle the sensitive payment information, so responsibility for PCI compliance remains with us. You then use that token to request a payment using our Unified Payments API.

How it works

Inject secured input fields inside iFrames into your HTML containers
Customize the look and feel of your input fields with CSS
Control the input fields behavior via Javascript

📘
To make sure your frontend can communicate securely with Payrails, you must first fetch configurations from your server side application. See detailed endpoint reference here.

Here's a simple tokenization flow with the surface covered by the SDK colored in blue:

After the SDK is initialized, you can leverage the SDK features to customize the user experience:

Custom field validation and errors
Subscribe and react to events happening inside the form
Customize the style with JSS
Save your tokenized card and get a payment instrument id for future references

The Secure Fields are available for Web and React Native applications.