Example description: Credit Card Storage

In this demo example you have Custom Form with enabled support for verification for a Payment with Credit Card storage. Once the payment has been processed and the card is stored. Retrieve a list of Customer Cards is easily available using an e-mail address.

Continue process flow / Receive CardTokenID / CustomerID and then click again to create transaction.

Fill the form with a valid name, email and a valid card* number (or use default values clicking on the EXAMPLE DATA button).

Show CURL code to make the transaction Show JSON response from CentralPay API

cardTokenId:
customerId:
cardId:
transactionId:

offer

remember me Use your card

Select card and enter CVV

Secure payment by

Step 1

Collecting the personal information and credit card data. All required fields must be filled before sending data. Select the Remember my card option to store your card.

Step 2

Card data is sent to CentralPay through the browser with token.js. CentralPay stores the card data and returns the CardTokenID to the merchant form. Using the CardToken ID, a new Customer ID is requested.

Step 3

Either if it's a new card or an existing one, use your Customer ID / Card ID validated with the CVV to process a new transaction.

Step 4

The Payment Authentication Response, Customer ID / Card ID, currency, amount, and order data are sent to the API by submitting the form. CentralPay creates a Transaction and returns TransactionId with JSON response to the merchant.

function onValidFormPay()
{
    var form = document.querySelector('form[data-centralpay="form"]');
    var urlCentralpayApi = 'https://test-api.centralpay.net/v2/rest/';

    var firstname = form.querySelector('input[name="order[firstName]"]').value;
    var lastname = form.querySelector('input[name="order[lastName]"]').value;
    var number = form.querySelector('input[data-centralpay="card[number]"]').value;
    var holderEmail = form.querySelector('input[name="card[cardholderEmail]"]').value;
    var expirationMonth = form.querySelector('input[data-centralpay="card[expirationMonth]"]').value;
    var expirationYear = form.querySelector('input[data-centralpay="card[expirationYear]"]').value;
    var cvc = form.querySelector('input[data-centralpay="card[cvc]"]').value;

    var data = {
        'merchantPublicKey': document.querySelector('input[data-example="merchantPublicKey"]').value,
        'card[holderEmail]': holderEmail,prettyprint lang-html
        'card[holderName]': lastname + " " + firstname,
        'card[number]': number,
        'card[cvc]': cvc,
        'card[expirationMonth]': expirationMonth,
        'card[expirationYear]': expirationYear,
    };

    const query = new URLSearchParams(data);

    var xhr = new XMLHttpRequest();
    xhr.open('POST', urlCentralpayApi + 'cardToken');
    xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");

    xhr.onreadystatechange = function() {
        if (xhr.readyState === 4) {
            if(xhr.status === 400){
                console.log("400: Manage this case");
            }
            else if(xhr.status === 200){
               console.log(JSON.parse(xhr.responseText));
               //Get cardTokenId from response and send it during customer creation
            }
            else{
                console.log("Error: Manage this case");
            }
        }
    };
    xhr.send(query.toString());
}

Curl
PHP

curl -v customer \
-u ' ' \
-d merchantCustomerId=  \
-d cardTokenId=  \
-d firstName=  \
-d lastName=  \
-d email=  \

curl -v card \
-u ' ' \
-d merchantCardId=  \
-d customerId=  \
-d cardTokenId=  \

Curl
PHP

curl -v https://test-api.centralpay.net/v2/rest/transaction \
-u ' ' \
-d merchantTransactionId=  \
-d amount= \
-d capture=  \
-d currency= \
-d receiptEmail=  \
-d pointOfSaleId=  \
-d cardTokenId=  \
-d customerId=  \
-d cardId=  \
-d cvcValidation=  \
-d description=  \
-d endUserIp= 3.236.108.61 \
-d order[firstName]=  \
-d order[lastName]=  \
-d order[country]=  \
-d endUserLanguage=  \
-d browserAcceptLanguage=  \
-d browserUserAgent=  \

MerchantPublicKey •

username:password •

pointOfSaleID (optional) •

Order country: