Several JavaScript API implementations are available here https://github.com/Smart2Pay/js-sdk/tree/main/src to obtain the CreditCardToken. You can also checkout our implementation examples here: https://github.com/Smart2Pay/js-sdk/blob/main/src/example.html. See below the details for ES6 – fetch + Promise, ES6 – Promise + XMLHttpRequest or ES5 – XMLHttpRequest.

ES6 – fetch + Promise

Installation
Import the following script that will make available tokenizeCard_fetch():

<script src="https://..../tokenizeCard_fetch.js" type="text/javascript"></script>

Usage

Use tokenizeCard_fetch to send the required data and handle response / error:

tokenizeCard_fetch({
    apiKey: '<apikey string>',
    environment: '<environment string>',
    cardDetails: '<cardDetails object>',
})  
.then(CreditCardToken => console.log(CreditCardToken)) // use received 'CreditCardToken'
.catch(err => console.error(err)) // handle error

Parameter	Type	Possible Values	Description
apiKey	string	–	API key previously obtained from S2P server
environment	string	‘DEV’ ‘TEST’ ‘LIVE’	select the environment DEV http://localhost/v1/card/authenticate TEST https://securetest.smart2pay.com/v1/card/authenticate LIVE https://secure.smart2pay.com/v1/card/authenticate
cardDetails	JSON object	check sample bellow	card authentication details in JSON format

Sample card details object:

{
    "CardAuthentication": {
        "Customer": {
            "FirstName": "John",
            "LastName": "Doe",
            "Email": "testing2@test.com",
            "SocialSecurityNumber": "00003456789"
        },
        "BillingAddress": {
            "Country": "BR"
        },
        "Card": {
            "HolderName": "John Doe",
            "Number": "4111111111111111",
            "ExpirationMonth": "02",
            "ExpirationYear": "2029",
            "SecurityCode": "312"
        }
    }
}

---

ES6 – Promise + XMLHttpRequest

Installation
Import the following script that will make available tokenizeCard_fetch():

<script src="https://..../tokenizeCard_promise.js" type="text/javascript"></script>

Usage

Use tokenizeCard_promise to send the required data and handle response / error:

tokenizeCard_promise({
    apiKey: '<apikey string>',
    environment: '<environment string>',
    cardDetails: '<cardDetails object>',
})
.then(function (CreditCardToken) {
    // use received 'CreditCardToken'
    console.log(CreditCardToken);
})
.catch(function (err) {
    // handle error
    console.error(err.status, err.statusText);
});

Parameter	Type	Possible Values	Description
apiKey	string	–	API key previously obtained from S2P server
environment	string	‘DEV’ ‘TEST’ ‘LIVE’	select the environment DEV http://localhost/v1/card/authenticate TEST https://securetest.smart2pay.com/v1/card/authenticate LIVE https://secure.smart2pay.com/v1/card/authenticate
cardDetails	JSON object	check sample bellow	card authentication details in JSON format

Sample card details object:

{
    "CardAuthentication": {
        "Customer": {
            "FirstName": "John",
            "LastName": "Doe",
            "Email": "testing2@test.com",
            "SocialSecurityNumber": "00003456789"
        },
        "BillingAddress": {
            "Country": "BR"
        },
        "Card": {
            "HolderName": "John Doe",
            "Number": "4111111111111111",
            "ExpirationMonth": "02",
            "ExpirationYear": "2029",
            "SecurityCode": "312"
        }
    }
}

---

ES5 – XMLHttpRequest

Installation
Import the following script that will make available tokenizeCard():

<script src="https://..../tokenizeCard.js" type="text/javascript"></script>

ES5 – Usage

Create a function where you handle the received CreditCardToken:

function handleRequest(CreditCardToken) {
    // use received 'CreditCardToken'
    console.log(CreditCardToken);
}

Create a function to handle any received errors:

function handleError(HttpStatusCode, errorText) {
    // handle error
    console.error(HttpStatusCode, errorText);
}

Use tokenizeCard() to send the required data and handlers:

tokenizeCard({
    apiKey: '<𝘢𝘱𝘪𝘬𝘦𝘺 𝘴𝘵𝘳𝘪𝘯𝘨>', 
    environment: '<𝘦𝘯𝘷𝘪𝘳𝘰𝘯𝘮𝘦𝘯𝘵 𝘴𝘵𝘳𝘪𝘯𝘨>',
    cardDetails: '<𝘤𝘢𝘳𝘥𝘋𝘦𝘵𝘢𝘪𝘭𝘴 𝘰𝘣𝘫𝘦𝘤𝘵>',
    handleRequest: '<𝘩𝘢𝘯𝘥𝘭𝘦𝘙𝘦𝘲𝘶𝘦𝘴𝘵 𝘤𝘢𝘭𝘭𝘣𝘢𝘤𝘬>',
    handleError: '<𝘩𝘢𝘯𝘥𝘭𝘦𝘌𝘳𝘳𝘰𝘳 𝘤𝘢𝘭𝘭𝘣𝘢𝘤𝘬>'
});

Parameter	Type	Possible Values	Description
apiKey	string	–	API key previously obtained from S2P server
environment	string	‘DEV’ ‘TEST’ ‘LIVE’	select the environment DEV http://localhost/v1/card/authenticate TEST https://securetest.smart2pay.com/v1/card/authenticate LIVE https://secure.smart2pay.com/v1/card/authenticate
cardDetails	JSON object	check sample bellow	card authentication details in JSON format
handleRequest	callback function	–	a Javascript function that will receive CreditCardToken as a parameter
handleError	callback function	–	a Javascript function that will receive an error code: HttpStatusCode and errorText parameters

Sample card details object:

{
    "CardAuthentication": {
        "Customer": {
            "FirstName": "John",
            "LastName": "Doe",
            "Email": "testing2@test.com",
            "SocialSecurityNumber": "00003456789"
        },
        "BillingAddress": {
            "Country": "BR"
        },
        "Card": {
            "HolderName": "John Doe",
            "Number": "4111111111111111",
            "ExpirationMonth": "02",
            "ExpirationYear": "2029",
            "SecurityCode": "312"
        }
    }
}