Skip to main content

Documentation

Card on File With 3DS Verification

For improved security, 3D Secure requires customers to provide additional details when using card on file for online payments.

Some issuers in Europe and Asia require 3D Secure for card verification. For this reason, when a customer uses their card for the first time on your website and chooses to store their card information for future purchases, they are required to confirm the transaction using 3D Secure. Once the customer has verified their card and it has been successfully stored as a token, they will not need to verify their card again for future purchases.

Common benefits include:

  • Easier and quicker payment process results in better checkout experience for your customer.

  • Liabilities owing to any chargebacks are passed from the merchant to the issuer.

  • Reduces the risk of fraud and makes payments safer.

  • No extra costs for the additional step of 3DS verification which provides increased security for your transactions.

Card on File With 3DS Verification Workflow

Finding the specific card payment methods you'll accept and the corresponding required fields that customers fill out is described under How it Works.

Step 1: Authorize the Card
authorize-card.jpg

  1. Your customer checks out with an item, visits payment page with a list of payment methods, and chooses card.

  2. Your website or app requests the card details from Rapyd and present to the customer.

  3. The customer completes the required fields and then selects Register or Pay.

  4. Your website sends the request to Rapyd to process the card payment.

  5. Rapyd processes the $0 Auth request and sends a redirect URL to a 3DS processing site.

Step 2: Secure and Complete the $0 Auth Transaction
secure-complete-auth.jpg

  1. Your website redirects the customer to the 3DS processing site, and they follow instructions for authentication transaction.

  2. The 3DS processing site notifies Rapyd of the transaction outcome and redirects the customer to your success or failure page.

  3. Rapyd sends the completed transaction details including the card token to your website.

  4. Your website will save the card token.

How Card on File With 3DS Works
Find Available Payment Methods

Check which payment methods are accepted in your customer's country.

Note: For illustration purposes, GB and GBP are used for country and currency in the sample codes.

3DS Card Layer

3DS layer is not available in all regions. It is automatically triggered when a regulatory mandate such as PSD2 requires it.

For more details on how to prevent fraudulent transactions, see Rapyd Protect.

To do that, use List Payment Methods by Country with the following parameters:

Description of Query Parameters

Query Parameter

Description

country

Enter GB as the country code.

currency

Enter GBP as the currency code.

List Payment Methods by Country Request

Request for a list of all available GB payment methods.

    • Request

      • // Request URL: GET https://sandboxapi.rapyd.net/v1/payment_methods/country?country=GB&currency=GBP

// Message body absent

    • .NET Core

      • using System;

namespace RapydApiRequestSample
{
    class Program
    {
        static void Main(string[] args)
        {
            try
            {
                string country = "GB";
                string currency = "GBP";

                string result = RapydApiRequestSample.Utilities.MakeRequest("GET", $"/v1/payment_methods/country?country={country}&currency={currency}");

                Console.WriteLine(result);
            }
            catch (Exception e)
            {
                Console.WriteLine("Error completing request: " + e.Message);
            }
        }
    }
}

    • JavaScript

      • const makeRequest = require('<path-to-your-utility-file>/utilities').makeRequest;

async function main() {
  try {
    const result = await makeRequest('GET', '/v1/payment_methods/country?country=GB&currency=GBP');

    console.log(result);
  } catch (error) {
    console.error('Error completing request', error);
  }
}

    • PHP

      • <?php
$path = $_SERVER['DOCUMENT_ROOT'];
$path .= "/<path-to-your-utility-file>/utilities.php";
include($path);

try {
    $object = make_request('get', '/v1/payment_methods/country?country=GB&currency=GBP');
    var_dump($object);
} catch (Exception $e) {
    echo "Error: $e";
}
?>

    • Python

      • from pprint import pprint

from utilities import make_request

country = 'GB'
currency = 'GBP'
results = make_request(method='get',
                       path=f'/v1/payment_methods/country?country={country}&currency={currency}')
