Authentication Widget - Whitelabel API

🚧

New Requirement

This Widget introduces a required, breaking change integration for all White Label Card Processing and Apple Pay partners.

All partners with white label integrations (card processing and/or Apple Pay) will be required to implement the Authentication Widget before October 31, 2022.

In order to upgrade trust and security for our partners and end users, Wyre is introducing an Authentication Widget for White Label Card Processing, including the Apple Pay Order Integration. This Widget will check for any authentication requirement for your wallet orders and perform them in a single, seamless step.

What's New

We are introducing a new authenticationUrl property in the Wallet Order creation responses for Apple Pay and Card Processing API.

{
    "id": "WO_MPMJTJM4P7",
    "createdAt": 1666759060487,
    "owner": "account:AC_PA4XQDNGJEE",
    "status": "RUNNING_CHECKS",
    "orderType": "DOMESTIC",
    "sourceAmount": 67.25,
    "purchaseAmount": 62.25,
    "sourceCurrency": "USD",
    "destCurrency": "USD",
    "transferId": null,
    "dest": "wallet:WA_UNQRFAQWLGX",
    "authCodesRequested": false,
    "blockchainNetworkTx": null,
    "authenticationUrl": "https://pay.testwyre.com/authentication/WO_MPMJTJM4P7?accountId=AC_YC3NT6GEZ8U&reservation=Z6BTU2QJQV3A92Z4A7HY&customerId=AC_PA4XQDNGJEE&autoRedirect=false&redirectUrl=&failureRedirectUrl=&flow=CARD_API",
    "accountId": "AC_PA4XQDNGJEE",
    "paymentMethodName": null
}

This page needs to be opened on the end user's device and consists of a "processing" page. This page can remain open for a few seconds until all the checks are performed.

If 3DS authentication is needed, the user will be prompted for a 3DS challenge. This integration replaces the previous flow seen here.

Remove Webview

To remove the webview listen for the window.postMessage event as follows:

var authenticationComplete = new Promise(function (resolve, reject) {
	window.addEventListener("message", function (event) {
		try {
		    if (event.origin) {
		        if (event.origin.includes("sendwyre") || event.origin.includes("testwyre")) {
		            let data = event.data
		            resolve(data);
		        }
		    }
		}catch (e){
		    reject(e);
		}
	}, false);
 });

let authResult = await authenticationComplete;

if (authResult.type === "authentication" && authResult.status === "completed") {
	// close the webview
}

Or, listen for redirects to about:blank, which means the authentication succeeded.

Note: the authenticationComplete status indicates that the authentication was successful. It does not indicate that the wallet order was completed (no 3DS or card2fa needed for this wallet order).

After the authentication is completed, simply pull the wallet order status endpoint via Track Widget Order.

❗️

Warning

Do not try to reload or close the page. This will make the wallet order expire and be rejected. Any attempt to open this page in a device that is not the end user's real device will reject the Wallet Order.