Skip to main content
Apple Pay is currently in closed beta testing. If you would like to use Apple Pay, please contact your account manager.

Overview

Apple Pay integration allows customers to pay using their Apple devices (iPhone, iPad, Mac) with Touch ID, Face ID, or passcode authentication. The Paysight Widget supports Apple Pay for a seamless checkout experience.

How Apple Pay Beta Works on Paysight

Apple Pay is enabled on Paysight through a guided setup process managed by our team during the beta phase.
  • Custom Widget Subdomain For each merchant account (MID) using Apple Pay, we provision a dedicated subdomain for the Paysight Widget (for example, pay.yourstore.com). This domain is required by Apple for Apple Pay validation.
  • Merchant Enrollment Paysight handles Apple Pay merchant enrollment on your behalf. Apple Pay is currently enabled per merchant account, one MID at a time. To complete enrollment, we require your company name, registered address, and MCC code.
  • Merchant Identifier Once enrollment is complete, we provide you with a unique Apple Pay merchant identifier. This identifier must be included in your widget configuration to enable Apple Pay for the selected merchant account.
This setup process will be fully automated within the Paysight UI in an upcoming release. During the beta period, enrollment is handled manually per MID upon request.

Prerequisites

1

Contact Your Account Manager

Apple Pay is currently in closed beta. Contact your Paysight account manager to request access.
2

Install and load the Widget

Ensure you have the Paysight Widget installed or loaded on your page. See Installation.
3

Complete Company Information

Make sure you have filled in all details in the Companies section of Paysight for the relevant MIDs.

Steps to Get Started

1

Select Your MIDs

Select a MID or MIDs you would like to enable Apple Pay on.
2

Verify Company Details

Make sure you have filled in all details in the Companies section of Paysight for the relevant MIDs.
3

Choose Subdomain

Decide on a subdomain for each company/MID you would like to use (e.g., pay.mystore.com).
4

Choose Support URL

Decide on a support URL for each company/MID (e.g., mystore.com or dedicated support URL).
5

Open Support Ticket

Open a Support Ticket on Paysight with title Apple Pay - MID ID and provide us with all of the above information.
6

Setup DNS Records

We will be in touch for you to setup DNS records for the subdomain and confirm that everything is setup for the selected merchant accounts.

Apple Pay Configuration

Once you receive approval for your MIDs, you can initialize your widget with the additional applePay property:

Configuration Properties

  • applePayMerchantId (string, required): Apple Pay merchant identifier provided by Paysight (per merchant account)
  • applePayDomain (string, required): Apple Pay domain (per merchant account) - the subdomain you chose during setup
  • applePaySupportUrl (string, required): Support URL for Apple Pay wallet redirects. If user goes to Apple Pay via wallet, we redirect to this URL
Apple Pay requires a minimum of Name and Email to process a transaction. These can be provided either:
  • As fields in the widget configuration, or
  • In the customer object in the widget configuration

Implementation Examples

import { useEffect, useRef } from 'react';

export function CheckoutWithApplePay() {
  const widgetRef = useRef<any>(null);

  useEffect(() => {
    widgetRef.current = (window as any).PaysightSDK?.createWidget({
      targetId: 'widget-container-apple-pay',
      config: {
        productId: 7900,
        sessionId: `session_${Date.now()}`,
        environment: 'production',
        amount: 1.00,
        currency: 'USD',
        locale: 'en-US',
        applePay: {
          applePayMerchantId: 'merchant.com.example',
          applePayDomain: 'pay.example.com',
          applePaySupportUrl: 'https://example.com/support'
        },
        // Apple Pay requires Name and Email - can be provided via fields or customer object
        customer: {
          firstName: 'John',
          lastName: 'Doe',
          email: '[email protected]'
        }
      },
      onMessage: (message: any) => {
        switch (message.type) {
          case 'PAYMENT_START':
            // Show loading state
            break;
          case 'PAYMENT_SUCCESS':
            // Handle successful payment
            console.log('Payment successful:', message.payload);
            break;
          case 'PAYMENT_ERROR':
            // Handle payment error
            console.error('Payment error:', message.payload);
            break;
        }
      },
      onError: (error: any) => {
        console.error('Widget error:', error);
      },
    });
    return () => widgetRef.current?.destroy?.();
  }, []);

  return <div id="widget-container-apple-pay" />;
}