pprint(results)
List Payment Methods by Country Response

Payment Method Type Object describes the fields in the response.

    • Response

      • {
    "status": {
        "error_code": "",
        "status": "SUCCESS",
        "message": "",
        "response_code": "",
        "operation_id": "cfa35a73-aa0b-4e7e-839c-4c3b6149edd7"
    },
    "data": [{
            "type": "gb_visa_card",
            "name": "Visa",
            "category": "card",
            "image": "https://iconslib.rapyd.net/checkout/gb_visa_card.png",
            "country": "gb",
            "payment_flow_type": "card",
            "currencies": [
                "GBP"
            ],
            "status": 1,
            "is_cancelable": false,
            "payment_options": [{
                    "name": "customer",
                    "type": "customer",
                    "regex": "",
                    "description": "make sure a customer was created with first_name, last_name and email",
                    "is_required": true,
                    "is_updatable": false
                }
            ],
            "is_expirable": true,
            "is_online": false,
            "minimum_expiration_seconds": 600,
            "maximum_expiration_seconds": 604800
        }
    ]
}

The data section of the response shows that a Visa card is an acceptable payment method.

List Payment Methods Response

A full API response lists many payment methods.

Find Required Fields for the Payment Method

You need to find out which fields you have to fill for the payment method.

To do that, use the Get Payment Method Required Fields with the following parameter:

Description of Path Parameters

Path Parameter

Description

type

Enter gb_visa_card as the payment method type.

Get Payment Method Required Fields Request

You need to request for the set of required fields for a Visa card.

    • Request

      • // Request URL: GET https://sandboxapi.rapyd.net/v1/payment_methods/gb_visa_card/required_fields

// Message body absent

    • NET.Core

      • using System;

namespace RapydApiRequestSample
{
    class Program
    {
        static void Main(string[] args)
        {
            try
            {
                string type = "gb_visa_card";

                string result = RapydApiRequestSample.Utilities.MakeRequest("GET", $"/v1/payment_methods/{type}/required_fields");

                Console.WriteLine(result);
            }
            catch (Exception e)
            {
                Console.WriteLine("Error completing request: " + e.Message);
            }
        }
    }
}

    • JavaScript

      • const makeRequest = require('<path-to-your-utility-file>/utilities').makeRequest;

async function main() {
  try {
    const result = await makeRequest('GET', '/v1/payment_methods/gb_visa_card/required_fields');

    console.log(result);
  } catch (error) {
    console.error('Error completing request', error);
  }
}

    • PHP

      • <?php
$path = $_SERVER['DOCUMENT_ROOT'];
$path .= "/<path-to-your-utility-file>/utilities.php";
include($path);

try {
    $object = make_request('get', '/v1/payment_methods/gb_visa_card/required_fields');
    var_dump($object);
} catch (Exception $e) {
    echo "Error: $e";
}
?>

    • Python

      • from pprint import pprint

from utilities import make_request

payment_method = 'gb_visa_card'
results = make_request(method='get',
                       path=f'/v1/payment_methods/{payment_method}/required_fields')
pprint(results)
Get Payment Method Required Fields Response

