Apple & Google Pay Submission

Checking available payment methods Copied

Use the getAvailablePaymentMethods() method to check what payment methods are currently available and which processors support them.

const availablePaymentMethods = await form.getAvailablePaymentMethods();

You can check the available processors in method.processors. The result is an array like:

{
    name: SubmitMethods;
    processors: ("stripe" | "airwallex" | "authorize_net" | "adyen" | "paypal" | "pockyt" | "loop")[];
    isAvailable: boolean;
}[]

Submitting Apple Pay/Google Pay Copied

Basic submission Copied

If Apple Pay is available, you can submit Apple Pay/Google Pay with:

form.generalSubmit('apple-pay'); // or 'google-pay'

If you don’t specify a processor, OJS will us the first available one.

Specifying a processor Copied

To explicitly submit through a specific processor (e.g., Stripe):

form.generalSubmit('apple-pay', { processor: 'stripe' });

Randomize processor selection Copied

If multiple processors support the method, you can randomize processor choice. This can be helpful for A/B testing, load distribution, or failover scenarios.

form.generalSubmit(SubmitMethods.applePay, {
  processor: Math.random() < 0.5 ? 
             'stripe' : 'airwallex',
});

Apple pay integration notes Copied

Apple Pay requires that you call applePay.startFlow() directly within a user gesture handler such as a click or onClick. This is enforced by the browser — violating it will result in Apple Pay failing silently or throwing an error.

To ensure a successful integration, follow these requirements:

✅ Do’s Copied

• Call applePay.startFlow() immediately inside a user-triggered event (e.g., a click or onClick).

• Ensure the event handler runs on the main thread (i.e., don't await anything before calling startFlow).

• Keep the triggering element (like a button) visible and mounted during the Apple Pay session.

❌ Don’ts Copied

• Wrap startFlow() in useEffect, setTimeout, or any async flow not triggered by a user.

• Do async work (like API calls) before calling startFlow().

• Unmount or hide the button while Apple Pay is still processing.

Example Copied

<button id="apple-pay-btn">Pay with Apple Pay</button>

<script>
  const button = document.getElementById('apple-pay-btn');

  button.addEventListener('click', () => {
    // ✅ Called immediately in user gesture
    openpay.applePay.startFlow();
  });
</script>