Apple Pay - onvalidatemerchant Payment Not Completed error - ios

Question

I am implementing apple pay onto our website. I do not have a macOS device and am using windows visual studios / mvcnet. I have done all the merchantID and certification stuff and configured it on the windows machine. I am using Apple Pay JS and on the step where the payment sheet is opened with session.begin(). I use an ajax call to retrieve a merchantSession, which I believe it does successfully because the object consumed by session.completeMerchantValidation(merchantSession) contains an epochnumber, expiration time and the site name. However, immediately after completeMerchantValidation, the oncancel event is fired, and I get a red alert saying "Payment not completed".
I need help with how to proceed from here, I read somewhere online that the domain on where I am testing needs to be a registered merchant domain. For example, when I test the functionality of the button, I need to be on www.mySite.com, where I have mySite.com registered as a domain. Can someone confirm if this is true.. because I am accessing the site from my iOS devices through local IP address. If that is not true, any help proceeding from where I am would be helpful.
function StartPaySession() {
var lineItems = [
{
label: 'Shipping',
amount: '0.00',
}
];
var shippingMethods = [
{
label: 'Free Shipping',
amount: '0.00',
identifier: 'free',
detail: 'Delivers in five business days',
},
{
label: 'Express Shipping',
amount: '5.00',
identifier: 'express',
detail: 'Delivers in two business days',
}
];
var total = {
label: 'Apple Pay Example',
amount: '8.99',
};
var paymentData = {
countryCode: 'US',
currencyCode: 'USD',
shippingMethods: shippingMethods,
lineItems: lineItems,
total: total,
supportedNetworks: ['amex', 'discover', 'masterCard', 'visa'],
merchantCapabilities: ['supports3DS'],
requiredShippingContactFields: ['postalAddress', 'email'],
};
var paySession = new ApplePaySession(2, paymentData);
paySession.onvalidatemerchant = function (event) {
var validationData = { ValidationUrl: event.validationURL };
$.ajax({
url: '/orders/cart/startapplepaysession',
method: "POST",
contentType: "application/json; charset=utf-8",
data: JSON.stringify(validationData)
}).then(function (merchantSession) {
paySession.completeMerchantValidation(merchantSession);
alert("end = " + window.location.host);
}, function (error) {
alert("merchant validation unsuccessful: " + JSON.stringify(error));
paySession.abort();
});
};
paySession.onpaymentmethodselected = function (event) {
alert("1");
paySession.completePaymentMethodSelection(total, lineItems);
};
paySession.onshippingcontactselected = function (event) {
alert("2");
paySession.completeShippingContactSelection(ApplePaySession.STATUS_SUCCESS, shippingMethods, total, lineItems);
};
paySession.onshippingmethodselected = function (event) {
alert("3");
paySession.completeShippingMethodSelection(ApplePaySession.STATUS_SUCCESS, total, lineItems);
}
paySession.onpaymentauthorized = function (event) {
var token = event.payment.token;
alert("payment authorization | token = " + token);
paySession.completePayment(ApplePaySession.STATUS_SUCCESS);
}
paySession.oncancel = function (event) {
alert("payment cancel error " + event);
}
paySession.begin();
};

Answer 1

You are creating the Apple pay session at the wrong place.You need to create it from server side not on the client side.
These links might help requesting apple pay payment session, complete merchant validation
Steps are discussed here:on validate merchant

Answer 2

This is an old question, but thought I'd post my experience in case it's relevant. I was seeing the same behavior as described by original poster when testing on my local server, but was able to get payment sheet interactions to work.
What worked for me
Log in to AppleID as a Sandbox Test User
Specify "localhost" as the domain when performing merchant validation, e.g.:
{
"merchantIdentifier": "<your merchant ID>",
"displayName": "<your merchant display name>",
"initiative": "web",
"initiativeContext": "localhost"
}