#nicholaspuglia_api
1 messages ¡ Page 1 of 1 (latest)
đ Welcome to your new thread!
â˛ď¸ We'll be here soon! Typically we respond in a few minutes, but sometimes we might take a bit longer if the server is busy or if you have a particularly tricky question.
âąď¸ We close idle threads, which makes them read-only. Once a thread is closed it won't be reopened, but you can always start a new thread if you have another question.
đ This thread will always be available, even after it's closed. You can find it again using Discord's search, or you can save this link: https://discord.com/channels/841573134531821608/1328564666380714065
đ Have more to share? Add more details, code, screenshots, videos, etc. below.
Below are links to other discussions we've had with you in the past week in case you want to review that information. If your question is related to one of these previous discussions, please provide a comprehensive summary of the current state and what you need help with now. We help many users simultaneously, so a summary allows us to resolve your issue as soon as possible.
- nicholaspuglia_api, 3 hours ago, 35 messages
I'm trying to workout how to process a google pay payment through the payment element. When I click pay it opens the google pay modal however it seems like I cannot begin processing the payment until the user clicks the 'Pay' button within that modal? Do you guys have any clear documentation on this?
hello! There's no real difference really. You do need to fulfill certain criteria for Google Pay and Apple Pay to show though, https://docs.stripe.com/payments/accept-a-payment?platform=web&ui=elements#apple-pay-and-google-pay
It does show for me my issue is processing the payment after clicking Pay. The Google pay modal opens and it seems like the code to create a payment intent and confirm the payment is running while this modal is open before the user can click pay on that modal
Which makes me think that we need to wait for this google pay modal to resolve before trying to create a payment intent
I've seen that document but sadly doesn't have much information about how the wallet payments are different to regular card payments
They are clearly different because 1 opens a modal and the other doesn't
it depends on which flow you're using, we have one flow where you create the PaymentIntent first, and initialize the Payment Element with the PaymentIntent clientsecret, we have another flow where you initialize the Payment Element, then create the PaymentIntent
I'm using the latter
have you tried making payment?
I'm also using react-stripe-js and using the PaymentElement component
ultimately, you would just use confirmPayment with Apple and Google Pay, same as with normal card payments
there's nothing special you need to do to handle Apple and Google Pay when accepting payments
How will the code wait for the google pay modal to resolve before calling confirmPayment?
really, just try it out
I have, that's my issue. It's not waiting
Can you share the link to your site where we can see the the Payment Element? Please share the test login credentials (if any) and steps to navigate to the page where the Payment Element is displayed.
also can you share the code snippets for how you've implemented it?
I only have it working locally
Not sure what code snippets will be useful
It just seems weird that when I click pay like processing a card payment method we create a payment intent but in the case of google pay the user might not actually have clicked pay on the google pay modal yet
In the video I didn't click anything on the modal it just automatically closed probably due to an error which isn't really clear what happened
without access to your site, it's going to be very difficult for me to help troubleshoot. Like what our docs say also, you should be serving your site over https for Apple and Google Pay
the code snippets that I'm looking for is what options you're initializing the Payment Element with, how you're creating the confirmation token, how you're creating the PaymentIntent, and how you're confirming the payment. In short, all the code related to accepting a payment
I'm running https locally so that's fine. I can try to get these code snippets for you
These are the options I'm creating the Payment Element component with
const StripePaymentElementOptions: StripePaymentElementOptions = { wallets: { applePay: applePayAvailable ? 'auto' : 'never' as PaymentWalletOption, googlePay: googlePayAvailable ? 'auto' : 'never' as PaymentWalletOption, }, defaultValues: { billingDetails: { name: props.customer_name, email: props.customer_email, address: { country: props.regionCode, }, }, }, }
We create a payment intent on the server side and return the client secret. Then we use that secret to call the confirmPayment
const { error: stripeError, paymentIntent } = await stripe.confirmCardPayment( clientSecret, cvcCheckObject, )
to confirm again, based off what i asked earlier, you mentioned that you're using the deferred intent flow, is that right?
Yeah we only create the payment intent after the customer clicks pay
Just saw this error message from the confirmPayment endpoint
{ "type": "invalid_request_error", "message": "Something went wrong. Unable to show Google Pay. Please choose a different payment method and try again." }
We don't call confirmCardPayment in this case we call just confirmPayment
await stripe.confirmPayment( { elements, clientSecret, confirmParams: { // Return URL where the customer should be redirected after the PaymentIntent is confirmed. return_url: url, }, redirect: 'if_required', }, )
can you share your handleSubmit code?
in essence, the code that is run when your customer clicks on "Pay"
There's alot of logic that isn't necessary to share. Basically I call elements.submit() and then some order specific logic and finally calling the server to create a payment intent
did you use await for the elements.submit()?
No that was the issue
I guess it wasn't an issue for card since there was nothing to await
Just putting that await allowed the payment the go through
good that it's working now