Integrate using the Web SDK
note
EMV 3D Secure 2.1 is a new offering by Elavon. If you have identified any errors or gaps in the content, please contact: #SEDevPortalSupport@elavon.com
On this page:
Web SDK Overview and Workflow
You can add 3D secure capabilities to your checkout page by integrating Elavon’s 3DS Web SDK. The Web SDK reduces complex development work to integrate with Elavon's 3DS Server. Elavon's Web SDK supports two different workflows for authenticating a transaction:
- All-in-one
- Toolkit
All-in-one workflow
Use the all-in-one workflow of the Web SDK when you want an easy way to add Elavon’s 3DS capabilities into your website. To use this workflow, add the Web SDK JavaScript file to your website's payment page. After the integration, the Web SDK handles lookup, authentication, and challenge workflows.
Use the all-in-one workflow of the SDKToolkit workflow
Use the toolkit workflow of the Web SDK for scenarios where you may have a mixed mode integration between the backend server environment and the client side browser. For example, you can directly integrate with the 3DS Server to submit the authentication request while you use the challenge flow from the toolkit workflow to ease the client side integration.
Use the toolkit workflow of the SDKWeb SDK Workflow Diagram
The Web SDK workflow diagram shows the transaction authentication process when the Web SDK is integrated to the merchant's website. After the Web SDK gets authenticated, it initiates the versioning request to check the supported 3DS version. If the card used in the transaction supports 3DS, the Web SDK sends the authentication data to the 3DS Server and receives the authentication response. If required, it facilitates the challenge verification process between the issuer and the cardholder. Later, it retrieves the challenge result from the 3DS Server and merchant can use this response to authenticate or decline the transaction.
Figure caption: Frictionless and challenge workflow in a Web SDK integration
Web SDK 3DS 1 Fallback Support
If you are an integrator who only supports 3D Secure 1 (3DS 1) or if the issuer does not support 3D Secure 2 (3DS 2), you can still integrate Elavon's 3DS Web SDK to your website. With this release, transactions that need 3DS 1 authentication are appropriately redirected by the Web SDK to the 3DS 1 authentication flow. The flowchart below shows how these three fields in the authenticate request help the 3DS server decide whether to follow 3DS 2 or 3DS 1 authentication flow: messageVersion, clientStartProtocolVersion, and clientEndProtocolVersion.
Figure caption: Decision matrix used by 3DS Server to initiate 3DS 1 fallback
note
Currently our 3DS Servers support 3DS 1 transactions for only MasterCard, VISA, and AMEX.