Handling 3DS
Handle charges that require 3DS authentication from customers.
After submitting a charge, if you receive a response with "status_code": "waiting_for_shopper_action" , you may follow these steps to handle the 3DS challenge:
Include a challenge page with the challenge_jwt and the challenge_md.
Automatically submit this form to the challenge_url endpoint,
The customer completes the challenge page. The payment request is then submitted for authentication.
Example 3DS challenge inside an iframe:
<body>
....
<iframe id="iframe-name" height="250" width="400"></iframe>
....
<script>
....
function onShopperActionForm(form) {
const formElement = document.createElement('form');
formElement.method = form.method;
formElement.action = form.action;
formElement.target = 'iframe-name';
// Create and append input elements to the form
form.inputs.forEach(inputData => {
const input = document.createElement('input');
input.type = inputData.type;
input.name = inputData.name;
input.value = inputData.value;
formElement.appendChild(input);
});
// Append the form to the body
document.getElementsByTagName('body')[0].appendChild(formElement);
// Automatically submit the form
formElement.submit();
}
....
</script>
</body>
Type: Redirection
After submitting a charge, if you receive a response with "status_code":"waiting_for_shopper_action" and "type": "redirection", you may follow these steps to handle the 3DS challenge for redirection type:
Extract the url from the shopper_action.redirection object.
Redirect the customer to this URL using the specified method (GET).
The customer completes the 3DS challenge on the redirected page.
After completion, the customer is redirected back to your return URL with the result.
Last updated
Was this helpful?