#mhiggie

1 messages · Page 1 of 1 (latest)

sharp copperBOT
teal pendant
#

👋

runic iris
#

Hi thank you

#

okay so you guys have an awesome summary page provided for each order

#

i want to actually make that my return url

#

but.. i forget where that link is provided upon completing a successful payment

teal pendant
#

Hm, which summary page are you referring to?

runic iris
#

it has things like a support email to reach out to

#

things i have setup thru the dashboard

#

its gray

#

I just kinda forget where that lives

teal pendant
#

Though this should be a URL you own/manage

runic iris
#

okay i will search a bit more for that no worries

#

another question

#

my return url is currently..

#

`const handleSubmit = async (e) => {
e.preventDefault();

if (!stripe || !elements) {
  // Stripe.js has not yet loaded.
  // Make sure to disable form submission until Stripe.js has loaded.
  return;
}

setIsLoading(true);

const { error } = await stripe.confirmPayment({
  elements,
  confirmParams: {
    // Make sure to change this to your payment completion page
    return_url: https://www.example.com/payment-complete,
  },
});`
#

upon completing payment i am redirected to...

#

how do i handle this?

teal pendant
runic iris
#

Here my frontend route

#

<Route path="/payment-complete/:payment_intent/:payment_intent_client_secret/:redirect_status" element={<PaymentCompleteScreen user={user} notify={notify}/>}/>

#

tried this a bunch of ways

#

how do i handle the path of this return_url in a route in react

#

i would like to cut the path down to path="/payment-complete" then just ignore any and all query params after but idk

#

not finding a good way of doin that so far

twin crest
#

Hello 👋
Taking over and reading up on the context

runic iris
#

cool thank you. Just realized that the return url is likely not able to pass user as a prop since u guys are redirecting so will try without that

#

so that payment complete path will look like..

#

<Route path="/payment-complete" element={<PaymentCompleteScreen />}/>

#

no props

twin crest
#

are you using react router?

runic iris
#

ya v6

twin crest
#

Its been a while since I used it 🙂
Give me a moment to take a look at the docs

runic iris
#

ah thank you !

twin crest
#

Taking a step back, what information are you interested in on your success page?

runic iris
#

just a basic order summary. amount paid, date, etc

#

https://www.example.com/payment-complete?payment_intent=pi_3LvRXYL7RwICZVhr1gZKglfI&payment_intent_client_secret=pi_3LvRXYL7RwICZVhr1gZKglfI_secret_rU28kz4aOTOs06dXwHFf2iLtz&redirect_status=succeeded

#

^this is what im currently getting returned to

twin crest
#

Gotcha, so technically you're not using any information from the query parameters correct?

runic iris
#

no i am not

#

happy to once i can actually catch this return

#

but struggling to "catch" it

twin crest
#

Ah ok ok
Checking something..

#

ugh react router docs have changed so much

runic iris
#

yeah that last update was a doooozy for sure

#

okay so my return url is...

#

https://www.example.com/payment-complete?payment_intent=pi_3LvQuIL7RwICZVhr13Hb5Yiv&payment_intent_client_secret=pi_3LvQuIL7RwICZVhr13Hb5Yiv_secret_eHciftF8FYc9gCXYlGzuaBbrh&redirect_status=succeeded

#

so my path in that route should be..

twin crest
#

I believe just /payment-complete should work

runic iris
#

eh doesn't

twin crest
#

what route are you hitting instead?

runic iris
#

going to try this..

#

<Route path="/payment-complete?payment_intent=intent" element={<PaymentCompleteScreen />}/>

#

i would have thought just /payment-complete would work

#

especially without the 'exact' in there

#

still no bueno

#

hmm

#

hey no worries - will keep wrestling with it

#

good news is once this is done then all is good with this project

#

last hurdle

#

have an awesome friday stripe people 😀

twin crest
#

NP! 🙂 sorry we couldn't help much as this wasn't a Stripe question

#

Good luck