Home    _TEMP_    Payment Page using IFrame

Tell us about your experience

Payment Page using IFrame

On this page:

Overview

The Payment Page using IFrame integrates the Apple Pay payment method button into the Nuvei Payment Page solution. If the customer device supports Apple Pay and Apple Pay is enabled on the backend, Apple Pay is displayed in the payment methods gallery. The payment method appears in an IFrame on its own page for the customer to select. When the customer selects Apple Pay, the system handles the rest of payment flow automatically.

The integration involves inserting the sc_applepay.min.js script on top of the merchant website, which acts as a proxy between the IFrame and the main website page.

Integration

Include the sc_applepay.min.js script on the top-level page of the merchant website, before the Nuvei IFrame is initiated.

  • A merchant can obtain the sc_applepay.min.js script from https://cdn.safecharge.com/safecharge_resources/v1/sc_applepay.min.js
  • Add <meta name="referrer" content="strict-origin-when-cross-origin"> to the top-level page to prevent a Cross-Origin Resource Sharing (CORS) error from blocking the Apple Pay validation request.
  • The Nuvei IFrame must be included directly on the merchant website and not nested in another IFrame.
  • Send the parent_url parameter to the IFrame as the domain name of the parent page.

The following example shows the main page of a website that includes the sc_applepay.min.js script and a /purchase request called from within an IFrame.

Example HTML Main Page with Library and IFrame
<head>
…
 <script src=
   "https://cdn.safecharge.com/safecharge_resources/v1/sc_applepay.min.js"></script>
</head>
<body>
…
 <div>
  <iframe name="sc_frame" src=
    "https://secure.safecharge.com/ppp/purchase.do..."></iframe>
 </div>
…
</body>

Testing

Test the Apple Pay implementation in the Apple Pay Sandbox environment using the test card details provided.

For details, see Apple Pay Integration Testing.

Last update iconLast modified October 2026