Field Requirements

Apple Pay requires a minimum of Name and Email to process a transaction. These can be provided in one of two ways:

Option 1: Using Fields

Include Name and Email fields in your widget configuration:
fields: [
  {
    label: 'Full Name',
    placeholder: 'Enter your full name',
    fieldType: 'name',
    position: 'above',
    size: 'full',
    required: true
  },
  {
    label: 'Email Address',
    placeholder: 'Enter your email',
    fieldType: 'email',
    position: 'above',
    size: 'full',
    required: true
  }
]

Option 2: Using Customer Object

Provide Name and Email in the customer object:
customer: {
  firstName: 'John',
  lastName: 'Doe',
  email: '[email protected]'
}
You can use either approach - fields or customer object - or a combination of both. As long as Name and Email are provided, Apple Pay will work correctly.

Limitations and Caveats

The following limitations apply to the current Apple Pay beta implementation. These will be addressed in upcoming updates.

Configuration Management

Currently, you must pass the complete applePay configuration object in your widget initialization:
applePay: {
  applePayMerchantId: 'merchant.com.example',
  applePayDomain: 'pay.example.com',
  applePaySupportUrl: 'https://example.com/support'
}
Upcoming changes:
  • Apple Pay configuration will be controlled from your merchant accounts in Paysight
  • The applePayMerchantId, applePayDomain, and applePaySupportUrl fields will become optional overrides
  • A new applePay.enabled boolean property will be available to toggle Apple Pay on/off

MID Selection

Currently, only one MID per widget initialization can be used with Apple Pay. Upcoming changes:
  • We will be rolling out an update that automatically selects an Apple Pay compatible MID from your MID router
  • This will allow seamless Apple Pay support across multiple merchant accounts

Platform Support

Currently, Apple Pay is limited to the Paysight Widget implementation. Current limitations:
  • Shopify checkout is not supported
  • Only available through the Paysight Widget SDK
Stay tuned for updates as we continue to expand Apple Pay support across more platforms and simplify the configuration process.

Event Handling

Handle widget events to provide feedback to users during the Apple Pay flow:
onMessage: (message) => {
  switch (message.type) {
    case 'PAYMENT_START':
      // Disable submit button, show "Processing..."
      break;
    case 'PAYMENT_SUCCESS':
      // Show success message, redirect to confirmation page
      console.log('Transaction ID:', message.payload.transactionId);
      break;
    case 'PAYMENT_ERROR':
      // Show error message, allow retry
      console.error('Error:', message.payload.message);
      break;
  }
}
Full event details and patterns: Event Handling and Events Reference.

Testing

1

Use Production Environment

Apple Pay requires a production environment. Make sure you’re using environment: 'production' in your configuration.
2

Test on Apple Devices

Apple Pay is only available on Apple devices (iPhone, iPad, Mac). Test your integration on these devices.
3

Verify DNS Setup

Ensure DNS records for your subdomain are properly configured before testing.
4

Check Merchant Enrollment

Confirm with your account manager that your merchant account has been enrolled with Apple Pay.

Best Practices

  • Always provide Name and Email: Apple Pay requires Name and Email to process transactions. These can be provided via fields or the customer object in your widget configuration.
  • Test on real devices: Apple Pay functionality is only available on Apple devices, so test on actual hardware.
  • Handle errors gracefully: Implement proper error handling for cases where Apple Pay may not be available.
  • Provide fallback options: Ensure your widget still works with standard card payments if Apple Pay is unavailable.
  • Verify DNS configuration: Make sure your subdomain DNS records are correctly configured before going live.

Troubleshooting

Apple Pay Button Not Showing

  • Verify that you’re testing on an Apple device (iPhone, iPad, or Mac)
  • Check that your merchant account has been enrolled with Apple Pay
  • Ensure DNS records for your subdomain are properly configured
  • Confirm that you’re using the correct applePayMerchantId provided by Paysight

Payment Fails

  • Ensure Name and Email are provided either via fields or the customer object
  • Verify that your applePayDomain matches the subdomain configured in DNS
  • Check that your applePaySupportUrl is accessible and returns a valid page
  • Contact support if issues persist

See Also