Hi,
I'm adding ApplePay to our website. It works perfectly. However, I want to hide the ApplePay button on devices that do not have an Apple Wallet configured. I am using the following code to verify this as per ApplePay documentation.
function ShowApplePayButton() {
if (window.ApplePaySession) {
if (ApplePaySession.canMakePayments()) {
if (ApplePaySession.canMakePaymentsWithActiveCard('visa') ||
ApplePaySession.canMakePaymentsWithActiveCard('masterCard')) {
return true;
}
}
}
return false;
}
This function always returns true from a Mac with no wallet configured. So the applePay button is visible on the Mac. When I click on the ApplePay button, there is no option to add or update the Wallet.
This is my ApplePay sample code
function onApplePay() {
if (!ApplePaySession) {
return;
}
var grandTotal = "10";
// Define ApplePayPaymentRequest
const request = {
countryCode: 'GB',
currencyCode: 'GBP',
merchantCapabilities: ['supports3DS'],
supportedNetworks: ['masterCard', 'visa'],
total: { label: 'Total', amount: grandTotal, type: 'final' },
requiredBillingContactFields: ["postalAddress", "name", "phone", "email"],
requiredShippingContactFields: ["postalAddress", "name", "phone", "email"]
};
// Create ApplePaySession
const session = new ApplePaySession(3, request);
session.onvalidatemerchant = async event => {
// Call your own server to request a new merchant session.
const merchantSession = await getAsync("/test/ValidateMerchant", "", "json")
session.completeMerchantValidation(merchantSession);
};
session.onpaymentmethodselected = event => {
const update = {
newTotal: { label: 'Total', amount: grandTotal, type: 'final' }
}
session.completePaymentMethodSelection(update);
};
session.onshippingmethodselected = event => {
const update = { newTotal: { label: 'Total', amount: grandTotal, type: 'final' } };
session.completeShippingMethodSelection(update);
};
session.onshippingcontactselected = event => {
};
session.onpaymentauthorized = event => {
const result = {
"status": ApplePaySession.STATUS_FAILURE
};
const payment = event.payment;
aj.post('/test/ProcessPayment', body, function (response) {
if (response.approved) {
session.completePayment(ApplePaySession.STATUS_SUCCESS);
} else {
session.completePayment(ApplePaySession.STATUS_FAILURE)
}
}, function (xhr, ajaxOptions, thrownError) {
console.log(thrownError);
}, true, 'json');
};
session.oncancel = event => {
// Payment canceled by WebKit
};
session.begin();
}
Could you please suggest a workaround to resolve this issue?
dAugustine
Users receive reputation points by contributing quality content to the forums.
Posts include post and replies published on the forums.
Post authors can mark replies as Accepted to indicate successful solutions.
Apple Developer Forums admins can mark replies as Apple Recommended to indicate an approved solution
From
United Kingdom