Apple Pay

Enable Apple Pay on your website for onramp transactions

This guide covers Apple Pay for web integrations (Safari on macOS and iOS only). For native iOS apps, Apple Pay is supported automatically via the Swift SDK — see the Swift Quickstart.

To enable Apple Pay for onramp transactions on your website, you need to verify your domain with Apple through the Crossmint Developer Console. This is a one-time setup per domain.

Prerequisites

1. HTTPS hosting — your site must be served over HTTPS.
2. Crossmint account — you need an active Crossmint developer account.
3. Working onramp integration — complete a quickstart first.

Setup Instructions

1. Download the Verification File

   Go to the Apple Pay Domains page in the Crossmint Console and click Download file to get the Apple Developer Merchant ID Domain Association file.

2. Host the Verification File

   Host the downloaded file on your server at the following path:

   https://YOUR_DOMAIN/.well-known/apple-developer-merchantid-domain-association
   

   Example: Next.js App Router

   Option 1: Using the Public Folder

   1. Create the .well-known folder inside your public directory.
   2. Place the downloaded file in public/.well-known/ with the filename apple-developer-merchantid-domain-association (no extension).

   Option 2: Using a Route

   1. Create a folder at app/.well-known/apple-developer-merchantid-domain-association/
   2. Add a route.ts file with the following content:

   route.ts

   import { NextResponse } from "next/server";
   
   export async function GET() {
       return new NextResponse("PASTE_FILE_CONTENT_HERE", {
           headers: {
               "Content-Type": "text/plain",
           },
       });
   }
   

   Replace PASTE_FILE_CONTENT_HERE with the content of the downloaded verification file.

   Example: Next.js Page Router

   1. Create the .well-known folder inside your public directory.
   2. Place the downloaded file in public/.well-known/ with the filename apple-developer-merchantid-domain-association (no extension).

   Example: Vite

   1. Create the .well-known folder inside your public directory.
   2. Place the downloaded file in public/.well-known/ with the filename apple-developer-merchantid-domain-association (no extension).
3. Verify Your Domain

   1. Return to the Apple Pay Domains page in the Crossmint Console.
   2. Enter your domain (e.g., example.com or checkout.example.com) in the input field.
   3. Click Verify domain.

   If verification succeeds, your domain will appear in the list of registered domains and Apple Pay will be available as a payment method in the onramp checkout.

   If verification fails, ensure the file is publicly accessible at the correct path. You can test by visiting https://YOUR_DOMAIN/.well-known/apple-developer-merchantid-domain-association in your browser.

Enabling Apple Pay in the Checkout Component

Once your domain is verified, enable Apple Pay by setting applePay: true in the payment configuration:

<CrossmintEmbeddedCheckout
    orderId={order.orderId}
    clientSecret={order.clientSecret}
    payment={{
        crypto: { enabled: false },
        fiat: {
            enabled: true,
            allowedMethods: {
                card: true,
                applePay: true,
                googlePay: false,
            },
        },
    }}
/>

Local Testing

Using ngrok is recommended for local testing:

1. Start ngrok with a fixed domain if possible for consistent testing.
2. Host the verification file on your local server.
3. Register the ngrok domain in the Crossmint Console.
4. Test Apple Pay on Safari (macOS) or any iOS device.