Overview

ThreeDSecure.createUI(object options): ThreeDSecureUI

Description

Create a ThreeDSecureUI from the provided options.

---

Parameters

options object containing the following values:

Option	Description	Examples	Required
cardNumber	The card number to run 3DS for	’4111111111111111’	Yes, if using raw credit card data No, if using paymentToken or customerVaultId
cardExpMonth	2 digit card expiration date for the month	’07’ (meaning July)	Yes, if using raw credit card data No, if using paymentToken or customerVaultId
cardExpYear	2 or 4 digit card expiration year	’2021’ ‘24’	Yes, if using raw credit card data No, if using paymentToken or customerVaultId
paymentToken	Token from Collect.js	’00000000-000000-000000-000000000000’	Yes, if using Collect.js No, if using raw card data or customerVaultId
customerVaultId	Merchant defined Customer Vault id. This is not the billing id or shipping id.	‘12345’	Yes, if using Customer Vault No, if using raw card data or paymentToken
currency	The 3 character currency code for the transaction.	‘USD’ ‘GBP’	Yes
amount	The amount of the transaction in minor units. If the customer is challenged, this value will be displayed on the challenge screen.	‘1000’ (meaning 10 USD)	Yes
email	The email address of the cardholder that owns the card. Required (if available) unless market or regional mandate restricts sending this information.	‘[e-mail]’	Yes, if applicable
city	The cardholder’s city. Required (if available) unless market or regional mandate restricts sending this information.	‘Atlanta’	Yes, if applicable
address1	The cardholder’s address. Required (if available) unless market or regional mandate restricts sending this information.	‘123 Fake St.‘	Yes, if applicable
address2	The cardholder’s address	’APT 1’	No
address3	The cardholder’s address	’Unit 1’	No
country	The customer’s country. 2 Characters, ISO 3166. Required (if available) unless market or regional mandate restricts sending this information.	‘US’	Yes, if applicable
firstName	The first name of the cardholder	’Jane’	Yes
lastName	The last name of the cardholder	’Doe’	Yes
postalCode	The zip code or postal code of the cardholder. Required (if available) unless market or regional mandate restricts sending this information.	‘60605’	Yes, if applicable
state	The state, province, or other subdivision of the cardholder. This field must be a 2 character subdivision code defined by ISO 3166-2. Required (if available) unless market or regional mandate restricts sending this information.	‘GA’	Yes, if applicable
phone	The phone number of the cardholder	’8008675309’	No
shippingCity	City the cardholder would like their purchase shipping to	’Chicago’	No
shippingAddress1	Address the cardholder would like their purchase shipping to	’123 Fake st’	No
shippingAddress2	Address the cardholder would like their purchase shipping to	’APT 2’	No
shippingAddress3	Address the cardholder would like their purchase shipping to	’Unit 1’	No
shippingCountry	Country the cardholder would like their purchase shipping to. 2 characters, ISO 3166.	‘US’	No
shippingFirstName	First name of the recipient	’John’	No
shippingLastName	Last name of the recipient	’Doe’	No
shippingPostalCode	Zip code or postal code the cardholder would like their purchase shipping to	’60605’	No
shippingState	The state, province, or other subdivision of the cardholder. This field must be a 2 character subdivision code defined by ISO 3166-2.	‘GA’	No
processor	The processor id that will be used to run the transaction. Processor ids can be found in the merchant portal in Transaction Routing	’myprocessor’	No, if not provided the system will automatically use your default processor
challengeIndicator	The 2-digit 3DS challenge indicator you would like to pass along with the 3DS request. Requests that the card issuer does or doesn’t challenge a customer.	‘01’ - No preference ‘02’ - No challenge requested ‘03’ - Challenge requested (3DS Requestor preference) ‘04’ - Challenge requested (Mandate) ‘05’ - No challenge requested (transactional risk analysis is already performed) ‘06’ - No challenge requested (data share only) ‘07’ - No challenge requested (strong consumer authentication is already performed) ‘08’ - No challenge requested (utilise allowlist exemption if no challenge required) ‘09’ - Challenge requested (allowlist prompt requested if challenge required)	No, if not provided the system will automatically use ‘01’ - No preference.
browserJavaEnabled	The string value of the browser’s setting for if Java is enabled. As this is a deprecated field for most modern browsers, a try/catch is recommended to future-proof your integration.	try { const userBrowserJavaEnabled = String(window.navigator.javaEnabled()); } catch(e) { const userBrowserJavaEnabled = String(false); } /* In threeDsService.createUI(): */ browserJavaEnabled: userBrowserJavaEnabled	Yes, if you are manually collecting device data.
browserJavascriptEnabled	The string value of the browser’s setting for if Javascript is enabled. Since using Gateway.js requires the user’s browser to have Javascript enabled, it is safe to default this to true.	String(true)	Yes, if you are manually collecting device data.
browserLanguage	The string value of the browser’s setting for the user’s selected language.	`window.navigator.language		window.navigator.userLanguage`	Yes, if you are manually collecting device data.
browserColorDepth	The string value of the user’s screen’s color depth.	String(window.screen.colorDepth)	Yes, if you are manually collecting device data.
browserScreenHeight	The string value of the user’s screen’s height.	String(window.screen.height)	Yes, if you are manually collecting device data.
browserScreenWidth	The string value of the user’s screen’s width.	String(window.screen.width)	Yes, if you are manually collecting device data.
browserTimeZone	The string value of the user’s timezone	String(new Date().getTimezoneOffset())	Yes, if you are manually collecting device data.
deviceChannel	This is required to be ‘Browser'	'Browser’	Yes, if you are manually collecting device data.

---

Side Effects:

Raises an error if options are invalid.

---

Example:

const gateway = Gateway.create('collect_checkout_0000000000000000000000000');
const threeDsService = gateway.get3DSecure();

const threeDSecureUI = threeDsService.createUI({
    customerVaultToken: "myCustomerVaultToken",
    currency: 'USD',
    amount: '1000'
})

---