Apple Pay on the Web

RSS for tag

Apple Pay on the Web allows you to accept Apple Pay on your website using JavaScript-based APIs.

Posts under Apple Pay on the Web tag

119 Posts
Sort by:

Post

Replies

Boosts

Views

Activity

Apple Pay Test Environment - The Right Way
Hi team, We were wondering what's the correct way of configuring a test environment with Apple Pay. Not sure if this is explicitly mentioned in the documentation, but in order to avoid having the same certificates shared between test and production, should we have a different merchant identifier (and pair of certificates) for test purposes only? The above is the main question. However, two follow up questions: Do you know if payment processors usually allow the merchant ID to be configured, so that only payments generated with the prod certificates can be accepted? Is there any risk of someone getting hold of the certificates generated for the test environment (which are usually less safe than production) and using that to process payments in production?
2
0
335
3w
Apple Pay Merchant Token on Web
Hello. I have a few questions about the implementation of Apple Pay payments on websites. Could you help me From the documentation: Apple Pay issues an Apple Pay Merchant Token if the user’s payment network supports merchant-specific payment tokens. Otherwise, Apple Pay issues a device token for the payment request. How can we determine whether a token is a merchant token or a device token? Is it possible to determine this by any of the token fields? https://developer.apple.com/documentation/passkit/payment-token-format-reference Is it possible to understand this in other ways? Can I make recurring payments with the device token if it was issued instead of the merchant token? Is it necessary to include the tokenNotificationURL when generating a merchant token, or can we generate one without specifying it? What does the applicationExpirationDate field in the merchant token represent? Is this the date when the device token or merchant token expires and payments cannot be made with it?
0
0
250
Jan ’25
recurringPaymentRequest and Authorize.net
I am seeking clarification on recurringPaymentRequestwith Apple Pay. I am using the Apple Pay JS API to make a recurring payment request. My Payment processor is Authorize.net. The initial payment processes fine via the token. My question is, how can my web application process the subsequent payment? Authorize.net doesn't allow me to set up an ARB (Automated Recurring Billing) profile for Apple Pay tokens, unlike Credit Cards. How would I go about obtaining another token for the customer? I cannot find good documentation on the recurring billing setup with Apple Pay and Authorize.net anywhere. Thank you in advance for any guidance you can give me regarding recurring billing with Apple Pay. I created an endpoint for the tokenNotificationURL but I do not believe this endpoint receives POSTs when a recurring billing event occurs, and only other lifecycle events are logged. https://developer.apple.com/documentation/apple_pay_on_the_web/applepaypaymentrequest/3955946-recurringpaymentrequest/
0
1
223
Jan ’25
Apple Pay Integration Issue: Payment Sheet Closing Immediately After Merchant Validation
I am facing an issue while integrating Apple Pay in my React.js application. The onvalidatemerchant callback works perfectly, and the merchant validation is successfully completed. However, after the Apple Pay session is validated, the payment sheet appears briefly and then closes immediately without triggering the onpaymentauthorized event. I have provided the relevant code snippets and API implementation below. I would greatly appreciate your insights on resolving this issue. import React, { useEffect, useRef, useState } from "react"; // Relevant imports const ApplePayButton = ({ paymentType, handlePayment, cartSummary }) => { const [applePaySession, setApplePaySession] = useState(null); const cartSummaryRef = useRef(cartSummary); useEffect(() => { cartSummaryRef.current = cartSummary; }, [cartSummary]); const setupApplePaySession = async () => { if (!window.ApplePaySession || !ApplePaySession.canMakePayments()) { console.log("Apple Pay is not supported on this device/browser."); return; } const paymentRequest = { countryCode: "US", currencyCode: "USD", merchantCapabilities: ["supports3DS"], supportedNetworks: ["visa", "masterCard", "amex"], total: { label: "Total", amount: `${cartSummaryRef.current?.total?.amount || "10.00"}`, }, requiredBillingContactFields: ["postalAddress", "email", "phone", "name"], }; const session = new ApplePaySession(6, paymentRequest); setApplePaySession(session); session.onvalidatemerchant = async (event) => { try { const response = await createAndValidateApplePaySession({ validation_url: event.validationURL, provider: "APPLE_PAY", }); if (response?.status && response?.data?.applePaySession) { const merchantSession = JSON.parse( response.data.applePaySession.session_details ); session.completeMerchantValidation(merchantSession); } else { console.error("Merchant validation failed: Invalid response."); } } catch (error) { console.error(`Merchant validation error: ${JSON.stringify(error)}`); } }; session.onpaymentauthorized = (event) => { console.log("Payment authorized:", event.payment); }; session.oncancel = () => { console.log("Payment cancelled."); }; session.onerror = (event) => { console.error(`Apple Pay error: ${JSON.stringify(event)}`); }; session.begin(); }; return ( <> {paymentType === "APPLE_PAY" && ( )} </> ); }; export default ApplePayButton; createAndValidateApplePaySession = async (data) => { const { validation_url } = data; const apiUrl = ${this.finixUrl}/apple_pay_sessions; const base64Credentials = Buffer.from(this.credentials).toString("base64"); const body = { validation_url, merchant_identity: process.env.FINIX_APPLE_PAY_MERCHANT_ID, domain: process.env.FINIX_APPLE_PAY_DOMAIN, display_name: process.env.FINIX_APPLE_PAY_DISPLAY_NAME, }; const requestData = { url: apiUrl, data: body, headers: { "Content-Type": "application/json", Authorization: Basic ${base64Credentials}, }, }; try { const response = await axios.post(requestData.url, requestData.data, { headers: requestData.headers, }); return response?.data; } catch (error) { console.error("Merchant validation failed:", error); return error; } }; Current Behavior: Apple Pay button renders successfully. Clicking the button triggers the setupApplePaySession function. The merchant validation completes successfully via the onvalidatemerchant callback, and a valid merchant session is received from the API. The Apple Pay sheet appears briefly and then closes immediately. The onpaymentauthorized callback is never triggered. Expected Behavior: The payment sheet should remain open after merchant validation, allowing the user to select a payment method and authorize the payment. The onpaymentauthorized callback should then be triggered to handle the payment token.
2
1
388
Jan ’25
Issues with apple pay
Hello Everyone, I am trying to integrate apple pay on my website and have followed the following steps. Created a merchant identifier in my apple developer account. Generated a payment processing certificate using Certificate signing Request generated through keychain. Downloaded the certificate and converted that to pem file using the following command openssl x509 -inform DER -in apple_pay.cer -out apple_pay.pem Imported the cer file into keychain and exported .p12 file and generated private key using the following command. openssl pkcs12 -in Certificates.p12 -out private_key.pem -nocerts Utilizing apple_pay.pem and private_key.pem files for merchant verification call and getting the following response. cURL Error: OpenSSL SSL_read: error:14094418:SSL routines:ssl3_read_bytes:tlsv1 alert unknown ca, errno 0 Trying 17.141.128.7:443...\n* TCP_NODELAY set\n* Connected to apple-pay-gateway.apple.com (17.141.128.7) port 443 (#0)\n* ALPN, offering h2\n* ALPN, offering http/1.1\n* successfully set certificate verify locations:\n* CAfile: /etc/ssl/certs/ca-certificates.crt\n CApath: /etc/ssl/certs\n* SSL connection using TLSv1.3 / TLS_AES_128_GCM_SHA256\n* ALPN, server accepted to use http/1.1\n* Server certificate:\n* subject: businessCategory=Private Organization; jurisdictionC=US; jurisdictionST=California; serialNumber=C0806592; C=US; ST=California; L=Cupertino; O=Apple Inc.; CN=apple-pay-gateway.apple.com\n* start date: Dec 19 00:22:44 2024 GMT\n* expire date: Mar 12 19:42:00 2025 GMT\n* issuer: C=US; O=Apple Inc.; CN=Apple Public EV Server RSA CA 1 - G1\n* SSL certificate verify ok.\n> POST /paymentservices/startSession HTTP/1.1\r\nHost: apple-pay-gateway.apple.com\r\nAccept: /\r\nContent-Type: application/json\r\nContent-Length: 143\r\n\r\n* upload completely sent off: 143 out of 143 bytes\n* OpenSSL SSL_read: error:14094418:SSL routines:ssl3_read_bytes:tlsv1 alert unknown ca, errno 0\n* Closing connection I also tried to include AppleWWDRCAG2 and AppleRootCA-G2 certificated but same response every time.
1
0
275
Jan ’25
[Apple Pay]how to update multiTokenContexts when PKPaymentRequestShippingContactUpdate method trigger
multiTokenContexts is defined as follows (https://developer.apple.com/documentation/passkit/pkpaymentrequest/multitokencontexts) You can assign a value when initializing PKPaymentRequest (https://developer.apple.com/documentation/passkit/pkpaymentrequest). However, in actual usage scenarios, when the Apple Pay address changes and PKPaymentRequestShippingContactUpdate (https://developer.apple.com/documentation/passkit/pkpaymentrequestshippingcontactupdate) is triggered, how to update multiTokenContexts? The documentation and code do not provide updates for this parameter. In contrast, Apple Pay on the Web provides newMultiTokenContexts as an update when ApplePayShippingContactUpdate (https://developer.apple.com/documentation/apple_pay_on_the_web/applepayshippingcontactupdate) is triggered. Has anyone encountered this problem? Would you happen to have any solutions? Thank you.
2
0
324
Jan ’25
[Apple Pay]how to update multiTokenContexts when PKPaymentRequestShippingContactUpdate method trigger
multiTokenContexts is defined as follows (https://developer.apple.com/documentation/passkit/pkpaymentrequest/multitokencontexts) You can assign a value when initializing PKPaymentRequest (https://developer.apple.com/documentation/passkit/pkpaymentrequest). However, in actual usage scenarios, when the Apple Pay address changes and PKPaymentRequestShippingContactUpdate (https://developer.apple.com/documentation/passkit/pkpaymentrequestshippingcontactupdate) is triggered, how to update multiTokenContexts? The documentation and code do not provide updates for this parameter. In contrast, Apple Pay on the Web provides newMultiTokenContexts as an update when ApplePayShippingContactUpdate (https://developer.apple.com/documentation/apple_pay_on_the_web/applepayshippingcontactupdate) is triggered. Has anyone encountered this problem? Would you happen to have any solutions? Thank you.
0
0
328
Jan ’25
Payment Services Exception when trying to create an Apple Pay Session
I'm trying to create an Apple Pay session for my website. I'm starting with curl for now, just to get proof of concept. curl --cert cert.pem --pass {passphrase} --header "Content-Type: application/json" --request POST --data '{"merchantIdentifier":"{merchantIdentifier}","displayName":"testDisplayName", "initiative": "web", "initiativeContext": "{domain}"}' https://apple-pay-gateway.apple.com/paymentservices/paymentSession This is the response I get back { "statusMessage": "Payment Services Exception merchantId={VERY-LONG-ID} not registered for domain={domain}", "statusCode": "400" } I'm not sure why this is happening. {domain} is in the form of sub.site.tld with no protocol, such as https, which matches what I see in the list of the domains in the merchant identity dashboard. The {merchantIdentifier} also matches what I see in the top right, but the merchantId in the response is something I don't recognize. It's a long string of characters that appears to be hexadecimal. I added the apple-developer-merchantid-domain-association file to my .well-known directory and the dashboard does report that the domain is verified. I am making the request from the web server that the domain resolves to, if that matters. I can't think of any reason this would be happening. I'm not sure where the long merchantId in the response is coming from. Does it matter that it doesn't match what I supplied in the request? As far as I can tell, I am using the correct merchantIdentifier. It matches the dashboard and the CN field of the certificate. I found this other post that seems to have a similar error: https://forums.developer.apple.com/forums/thread/671227 The main difference is a 417 status code instead of the 400 I got. But the problem here was that there was no payment processing certificate and I do have one of those. I haven't checked with my processor to verify that the certificate is published, but I will do that soon. I wouldn't expect that to matter. Maybe it does? What other reason could I be getting this error? Could it be a problem with my merchant identity certificate? It took a lot of effort to make it work. But I suspect it's fine, otherwise I wouldn't be getting a response from Apple at all. I can't think of any other possible problems.
1
0
300
Jan ’25
Authorizing Apple Pay via non-Safari browser fails to decode merchant session.
When attempting to authorize an Apple Payment on an iOS 18 device using the scannable code in a non-Safari browser (i.e. Chrome), the payment sheet displays briefly, then dismisses. This same exact implementation of Apple Pay on the Web works flawlessly in Safari, so this feels like a bug given that the merchant session works fine in Safari. The following errors were found in my iOS device logs: (PassbookUIService) Codable: Failed to decode Merchant Session Created: Error Domain=NSCocoaErrorDomain Code=4864 UserInfo={NSDebugDescription=<private>, NSCodingPath=<private>} (PassbookUIService) Session 29592: Fatal Error: Failed to decode merchant session created`
4
1
429
Jan ’25
Applepay merchant validation failing with error request failed with status code 417
I am implementing apple pay and the merchant validation is failing with error (error request failed with status code 417). I am using react js in the frontend and node js in backend, this is my code const httpsAgent = new https.Agent({ rejectUnauthorized: false, cert: fs.readFileSync( path.join(__dirname, "../../../certificates/merchant_id_prod.pem") ), key: fs.readFileSync( path.join(__dirname, "../../../certificates/merchant_id_prod.key") ), }); const data = { merchantIdentifier: "merchantId", displayName: "Check", initiative: "web", initiativeContext: "domain.com", }; const response = await axios.post(validationURL, data, { httpsAgent });
0
0
220
Jan ’25
Apple Pay sometimes doesn't work (device specific)
Hey there. I recently completed an Apple Pay (on the web) integration and it has been working fine, for the most part. I had one customer contact us saying that it didn't work on his devices though. I checked it out, and while it does normally work (and we've had over a thousand transactions use it) there does seem to be some scenarios where it fails and I'm not sure why. I was able to replicate his issue (or at least an issue) by using BrowserStack. When I click the button which should initiate the payment, everything works in the JS code until it gets to the applePaySession.begin() function call. Once it hits that, it just stops. No errors are generated and no notice is given that anything is wrong until you try to do it a second time. Then an error about a payment session already being active on the page is thrown. I'm not really sure how to troubleshoot this since I know it works on my old iPad Air 2, my current M4 Macbook, multiple other devices, and also works when scanning the QR code for use on an iPhone. There is some very specific thing with some very specific versions of Safari that seem to be tripping it up. If it helps, the version of Safari on the BrowserStack device is 18.1, but the version on my Macbook is 18.1.1. The version the customer who is having the issue is on is 18.2 according to him. The customer also says they have used ApplePay on other websites with no issues. I checked one of them and they appear to be using a PayPal integration, where as I am using the ApplePay SDK straight from Apple. There are quite a few variables at play here, and I'm just trying to narrow down what I should be looking at. If one person is reporting the issue, there are probably others with it as well.
1
1
338
Jan ’25
Don't get the completed shipping contact after authorizaiton
We have get the response from Apple pay after the the customer doing the face ID & touch ID authorization. But the shiping contact is not complete, for examble: ` { "addressLines": [ "1************ kwy" ], "administrativeArea": "FL", "country": "", "countryCode": "", "emailAddress": "S*********le.com", "familyName": "******i", "givenName": "******m", "locality": "*******s", "phoneNumber": "+*******79", "phoneticFamilyName": "", "phoneticGivenName": "", "postalCode": "*****3", "subAdministrativeArea": "", "subLocality": "" },` as the documents said, it should be the completed shipping contact, but the country & countrycode is null https://developer.apple.com/documentation/apple_pay_on_the_web/applepaypayment/1916097-shippingcontact
1
0
338
Dec ’24
The Future of the PaymentRequest API
I am adding Apple Pay to my eCommerce site and I am having a lot of difficulty with the PaymentsRequest API in Microsoft Edge browser. I have a partial implementation that displays the Apple Pay button and creates a PaymentRequest when the button is clicked. That's all. On Safari, this is enough to display the Apple Pay dialog. The process doesn't proceed further because I haven't implemented a handler for the merchantvalidation event. With Chrome on a Mac, the behavior is the same, I can scan the code and see the Apple Pay dialog. On Microsoft Edge, I never see the code to scan. In my web console, I'm seeing errors like InvalidStateError: Failed to execute 'canMakePayment' on 'PaymentRequest': Cannot query payment request and NotSupportedError: The payment method "https://apple.com/apple-pay" is not supported. No "Link: rel=payment-method-manifest" HTTP header found at "https://www.apple.com/apple-pay/" Is Apple Pay not supported on Windows? I see the demo site here, which gets farther than I have gotten. It does display the scan code, but payment still never completes. I see the same payment-method-manifest error in the console. If Apple Pay is not supported on any PCs other than Macs, is there any reason to use the PaymentRequest API instead of Apple Pay JS? I started digging into the W3C standards and it turns out that merchantvalidation event is deprecated. Chrome on Mac does catch it, so it seems like it's supported there. But I have concerns about the long term future. Is it going to remain supported? If so, I would imagine that the interface could change. It seems like the only benefit of the W3C PaymentRequest API is that Mac users with non-Safari browsers may still be able to use Apple Pay. In theory, that's something I'd still like to support, even if it's only a small number of users, but I only have time for one integration right now, and I need to pick the best one. How much faith should I have in the W3C PaymentRequest API? Is it reasonable to pursue it with the goal of including all Mac users regardless of browser? Or is it likely a dead API and I should stick to Apple Pay JS instead to provide a better experience to Safari users? It also looks like the PaymentRequest API isn't fully finalized yet, so maybe that's the source of my issues. Maybe I should just use Apple Pay JS for now with an eye to supporting PaymentRequest when the spec is finalized. I greatly appreciate your input.
2
0
512
Jan ’25
Is HTTPS necessary for development with Apple Pay
I'm working on adding Apple Pay to my web site and I'm getting this error when the element loads. InvalidAccessError: Trying to start an Apple Pay session from an insecure document. Do I need HTTPS on my development site? I have it on my production site, but I've never enabled it for dev. If so, will it work with a self-signed certificate? If not, what does this error mean? How can I resolve it?
2
0
408
Dec ’24
Use payment data from recurring payment out of time
Maybe this is a strange question but I think it's better to ask this before trying it and see what happens; if we use the dpan or mpan of a recurring payment to make a charge on a date other than the one shown to the final customer, could the payment be made without any problem by the bank or financial institutions involved? Naturally I understand that this would mainly cause great anger to the customer and of course if this were the case this could be explained in the billing agreement, but the doubt is mainly based on whether it is possible to use a dpan/mpan for a payment other than that of the original subscription.
0
0
318
Dec ’24
Event id to test merchant token event details endpoint
Hi to everyone looking for more information about recurring payments I wonder if there is any way to test (maybe by using some default event id) the merchant token event token detail endpoint, it would be very helpful for merchants if there was some configuration or event id that always returned some particular event, that way we could do a better testing process instead of doing all this with a production environment. If there is any way to use some tool or sandbox to test this part of the process please tell us about it.
0
0
306
Nov ’24
Request: Increase Merchant ID Creation Limit for Apple Pay Integrations
**Hi Apple Developer Community, I’m currently integrating Apple Pay across multiple merchants for my e-commerce solution, and I’ve run into a significant challenge. Apple enforces a limit of 100 Merchant IDs per Developer Account, which is creating a bottleneck for my project. My Questions: 1- Is there a way to increase the limit of Merchant IDs on a Developer Account? 2- Has anyone faced a similar challenge and found a workaround to handle integrations with more than 100 merchants? 3- Are there any plans from Apple to lift or adjust this restriction for businesses working with high volumes of merchants? I’d appreciate any guidance, advice, or information from those who’ve encountered and resolved this issue. Thank you for your help!
2
0
440
Dec ’24
Integrating Sales Software with Website Payment via Apple Pay
Hi. I have reviewed the process of integrating Apple Pay on the web, but I still don’t understand how to implement it. For example: I currently have software A and a payment website that my software provides to restaurants. So, how can I integrate Apple Pay on the restaurants' payment websites? I read that to integrate, we need to register for a Merchant ID with Apple Pay. So, is it the restaurants or the software provider who should register? Each restaurant will have a different website domain -> does that mean when registering the Merchant ID, the website domain is the payment website of each restaurant? When Apple Pay provides the verification file, the sales software (i.e., the payment website) must help the restaurants upload that file to the payment website of each restaurant, right? To verify if it is valid or not depends on Apple Pay, right? If it is valid, the Apple Pay payment button will be displayed, correct?
0
0
418
Nov ’24