We are implementing Apple Pay on our website, but we only sell services and would prefer that the shipping address section of the Apple Pay modal doesn't require the shipping address and just show the billing address. Is there any way to achieve this?
Hi @freestylingkc,
You wrote:
We are implementing Apple Pay on our website, but we only sell services and would prefer that the shipping address section of the Apple Pay modal doesn't require the shipping address and just show the billing address. Is there any way to achieve this?
Yes, the Apple Pay JS API gives you full control over which contact fields are collected via the requiredShippingContactFields and requiredBillingContactFields properties on your ApplePayPaymentRequest object.
To achieve your desired behavior, omit postalAddress from requiredShippingContactFields (or leave the array empty), and add it to requiredBillingContactFields instead. Apple Pay will then only prompt for a billing address and skip the shipping section entirely.
Here's a quick summary of both properties:
requiredShippingContactFields: Controls what the user is asked to provide as a shipping contact. Leave out'postalAddress'to suppress the shipping address.requiredBillingContactFields: Controls what is collected as a billing contact. Add'postalAddress'here to still capture a billing address.
const paymentRequest = {
countryCode: 'US',
currencyCode: 'USD',
merchantCapabilities: ['supports3DS'],
supportedNetworks: ['visa', 'masterCard', 'amex', 'discover'],
// Only collect what you need for shipping contact (e.g. email/phone for receipts)
// Omitting 'postalAddress' hides the shipping address section
requiredShippingContactFields: ['email', 'phone'], // or [] if nothing is needed
// Collect billing address here instead
requiredBillingContactFields: ['postalAddress', 'name'],
lineItems: [
{ label: 'Service Fee', amount: '10.00' }
],
total: {
label: 'My Company',
amount: '10.00'
}
};
const session = new ApplePaySession(3, paymentRequest);
Important Notes:
- If
requiredShippingContactFieldsis empty or omitted entirely, the shipping contact section won't appear in the Apple Pay payment sheet at all. - The billing address is always associated with the card on file, but adding
'postalAddress'torequiredBillingContactFieldsensures the user confirms or provides it during checkout. - Make sure you're using Apple Pay JS API version 1 or later for
requiredBillingContactFieldssupport, and version 3 or later for the most complete field control.
Cheers,
Paris X Pinkney | WWDR | DTS Engineer