Payment Method Type Object describes the fields in the response.

    • Response

      • {
    “status”: {
        “error_code”: “”,
        “status”: “SUCCESS”,
        “message”: “”,
        “response_code”: “”,
        “operation_id”: “3b7a2391-6612-478e-b79e-38d7f8d33ff9”
    },
    “data”: {
        “type”: “gb_visa_card”,
        “fields”: [
            {
                “name”: “name”,
                “type”: “string”,
                “regex”: “”,
                “is_required”: true,
                “instructions”: “card holder name”
            },
            {
                “name”: “number”,
                “type”: “string”,
                “regex”: “”,
                “is_required”: true,
                “instructions”: “card number”
            },
            {
                “name”: “expiration_month”,
                “type”: “string”,
                “regex”: “”,
                “is_required”: true,
                “instructions”: “expiration month as string, 01-12"
            },
            {
                “name”: “expiration_year”,
                “type”: “string”,
                “regex”: “”,
                “is_required”: true,
                “instructions”: “expiration year in to digits as string, 18-99”
            },
            {
                “name”: “cvv”,
                “type”: “string”,
                “regex”: “”,
                “is_required”: true,
                “instructions”: “card cvv”
            }
        ],
        “payment_method_options”: [
            {
                “name”: “3d_required”,
                “type”: “string”,
                “regex”: “”,
                “description”: “”,
                “is_required”: false,
                “is_updatable”: false
            }
        ],
        “payment_options”: [
            {
                “name”: “description”,
                “type”: “string”,
                “regex”: “”,
                “description”: “the description field must be filled in.“,
                “is_required”: true,
                “is_updatable”: false
            },
            {
                “name”: “complete_payment_url”,
                “type”: “string”,
                “regex”: “”,
                “description”: “the complete_payment_url field must be filled in.“,
                “is_required”: true,
                “is_updatable”: false
            },
            {
                “name”: “error_payment_url”,
                “type”: “string”,
                “regex”: “”,
                “description”: “the error_payment_url field must be filled in.“,
                “is_required”: true,
                “is_updatable”: false
            }
        ],
        “minimum_expiration_seconds”: 600,
        “maximum_expiration_seconds”: 604800
    }
}

The response shows that for a GB Visa card, you must provide:

  • name

  • number

  • expiration_month

  • expiration_year

  • cvv

Ensure that your customer completes these fields.

Verify the Card

At this stage, your customer should have completed the following:

  • Selected Visa as the payment option.

  • Filled in the fields required for paying with the card.

Special Testing Behavior in Sandbox

To use the sandbox to simulate a payment that requires 3DS authentication, set the 'amount' to between 1000.00 and 1999.99.

When your customer confirms paying with the card, you have to make sure that Rapyd verifies the card by calling Create Payment with the following parameters:

Description of Body Parameters

Body Parameter

Description

payment_method

Enter an object with the following fields:

  • type - us_debit_visa_card

  • fields - Enter an object with the following fields:

    • number - 4111111111111111

    • expiration_month - 10

    • expiration_year - 29

    • cvv - 123

    • name - Cardholder Name

amount

Enter 0.00 as the payment amount.

currency

Enter GBP as the currency code.

capture

Enter false as the value since amount is 0. This tells Rapyd to collect the payment for you as soon as possible.

error_payment_url

Replace https://error.example.net in the example with your real website URL where you want the 3DS site to redirect the customer if the payment fails.

complete_payment_url

Replace https://complete.example.net in the example with your real website URL where you want the 3DS site to redirect the customer if the payment succeeds.

Create Payment Request

You ask Rapyd to verify your customer's card.

    • Request

      • // Request URL: POST https://sandboxapi.rapyd.net/v1/payments

// Message body: 
{
   "amount": 0.00,
   "currency": "GBP",
   "payment_method": {
       "type":"gb_visa_card",
       "fields": {
           "number": "4111111111111111",
           "expiration_month": "10",
           "expiration_year": "29",
           "cvv": "123",
           "name":"Cardholder Name"
       }
   },
   "error_payment_url": "https://error.example.net",
   "complete_payment_url": "https://complete.example.net",
   "capture": false
}

    • .NET.Core

      • using System;
using System.Text.Json;

