Client-side requirements
Including the tokenizer
The tokenizer has no external dependency. It is recommended to hotlink this javascript file rather than hosting it yourself, that way you’re guaranteed to always use the latest available version.
<script type="text/javascript" src="https://cdn.syspay.com/js/syspay.tokenizer-current.js"></script>
Setting your public key
This key will be provided by SysPay account manager or via Partner API calls.
syspay.tokenizer.setPublicKey('Your public key');
Changing the base url for testing
By default the tokenizer will connect to the live environment. During the implementation phase you will probably want to switch to the sandbox one. To do so, adapt your public key accordingly and change the base URL used like this:
syspay.tokenizer.setBaseUrl("https://app-sandbox.syspay.com/api/v1/public/");
Collect and tokenize the card information
In order to tokenize the card information, you need to:
- Submit the information to our API
syspay.tokenizer.tokenizeCard({
number: $('#number').val(),
cardholder: $('#cardholder').val(),
exp_month: $('#exp-month').val(),
exp_year: $('#exp-year').val(),
cvc: $('#cvc').val()
}, callback);
- Handle the response in a javascript callback
var callback = function(response) {
if (null === response.error) {
// The actual token will be in response.token. Add it to a hidden field and submit the form.
// /!\ Make sure you don't submit the actual card data if they are part of your form.
$('<input type="hidden" name="syspay-token" />')
.val(response.token)
.appendTo('#my-form');
$('#my-form').get(0).submit();
} else {
// There was an error
alert(response.message);
}
}
CVC Collection
The JS library does not enforce CVC collection. Tokenizing a card without providing the cvc parameter will be accepted, however the ability to process a payment on a token that does not contain a cvc once it has been submitted to your server depends on your API settings. If you are not allowed to process card payments without cvc, a missing cvc validation error will be returned.