Skip to main content

Extract token from an authorized payment

Depending on your environment, there are two ways to integrate Apple Pay directly into your system:

  • Apple Pay on the Web:

    • Apple Pay JS API
    • Payment Request API

  • Apple Pay on Mobile Apps:

    • Swift / PassKit
    • Cross-Platform Frameworks

Since PayTabs Mobile SDKs support Apple Pay on both Native iOs SDK and most of the Cross-Platform Frameworks. The following list, shows all supported SDKs for Apple Pay:

Hence, we will focus on the Apple Pay throigh the Web on this manual.

Caution

if you still need to handle your own manual integration through PassKit, please check Apple Pay developer documentation PassKit (Apple Pay and Wallet).

Prerequisites​

  • Ensure your PayTabs Merchant profile enabled for Apple Pay.


    Caution

    If your PayTabs profile is not support Apple Pay yet, kindly make sure to contact [email protected] or your account manager requesting to enable Apple Pay.


  • Apple Developer Account:
    You need to have a developer account. If not, enroll in the Apple Developer Program as an individual or organization. Enterprise accounts cannot be used for Apple Pay.

  • Merchant ID:
    Create a unique Merchant Identifier.

  • Configure your Apple Pay Payment Processing Certificate in your PayTabs profile:

    On how to do that in step by step, please check or solution article, How to configure Apple Pay certificate in my PayTabs dashboard?

  • Merchant Identity Certificate:

    This certificate is required to authenticate merchant sessions with Apple's servers.


    • Click here for step-by-step guide to generating your merchant-cert.crt and private key.

    • Step 1: Generate a Private Key and CSR

      Open your PC terminal. We will use OpenSSL to generate a "Certificate Signing Request" (CSR). This creates a private key on your machine and a request file to be send to Apple.

      Run this command:

      openssl req -new -newkey rsa:2048 -nodes -keyout merchant-cert.key -out request.csr

      • Input: It will ask for details (Country, State, etc.). You can leave most blank, but ensure the Common Name (CN) helps you identify it (e.g., "MyWebShop").

      • What it does: It creates two files: merchant-cert.key (Your PRIVATE key, keep this safe!) and request.csr (The file you give to Apple).


    • Step 2: Upload the .csr certificate to Apple Developer Portal, to create the Merchant Identity Certificate

      1. Log in to your Apple Developer Account.
      2. Go to Certificates, Identifiers & Profiles.
      3. Select Identifiers from the sidebar, then filter by Merchant IDs.
      4. Select your Merchant ID (e.g., merchant.com.yourdomain.shop).
      5. Under Apple Pay Merchant Identity Certificate, click Create Certificate
      6. Upload the request.csr file you created in Step 1.

    • Step 3: Download and use the certificate within your integration.


      Caution

      You may need to convert the certificate to PEM format, e.g for PHP cURL. To convert the certificate use the following command:

      openssl x509 -inform der -in merchant_id.cer -out merchant-cert.crt

  • Domain Verification:

    Register and verify every top-level domain and subdomain that displays the Apple Pay button. For more details check Apple Developer Documentation link: Register and Verify Your Domain


  • Server Requirements:
    Serve all pages containing Apple Pay over HTTPS with TLS 1.2 or newer.
Caution
  • The Payment Processing certificate expires every 25 months.
  • The Merchant Identity certificate expires every 25 months.
  • A registered domain’s verification expires when its SSL certificate expires.

For more details chick Apple Developer Documentation link: Maintaining Your Environment

Workflow​

Here is a side-by-side technical breakdown comparing how the three architectural phases execute across both integration methods.

Phase 1: Initiation & Merchant Validation​

This phase handles the initial handshake, setting up event triggers, and authenticating the merchant domain via an Apple-issued session token.

  • Apple Pay JS:

    • Loads Apple’s external CDN SDK.
    • Instantiates new ApplePaySession(version, paymentData) and calls .begin() to open the overlay.
    • Captures event.validationURL directly from the onvalidatemerchant property callback.
    • Passes the backend's token back to the UI via session.completeMerchantValidation(token).

  • Payment Request API:

    • Relies purely on native browser bindings (no external scripts).
    • Instantiates new PaymentRequest(methodData, details) with supportedMethods: 'https://apple.com/apple-pay' and calls .show().
    • Listens via a generic DOM event listener ('merchantvalidation') and extracts the nested event.validationURL.
    • Passes the backend's token back by resolving a promise loop: event.complete(sessionPromise).

Phase 2: Payment Authorization​

This phase triggers user biometric authentication (Face ID/Touch ID) and requests cryptographic payment packets from Apple’s servers.

  • Apple Pay JS:

    • The browser manages the internal biometric challenge independently.
    • Upon a successful biometric match, it routes the payload directly to the client-side onpaymentauthorized callback framework.

  • Payment Request API:

    • The underlying browser handles the biometric challenge through native operating system frameworks.
    • Upon success, it resolves the top-level .show() JavaScript Promise entirely, shifting control to a unified PaymentResponse object.

Phase 3: Payment Processing & Fulfillment​

The final phase extracts the encrypted payment token, forwards it downstream to PayTabs for settlement, and closes the native UI layer.

  • Apple Pay JS:

    • Extracts the token cleanly from the event path: event.payment.token.
    • Dispatches the token payload to PayTabs via direct request to settle the funds.
    • Closes the native sheet explicitly using an Apple-defined integer status constant: session.completePayment(ApplePaySession.STATUS_SUCCESS).

  • Payment Request API:

    • Extracts the identical Apple token, but extracts it from the browser-abstracted path: response.details.token.
    • Dispatches the payload to PayTabs settle the funds via direct request.
    • Closes the native sheet by resolving the browser's response object via a string parameter: response.complete('success').

Diagram of the Payment Flow:​

We are glad to be always in help. We aim to serve you better each time. As such, please spare a minute to share feedback about your recent experience with PayTabs Developers , on Trustpilot, or Google Reviews.