namespace RapydApiRequestSample
{
    class Program
    {
        static void Main(string[] args)
        {
            try
            {
                var requestObj = new
                {
                    amount = 0.00,
                    currency = "GBP",
                    payment_method = new
                    {
                        type = "gb_visa_card",
                        fields = new
                        {
                            number = "4111111111111111",
                            expiration_month = "10",
                            expiration_year = "29",
                            cvv = "123",
                            name ="Cardholder Name"
                        }
                    },
                    error_payment_url = "https:error.example.net",
                    complete_payment_url = "https:complete.example.net",
                    capture = false
                };

                string request = JsonSerializer.Serialize(requestObj);

                string result = RapydApiRequestSample.Utilities.MakeRequest("POST", "/v1/payments", request);

                Console.WriteLine(result);
            }
            catch (Exception e)
            {
                Console.WriteLine("Error completing request: " + e.Message);
            }
        }
    }
}

    • JavaScript

      • const makeRequest = require('<path-to-your-utility-file>/utilities').makeRequest;

async function main() {
  try {
    const body = {
      amount: 0.00,
      currency: 'GBP',
      payment_method: {
        type: 'gb_visa_card',
        fields: {
          number: '4111111111111111',
          expiration_month: '10',
          expiration_year: '29',
          cvv: '123'
          name" 'Cardholder Name'
        }
      },
      error_payment_url: 'https://error.example.net',
      complete_payment_url: 'https://complete.example.net',
      capture: false
    };
    const result = await makeRequest('POST', '/v1/payments', body);

    console.log(result);
  } catch (error) {
    console.error('Error completing request', error);
  }
}

    • PHP

      • <?php
$path = $_SERVER['DOCUMENT_ROOT'];
$path .= "/<path-to-your-utility-file>/utilities.php";
include($path);

$body = [
    'amount' => 0.00,
    'currency' => 'GBP',
    'payment_method' => [
        'type' => 'gb_visa_card',
        'fields' => [
            'number' => '4111111111111111',
            'expiration_month' => '10',
            'expiration_year' => '29'
            'cvv' => '123',
            'name' => 'Cardholder Name'
        ]
    ],
    'error_payment_url' => urldecode('https://error_example.net'),
    'complete_payment_url' => urldecode('https://complete_example.net') 
    'payment_method_options'=> [
            '3d_required =>
    ],
    'capture' => false,
    ''
];

try {
    $object = make_request('post', '/v1/payments', $body);
    var_dump($object);
} catch (Exception $e) {
    echo "Error: $e";
}
?>

    • Python

      • from pprint import pprint

from utilities import make_request

payment_body = {
    'amount': 0.00,
    'currency': 'GBP',
    'payment_method': {
        'type': 'gb_visa_card',
        'fields': {
            'number': '4111111111111111',
            'expiration_month': '10',
            'expiration_year': '29',
            'cvv': '123',
            'name': 'Cardholder Name'
        }
    },
    'error_payment_url': 'https://error_example.net',
    'complete_payment_url': 'https://complete_example.net',
    'payment_method_options': {        
        '3d_required': true    
    },
    'capture': false
}

results = make_request(method='post', path='/v1/payments', body=payment_body)
pprint(results)
Create Payment Response

Let's take a look at the response. Payment Object describes the fields in the response.

    • Response

      • {
    "status": {
        "error_code": "",
        "status": "SUCCESS",
        "message": "",
        "response_code": "",
        "operation_id": "5dd15363-e0a2-48b5-878e-30296b50a6b2"
    },
    "data": {
        "id": "payment_b151373c6124a05dbf8614be3948e297",
        "amount": 0,
        "original_amount": 0.00,
        "is_partial": false,
        "currency_code": "GBP",
        "country_code": "gb",
        "status": "ACT",
        "description": "test2",
        "merchant_reference_id": "",
        "customer_token": "cus_57153838f4eb9052e87649a462aedd6e",
        "payment_method": "card_f372e6e5a780424104ac850cffeab03e",
        "expiration": 1600169279,
        "captured": false,
        "refunded": false,
        "refunded_amount": 0,
        "receipt_email": "",
        "redirect_url": "https://redirect.example.net/,
        "complete_payment_url": "http://www.rapyd.net",
        "error_payment_url": "http://www.rapyd.net/error.html",
        "receipt_number": "",
        "flow_type": "",
        "address": null,
        "statement_descriptor": "rapyd 3ds testing",
        "transaction_id": "",
        "created_at": 1599564479,
        "metadata": {},
        "failure_code": "",
        "failure_message": "",
        "paid": false,
        "paid_at": 0,
        "dispute": null,
        "refunds": null,
        "order": null,
        "outcome": null,
        "visual_codes": {},
        "textual_codes": {},
        "instructions": {},
        "ewallet_id": "ewallet_f7d6a6bfade1cabb06f3e264d8f1899b",
        "ewallets": [
            {
                "ewallet_id": "ewallet_f7d6a6bfade1cabb06f3e264d8f1899b",
                "amount": 0.00,
                "percent": 100,
                "refunded_amount": 0
            }
        ],
        "payment_method_options": {
            "3d_required": true
        },
        "payment_method_type": "gb_visa_card",
        "payment_method_type_category": "card",
        "fx_rate": "",
        "merchant_requested_currency": null,
        "merchant_requested_amount": null,
        "fixed_side": "",
        "payment_fees": null,
        "invoice": "",
        "escrow": null,
        "group_payment": "",
        "initiation_type": "customer_present"
    }
}

