recrenawer | Stripe Developers | Page 1

hollow furnaceBOT Sep 13, 2023, 9:19 AM

#

vagrant flicker Sep 13, 2023, 9:20 AM

#

because the amount charged is determined by the actual PaymentIntent that is confirmed, so you need to for example call your backend and update the PaymentIntent or create a new one and make sure that the correct client_secret of the relevant intent is what's used when eventually confirmPayment() is called.

full dune Sep 13, 2023, 9:27 AM

#

Thanks for your response, I am sure that my payment intent is updated as I see in the stripe panel the new payment intents with your id that are waiting to be completed. (In addition, I also paint the id on the screen to check that it really changes) It is possible that the new paiment-intent is not arriving correctly at confirmPayment(). I am using the default stripe elements code that stripe provides on its website

const [clientSecret, setClientSecret] = useState("");

useEffect(() => {
// Create PaymentIntent as soon as the page loads
fetch("/create-payment-intent", {
method: "POST",
headers: { "Content-Type": "application/json" },
body: JSON.stringify({ items: [{ id: "xl-tshirt" }] }),
})
.then((res) => res.json())
.then((data) => setClientSecret(data.clientSecret));
}, [TotalGuests]);

const appearance = {
theme: 'stripe',
};
const options = {
clientSecret,
appearance,
};

vagrant flicker Sep 13, 2023, 9:29 AM

#

yeah I'm not sure if that works and you can just change the clientSecret after initialisation in our library

#

do you get warnings in the browser console?

#

what I think I'd suggest in your case is to use the deferred flow instead : https://stripe.com/docs/payments/accept-a-payment-deferred?type=payment&client=react#create-pm where you only need to create the PaymentIntent at the end when the form is submitted and don't need a clientSecret upfront

full dune Sep 13, 2023, 9:42 AM

#

I like your suggestion, I think this way I can solve the problem! Thank you so much 🙂

Do you think that if I send a prop to checkout form with the new clientsecret that I generate and add it to the createpayment intent it will work?

I currently have it like this:

app.jsx:
<Elements options={options} stripe={stripePromise}>
<CheckoutForm />
</Elements>

checkoutform.jsx:
const { error } = await stripe.confirmPayment({
elements,
confirmParams: {
// Make sure to change this to your payment completion page
return_url: "http://localhost:3000",
},
});

New change:
app.jsx:
<Elements options={options} stripe={stripePromise}>
<CheckoutForm ClientSecret={ClientSecret} />
</Elements>

checkoutform.jsx:
const { error } = await stripe.confirmPayment({
elements,
clientSecret,
confirmParams: {
// Make sure to change this to your payment completion page
return_url: "http://localhost:3000",
},
});

The change sends the clientsecret prop to the checkout and in the confirmpayment I also indicate it

What do you think?

vagrant flicker Sep 13, 2023, 9:46 AM

#

I honestly don't know, sorry, I'd need to test it out

#recrenawer