Guides
Dashboard

Apple Pay & Native Pay Methods

In the React Native SDK, Apple Pay can be used to process payments with a smooth and native experience. Before displaying the Apple Pay sheet, it is essential to ensure that the device supports Apple Pay.

Suggest Edits

1. (Optional) Configure Billing Data Collection

You can configure the SDK to request billing data (e.g., email) during the Apple Pay flow.

await moneyHashSDK.setNativeApplePayConfig({
  collectibleBillingData: ['email'], // Currently, only "email" is supported
});
  • Pass an empty array ([]) to disable billing data collection.

2. Check Device Compatibility

Ensure Apple Pay is supported on the device before showing the sheet:

const isCompatible = await moneyHashSDK.isDeviceCompatibleWithApplePay();

if (isCompatible) {
  // Proceed with Apple Pay
} else {
  console.log("This device does not support Apple Pay");
}

🚧

Only supported on iOS. Calling this on other platforms will throw an error.

Apple Pay Payment Flow (Two-Step Approach)

Apple Pay now follows a modular flow:

  1. Generate the Apple Pay receipt using generateApplePayReceipt
  2. Submit the receipt using submitPaymentReceipt after obtaining the intentId

Step 1: Generate Apple Pay Receipt

You can use the new generateApplePayReceipt(params) method in two ways:

✅ Option A: Using ApplePayData (from NativePay state)

if (intentState.nativePayData) {
  const applePayData = intentState.nativePayData as ApplePayData;

  try {
    const receipt = await moneyHashSDK.generateApplePayReceipt({
      depositAmount: applePayData.amount || 0.0,
      applePayData,
    });

    console.log("Apple Pay Receipt generated:", receipt);
    // Store receipt to use later in step 2

  } catch (error) {
    console.error("Error generating Apple Pay receipt:", error.message);
  }
}

✅ Option B: Using Explicit Parameters

try {
  const receipt = await moneyHashSDK.generateApplePayReceipt({
    depositAmount: 10.0,
    merchantIdentifier: "merchant.com.example",
    currencyCode: "USD",
    countryCode: "US",
    supportedNetworks: ["visa", "masterCard"],
    merchantCapabilities: ["supports3DS"],
  });

  console.log("Apple Pay Receipt generated:", receipt);
} catch (error) {
  console.error("Error generating Apple Pay receipt:", error.message);
}

💡

The receipt is only valid for a short time. Make sure to submit it soon after generation.

Step 2: Submit the Payment Receipt

Once you have the intentId (usually from your backend), submit the receipt to complete the payment:

try {
  const intentId = "<intent_id>"; // Replace with your actual intent ID

  const intentDetails = await moneyHashSDK.submitPaymentReceipt(
    intentId,
    receipt // From Step 1
  );

  console.log("Payment completed successfully:", intentDetails);
} catch (error) {
  console.error("Error submitting payment receipt:", error.message);
}

Updated 6 days ago