The {{gatewayName}} Hosted Tokenization library allows your app to process credit card transactions, while still minimizing scope for PCI.
You can use the library to create iframes containing card fields, generate a nonce token from the card data, and then use that nonce token to process transactions. Since the iframes and card fields are hosted completely on the gateway's servers, your app never deals with the raw card data, and the scope for PCI is minimized.
<script src="https://tokenization.{{gatewayDomain}}/tokenization/{{version}}"></script>If you need to support IE, add the polyfill script before the library script:
<script src="https://tokenization.{{gatewayDomain}}/tokenization/{{version}}/polyfills" nomodule></script> <script src="https://tokenization.{{gatewayDomain}}/tokenization/{{version}}"></script>
const tokenizationSourceKey = 'pk_abc123'; const hostedTokenization = new window.HostedTokenization(tokenizationSourceKey);
const cardForm = hostedTokenization.create('card-form');
cardForm.mount('#my-div');
const result = await cardForm.getNonceToken();The nonce token must be used within 15 minutes after being generated.
const { amount, name, result } = req.body; const data = { source: `nonce-${result.nonce}`;, amount, name, expiry_month: result.expiry_month, expiry_year: result.expiry_year, avs_zip: result.avs_zip, }; const config = { auth: { username: 'MY_SOURCE_KEY', password: 'MY_PIN, }, }; const res = await axios.post('{{sandboxBaseUrl}}/v2/transactions/charge', data, config)
.on()
method.cardForm.on('input', onEvent);
.setStyles()
method.style
attribute for
each element.
cardForm.setStyles({ card: 'border: 1px solid black', });
{{sampleCode}}
const swipe = hostedTokenization.create('swipe');
'cancelled'
:
const result = await cardForm.getSwipe();
{{item.code}}