The data section of the response shows:

  • amount is 0.00

  • currency is GBP

  • Your guest customer is automatically assigned a customer ID. The payment method is assigned a payment method ID. Both IDs are unique to this one transaction.

  • captured is false - the card payment amount is 0.

  • redirect_url is https://redirect.example.net, which is the URL where you redirect your guest customer to complete the payment process.

  • paid is false and status is ACT (active), which indicates that we are still waiting for your guest customer to finish the 3DS process.

Receive Payment Confirmation

At this point, you have redirected the customer to https://redirect.example.net, which is a 3DS verification site. This site might handle the 3DS verification itself, or it might redirect the customer to the website of their own card.

The customer follows the authentication instructions on the screen, which could involve copying the number from an email or an SMS into the web page.

When the process is completed successfully, Rapyd sends you a webhook with details of the completed transaction.

Let's take a look at Webhook - Payment Completed.

    • Webhook

      • {
    "id": "wh_7f18c2b90892652fe7ff2cb7d0537732",
    "type": "PAYMENT_COMPLETED",
    "data": {
        "id": "payment_b151373c6124a05dbf8614be3948e297",
      
//      ...      
      
        "paid": true,
      
//      ...      
      
        "amount": 0.00,
        "status": "CLO",
      
//      ...      
      
        "currency_code": "GBP",
      
//      ...      
      
        "customer_token": "cus_57153838f4eb9052e87649a462aedd6e",
        "payment_method": "card_f372e6e5a780424104ac850cffeab03e",
          
      
//      ...      
      
        "payment_method_type_category": "card"
    },
    "trigger_operation_id": "",
    "status": "NEW",
    "created_at": 1551173303
}

The data section of the webhook shows:

  • paid is true and status is CLO (closed), which indicates that the money has been paid.

  • amount is 0.00

  • currency_code is GBP

  • The customer_token and payment_method are the same as in the Create Payment response.

