Payment Gateway advice for a Merchant Account

Wappler 6.8.0 AC2
Mac M1, NodeJS, Docker

I have an API integration to a payment gateway, all works well, and I have lots of successful payments, however when I get a bank/card which force requires 3-D Secure v2 Verification Flow then I run into some troubles, as I need to get the response from the banks API, and then load a base64 encoded string so the user can enter a popup with another form which submits a user password that is either predefined or been sent to their phone for verification.

Here is the decoded base64 answer they send.

<form id="downloadform3D" name="downloadform3D" method="post" action="https&#58;//v2-sim.preprod.psp-solutions.com/acs-simulation/challenge&#63;redirectUrl=https%3A%2F%2Fmdepayments.epdq.co.uk%2Fncol%2Ftest%2Forder_A3DS.asp"  >
	<noscript>
		<div>JavaScript is currently disabled or is not supported by your browser<br/>
Please click on the &quot;Continue&quot; button to continue the processing of your 3-D secure transaction.<br/>
			<input class="ncol" type="submit" value="Continue" id="submit1" name="submit1" />
		</div>
	</noscript>
	<div>
		<input type="hidden" name="CSRFKEY" value="C17284...79" >
		<input type="hidden" name="CSRFTS" value="2024...1" >
		<input type="hidden" name="CSRFSP" value="/ncol/test/orderdirect.asp" >
		<input type="hidden" name="creq" value="eyJ...2In0">
		<input type="hidden" name="threeDSSessionData" value="UE9Q...1Ng">
	</div>
</form>
<form method="post" action="order_agree.asp" name="uploadForm3D" id="uploadForm3D">
	<input type="hidden" name="CSRFKEY" value="D5CED1AE...381" >
	<input type="hidden" name="CSRFTS" value="202...1631" >
	<input type="hidden" name="CSRFSP" value="/ncol/test/orderdirect.asp" >
	<input type="hidden" name="branding" value="" />
	<input type="hidden" name="payid" value="42...6" />
	<input type="hidden" name="storealias" value="" />
	<input type="hidden" name="hash_param" value="CC29B931BF...C8" />
	<input type="hidden" name="xid_3D" value="" />
	<input type="hidden" name="version_3D" value="" />
	<input type="hidden" name="status_3D" value="XX" />
	<input type="hidden" name="eci_3D" value="7" />
	<input type="hidden" name="error_3D" value="" />
	<input type="hidden" name="cardnumber" value="" />
	<input type="hidden" name="Ecom_Payment_Card_Verification" value="123" />
	<input type="hidden" name="CVCFlag" value="3" />
	<input type="hidden" name="cavv_3D" value="" />
	<input type="hidden" name="cavvalgorithm_3D" value="" />
	<input type="hidden" name="signatureOK_3D" value="" />
	<input type="hidden" name="hash_param_3D" value="D0...BB" />
</form>
<SCRIPT LANGUAGE="Javascript" >
<!--
var popupWin;
var submitpopupWin = 0;

function LoadPopup() {
	if (self.name == null)	{
		self.name = "ogoneMain";
	}
	popupWin = window.open('about:blank', 'popupWin', 'height=400, width=390, status=yes, dependent=no, scrollbars=yes, resizable=no');
	if (popupWin != null) {
		if  (!popupWin || popupWin.closed) {
			return 1;
		} else {
			if (!popupWin.opener || popupWin.opener == null) {
				popupWin.opener = self;
			}
			self.document.forms.downloadform3D.target = 'popupWin';
			if (submitpopupWin == 1) {
				self.document.forms.downloadform3D.submit();
			}
			popupWin.focus();
			return 0;
		}
	} else {
		return 1;
	}
}
	submitpopupWin = 1;
	var aalp=LoadPopup();
	if (aalp==1){
		var OldMD = self.document.forms.downloadform3D.MD.value;
		var NewMD = 'MAINW';
		var ii;
		for(ii = 5; ii< OldMD.length;ii++){
			NewMD=NewMD + OldMD.charAt(ii);
		}
		self.document.forms.downloadform3D.MD.value = NewMD;
		self.document.forms.downloadform3D.submit();
	} else {
	}
//-->
</SCRIPT>

Anyone have some advice how i should handle this, especially considering, that this needs to happen midway through my already processing form submit and running server action.

The Current Flow

  1. User gets to the payment page
  2. After entering card details, they submit, my Server Action runs.

Server Action Steps

  1. API Action to the Banks endpoint with form data.
  2. Database Insert successful response from bank
  3. Emails success or error from API response

Form

  1. on-success: reset form, show modal with success message
  2. on-error: show modal with error message.

Questions are

  1. How do i load this returned HTML
  2. How do i break out of the server action after getting this particular API response, and then continue the script running after the user enters their one time pin.

