We have successfully integrated the Apple Pay button on our registered domain and it's functioning as expected.
However, when we attempt to use an iframe to embed our checkout page, which includes the Apple Pay button, on a different domain, the Apple Pay button is not loading.
We have received the following error message in the Safari console: "Blocked a frame with origin 'https://example.com' from accessing a frame with origin 'https://js.stripe.com'. Protocols, domains, and ports must match."
Additional context:
Our primary domain (https://example.com) has been registered and configured properly with Apple Pay. The Apple Pay button works seamlessly here.
The issue arises when we attempt to use an iframe to display our checkout page on a separate domain.
I suspect that the error is related to cross-origin restrictions. Given this situation, we are unsure how to proceed in order to ensure that the Apple Pay button is displayed within the iframe on the external domain.
Could anyone please provide guidance on how to overcome this specific cross-origin issue and successfully display the Apple Pay button within an iframe on a different domain? Are there any recommended configurations or workarounds that we should implement to make this integration possible?