Add a Card as a Default Payment Method for the Customer
Request

    • JSON

      • https://sandboxapi.rapyd.net/v1/customers/cus_57153838f4eb9052e87649a462aedd6e
{
   “default_payment_method”: "card_f372e6e5a780424104ac850cffeab03e"
}
Response

    • Response

      • {
    “status”: {
        “error_code”: “”,
        “status”: “SUCCESS”,
        “message”: “”,
        “response_code”: “”,
        “operation_id”: “e3fb342e-9562-42ed-9bf6-056a2609270c”
    },
    “data”: {
        “id”: “cus_57153838f4eb9052e87649a462aedd6e”,
        “delinquent”: false,
        “discount”: null,
        “name”: “payment_2e7e75edbde869e04aa12155c0be13be”,
        “default_payment_method”: “card_f372e6e5a780424104ac850cffeab03e”,
        “description”: “”,
        “email”: “”,
        “phone_number”: “”,
        “invoice_prefix”: “”,
        “addresses”: [],
        “payment_methods”: {
            “data”: [
                {
                    “id”: “card_f372e6e5a780424104ac850cffeab03e”,
                    “type”: “gb_credit_visa_card”,
                    “category”: “card”,
                    “metadata”: null,
                    “image”: “https://iconslib.rapyd.net/checkout/sg_credit_visa_card.png”,
                    “name”: “testing”,
                    “last4”: “4977",
                    “cvv_check”: “unchecked”,
                    “bin_details”: {
                        “brand”: null
                    },
                    “expiration_year”: “24",
                    “expiration_month”: “12",
                    “fingerprint_token”: “”
                }
            ],
            “has_more”: false,
            “total_count”: 1,
            “url”: “/v1/customers/cus_abb5c09d9c5bf8c0c8cb00b14ec5c892/payment_methods”
        },
        “subscriptions”: null,
        “created_at”: 1594894949,
        “metadata”: {},
        “business_vat_id”: “”,
        “ewallet”: “”
    }
}
Process the Payment

When your customer pays with their stored card, you submit the payment to Rapyd for processing.

To submit the customer's payment, use Create Payment with the following parameters:

Description of Body Parameters

Body Parameter

Description

amount

Enter 9.99 as the payment amount.

currency

Enter GBP as the currency code.

customer

Enter the 'customer_id' that you received on the Create Payment Response (for example, "customer_token": "cus_57153838f4eb9052e87649a462aedd6e")

Create Payment Request

Request Rapyd to process your customer's payment for 9.99 GBP (Pound Sterling) (as shown in this example code below).

    • Request

      • // Request URL: POST https://sandboxapi.rapyd.net/v1/payments

// Message body:
{
    "amount": 9.99,
    "currency": "GBP",
    "customer": "cus_8ded332b08966abf51bdc28c106acb7c"
}
Create Payment Response

Create Payment describes the fields in the response.

    • Response

      • {
    "status": {
        "error_code": "",
        "status": "SUCCESS",
        "message": "",
        "response_code": "",
        "operation_id": "4e44e8c1-ee8c-411a-a2de-a2a2ae0122d3"
    },
    "data": {
        "id": "payment_7b4cb9456f1ff73132831fc2e35d88be",
        "amount": 9.99,
        "original_amount": 9.99,
        "is_partial": false,
        "currency_code": "GBP",
        "country_code": "GB",
        "status": "CLO",

        //      ...

        "customer_token": "cus_57153838f4eb9052e87649a462aedd6e",
        "payment_method": "card_f372e6e5a780424104ac850cffeab03e",
        "expiration": 0,
        "captured": true,

        //      ...

        "created_at": 1581248060,

        //      ...

        "paid": true,
        "paid_at": 1581248060,

        //      ...

        "payment_method_type": "gb_visa_card",
        "payment_method_type_category": "card",

        //      ...

    }
}

The response (in the sample code above) shows that Rapyd successfully processed the payment based on the amount, currency, and Customer ID. A sum of 9.99 GBP was paid from the customer's card.

You'll always get a similar response. The only difference will be the date and payment ID, and the amount if it's not identical.

You can see that the payment was successful since the status (under data) is CLO (closed). Create Payment lists possible values for status.

At this point, you can inform the customer that the purchase is complete.

In this section:

Money that is returned to the customer after the customer wins a dispute of a card or bank transaction.

A protocol that provides increased security for card-not-present transactions. Rapyd supports version 2.2.

A web address that points the user to a different web page.

In the European Union (EU) and European Economic Area (EEA), legislation for protecting consumers and making payments more secure.

In Rapyd, the sandbox environment provides most of the functionality of the production environment, without using real money. Interested persons can use the sandbox to explore Rapyd's product offering or to test software integrations with Rapyd's API.

A text-messaging service for telephones and other electronic devices.