Web SDK Flow
This is the basic Web SDK flow. In most cases it is “best practice” to implement this flow.
Summary of the Web SDK Flow
The process starts when the customer decides to make a payment:
- From your backend, you need to initiate the flow by posting the /openOrder API. In addition to passing the authentication credentials, you will also have to pass
amount
andcurrency
.
The /openOrder method retrieves thesessionToken
that authenticates for this session. - From your front end, you need to initiate the Web SDK. Use the Nuvei Fields guide and the Styling guide to set them up in your payment form.
- After the customer enters their payment details on your payment form, and submits it for payment, call the Web SDK createPayment() method.
This method runs the payment flow end-to-end, performing any 3D-Secure requirements – both server-side and client-side.
The createPayment() method will do the following:- Determine and handle the relevant 3D-Secure version (v1 or v2).
- Handle the 3D fingerprinting and send the results to the issuer.
- If the issuer’s response is not frictionless, then the method will redirect to perform the relevant challenge or fallback to 3Dv1.
- Returns the 3D-Secure authentication information from the issuer –
cavv
,eci
, etc.
Note, thecavv
is the encrypted authentication result, and it cannot be manipulated by the end user. It is safe to use as proof of authentication success or failure.
- When the payment process completes, you receive the payment status response. You can display the relevant message to the customer.
Remember that this is not a verified response. - When your server receives the indication from your client-side (on form submission), you should either:
- Send a /getPaymentStatus API request to validate the response.
- Alternatively, you can set up a DMNs in async mode directly to your server.
3D-Secure MPI-Only Flow for Web SDK
The 3D-Secure MPI-Only flow for Web SDK combines Web SDK (for 3D-Secure and PCI descoping) and API for performing the payment itself.
Summary of the 3D-Secure MPI-Only Flow for Web SDK
- From your backend, you need to initiate the flow by posting the /openOrder API. In addition to passing the authentication credentials, you will also have to pass
amount
andcurrency
.
The openOrder() method will retrieve thesessionToken
that authenticates for this session. - Initiate the Web SDK from your front end. Embed the relevant Nuvei Fields in your payment form, and customize their styling to match your UI/UX.
- After the customer enters their payment details on your payment form, and submits it for payment, call the Web SDK authenticate3d() method.
This method will not perform the payment, but it runs the 3D-Secure end-to-end flow, performing any 3D-Secure requirements – both server-side and client-side.
The authenticate3d() method will do the following:- Determine and handle the relevant 3D-Secure version (v1 or v2).
- Handle the 3D fingerprinting and send the results to the issuer.
- If the issuer’s response is not frictionless, then the method will redirect to perform the relevant challenge or fallback to 3Dv1.
- Returns the 3D-Secure authentication information from the issuer –
cavv
,eci
, etc.
Note, thecavv
is the encrypted authentication result, and it cannot be manipulated by the end user. It is safe to use as proof of authentication success or failure.
- When you receive the authentication response from the issuer, you can display the relevant message to the customer.
- If the authentication returned success, then continue by sending a liability-shifted /payment API request.
Server-to-Server Flow
The Server-to-Server flow for accepting payments use the Nuvei Server SDKs (Java, PHP, .NET, Node.JS) and Nuvei APIs.
Summary of the Server-to-Server Flow
- From your backend, you need to initiate the flow by posting the /getSessionToken API to pass the authentication credentials.
The /getSessionToken method returns asessionToken
which is needed to authenticate subsequent steps in this session. - Call the /initPayment API request to determine the 3D-Secure version, and return the
methodUrl
and other details required for the 3D-Secure fingerprinting. - Perform the 3D-Secure fingerprinting to authenticate the client-side device (see the 3D-Secure Guide for details).
- Perform the 3D-Secure payment request by submitting the /payment API request which includes a threeD block.
If a frictionless response is returned (APPROVED or DECLINED), then display the response to the customer, and the payment flow ends here. - If response returns REDIRECT, then either:
- Redirect to perform a 3D-Secure challenge, or
- Redirect to a 3Dv1 fallback on your client-side (see the 3D-Secure Guide for details)
- If a 3D-Secure challenge was performed, and if the issuer approved the payment, then perform a liability-shift payment, by sending a /payment call (without a threeD block).
This will returnapproved
ordeclined
response for the payment, which you can display to the customer.