To perform the integration, it must be done under the same domain that has been validated. Is it not possible to do it in a local environment?
Could that be the reason why I can't display the button or complete the validation with the API?
Selecting any option will automatically load the page
Post
Replies
Boosts
Views
Activity
Hi, I’ve been trying to integrate Apple Pay, but for some reason, the payment button is not showing up.
The project is built with Laravel 11 and Vue. I imported the script as follows:
<script crossorigin crossorigin
src="https://applepay.cdn-apple.com/jsapi/1.latest/apple-pay-sdk.js"
></script>
Then I added the following the steps:
<style>
apple-pay-button {{
--apple-pay-button-width: --apple-pay-button-width: 150px;;
--apple-pay-button-height: --apple-pay-button-height: 30px;;
--apple-pay-button-border-radius: --apple-pay-button-border-radius: 3px;;
--apple-pay-button-padding: --apple-pay-button-padding: 0px 0px;;
--apple-pay-button-box-sizing: border-box;
}
</style>
<apple-pay-button buttonstyle="black" type="plain" locale="en-US"></apple-pay-button>
I followed all the steps from the official Apple Pay demo:
https://applepaydemo.apple.com/
I also configured the Content Security Policy (CSP) to allow all necessary resources. However, when I test my integration, the button doesn’t appear. I’ve checked the console, but there are no errors.
At the same time, I have my certificate imported into the Keychain, and I’ve completed the entire process of creating both the certificate and the private key. However, when I try to validate the session using the certificate and key with Apple’s API, I get an error:
400 The SSL certificate error
https://apple-pay-gateway-cert.apple.com/paymentservices/