I tried a slightly different parameter in the inputs and got a slightly different response of

<form id="downloadform3D" name="downloadform3D" method="post" action="https&#58;//v2-sim.preprod.psp-solutions.com/acs-simulation/challenge&#63;redirectUrl=https%3A%2F%2Fmdepayments.epdq.co.uk%2Fncol%2Ftest%2Forder_A3DS.asp"  >
	<noscript>
		<div>JavaScript is currently disabled or is not supported by your browser<br/>
Please click on the &quot;Continue&quot; button to continue the processing of your 3-D secure transaction.<br/>
			<input class="ncol" type="submit" value="Continue" id="submit1" name="submit1" />
		</div>
	</noscript>
	<div>
		<input type="hidden" name="CSRFKEY" value="E9A8CD5...8D" >
		<input type="hidden" name="CSRFTS" value="2024...9" >
		<input type="hidden" name="CSRFSP" value="/ncol/test/orderdirect.asp" >
		<input type="hidden" name="creq" value="eyJ...wZWFjNTgxZTI1In0">
		<input type="hidden" name="threeDSSessionData" value="TUF...OA">
	</div>
</form>
<form method="post" action="order_agree.asp" name="uploadForm3D" id="uploadForm3D">
	<input type="hidden" name="CSRFKEY" value="836...E1A" >
	<input type="hidden" name="CSRFTS" value="2024...249" >
	<input type="hidden" name="CSRFSP" value="/ncol/test/orderdirect.asp" >
	<input type="hidden" name="branding" value="" />
	<input type="hidden" name="payid" value="42...98" />
	<input type="hidden" name="storealias" value="" />
	<input type="hidden" name="hash_param" value="87F...3" />
	<input type="hidden" name="xid_3D" value="" />
	<input type="hidden" name="version_3D" value="" />
	<input type="hidden" name="status_3D" value="XX" />
	<input type="hidden" name="eci_3D" value="7" />
	<input type="hidden" name="error_3D" value="" />
	<input type="hidden" name="cardnumber" value="" />
	<input type="hidden" name="Ecom_Payment_Card_Verification" value="123" />
	<input type="hidden" name="CVCFlag" value="3" />
	<input type="hidden" name="cavv_3D" value="" />
	<input type="hidden" name="cavvalgorithm_3D" value="" />
	<input type="hidden" name="signatureOK_3D" value="" />
	<input type="hidden" name="hash_param_3D" value="2BC...FE" />
</form>
<SCRIPT LANGUAGE="Javascript" >
<!--
var popupWin;
var submitpopupWin = 0;

function LoadPopup() {
	if (self.name == null)	{
		self.name = "ogoneMain";
	}
	popupWin = window.open('about:blank', 'popupWin', 'height=400, width=390, status=yes, dependent=no, scrollbars=yes, resizable=no');
	if (popupWin != null) {
		if  (!popupWin || popupWin.closed) {
			return 1;
		} else {
			if (!popupWin.opener || popupWin.opener == null) {
				popupWin.opener = self;
			}
			self.document.forms.downloadform3D.target = 'popupWin';
			if (submitpopupWin == 1) {
				self.document.forms.downloadform3D.submit();
			}
			popupWin.focus();
			return 0;
		}
	} else {
		return 1;
	}
}
	self.document.forms.downloadform3D.submit();
//-->
</SCRIPT>

You'll need to show your web form Server Action, else you're making 3x difficult for people to help you :stuck_out_tongue:

But I can answer the 1st question, you could show a modal and inside it use a dynamic attribute to bind the inner HTML to that bank's API Action data/response

It's just not possible to answer the 2nd question without seeing how you made stuff, unless you're able to figure it out from the 1st answer

I contacted the bank support channel and they have said that the reponse they are sending back is incorrect, which is why my attempts have been a bit of an issue.

They are not picking up when my server action is doing a server to server communication that my browser supports javascript and so their response is adding <noscript> tags around the first input, and also commenting out all the javascript.

I am at the moment testing various things like sending different HTTP_ACCEPT headers and HTTP_USER_AGENT variations to see if I can somehow make them return the result with javascript enabled. I thought sending HTTP_ACCEPT=*/* would be ok, but maybe not.

Sadly I tried sending along browserJavaEnabled=true but it just says the parameter is not recognised, I also tried sending it with its normal counterparts like browserLanguage, browserScreenHeight, browserScreenWidth, browserTimeZone, browserColorDepth but it kicked all that back too. So going to wait for the bank to respond considering they said those parameters are all supported.

Thanks Apple.

I didn't understand anything, but it seems you're now solving with them. Hope you get it sorted!

1 Like