Stripe: give session/checkout info to success page

Wappler General How To
#1

How can I capture the checkout info on the ‘success page’ after a successful purchase? (using ‘stripe checkout’ so not a custom checkout page)

I’d imagine it should be possible by doing something like this?:

image
image1055×332 28 KB

Use case:
Checkout successful → redirect to /welcome → grab the name/email/product from checkout → add name/email to database → show forms on /welcome to add more data to user in the database(password etc.)

I just need to pass the checkout ID to the page I guess, that way I can look it up with ‘retrieve checkout session’ and get all that info image

#2

Solution:
Add session_id={CHECKOUT_SESSION_ID} to the success url image

Then:

  1. Pass the query to the server action image
  2. Server side: use the session ID to retrieve the check out customer ID → retrieve customer info with that. (turn output on)
  3. Show variables on page / do what you want with the data
    image
    image701×151 11.5 KB

From:
https://stripe.com/docs/payments/checkout/custom-success-page

2 Likes
Getting Started with Stripe Webhooks
#3

I have a similar situation where I need to pass the paymentMethodID generated by the Stripe Card Element on the client side to the server side. I do see it:
image

But the value returned in a hidden field or POST-> DB insert or GET var is: [object Object]
image

Do you have any clue what is happening?

#4

I’m not 100% sure what you’re trying to do (haven’t worked with Elements yet)
But this might help: https://stackoverflow.com/questions/4750225/what-does-object-object-mean

Looks like you’re trying to show an object (how are you printing the var now?)

1 Like
#5

Thanks, indeed, stripe.createPaymentMethod JS creates an object on the client side.

But i see an ID (pm_xxxxx). How do I grab it and pass to the client side?
image
How is this payment method ID sent over to the server for use in the API?
Are you familiar with Stripe development?

#6

I’ve been diving into the Stripe dev since last week, so I can try help you figure it out.

Can you send me some more (less zoomed in) screenshots so I can see more context?

  • Where can you see the pm_1J2 ID?
#7

Been on it for over a month, learned a few things/tricks so do not hesitate to ask away.

Trying to figure out how the payment method is handled between client side and server side.
As instructed by Stripe doc, I use on click stripe.confirmCardSetup (to complete the setupIntent) and stripe.createPaymentMethod:

image
image493×668 27.6 KB

It creates an Object. Below is the Chrome Dev Tool response.
image

Where does this Object or ID go, how can i retrieve it in my API flow? @max_gb suggested I save the ID in the DB but it turns out dynamic attribute stripecard1.paymentMethod is an Object, not an ID.

Then Stripe says using “methods like stripe.confirmCardSetup or stripe.confirmCardPayment will automatically create a PaymentMethod when I confirm a SetupIntent or a PaymentIntent (API).”

image
image831×54 3.32 KB

image
Yet I see no payment methods availalble for my APIs on the server side…

#8

Definitely will! Have you figured it out since your last post?

I think I need to rebuild what you’re trying to do, it’s hard to think with you otherwise.
If possible you can share the relevant pages/server actions on github so I can look at it on my machine?

If not, can you tell me the broader goal? I will have to work with stripe elements this week as well so chance is high I need the same thing you’re doing.

#9

Sorry I don’t know how to use GitHub. I really need to check some tutorials abt it. I don’t know coding at all. I’m from a marketing background!

Didn’t figure it out yet. Still asking the community with this post and Teodor trying to help: Help with the right input variables/object