#arnaud5356
1 messages · Page 1 of 1 (latest)
Hello! We'll be with you shortly. 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.
- arnaud5356, 9 hours ago, 59 messages
Hi 👋
The CardElement is a legacy element that is deprecated. You can still use it but help/docs will be hard to find.
The PaymentElement in RN is initialized different than the Payment Element. When you use the Card Element you collect the Card info first and then create the Payment Intent.
However, when you use the Payment Element you need to first create the Payment Intent and use the client_secret to initialize the Payment Element.
We document both approaches here: https://stripe.com/docs/payments/accept-a-payment?platform=react-native
There are two tabs near the top of this doc that let you switch between the Mobile Payment Element and Card Element only integrations.
You can switch back and forth to compare and see how each approach is different.
Ok so here is my problem :
I have this error with PayElement :
ERROR
In order to create a payment element, you must pass a clientSecret or mode when creating the Elements group.
Here is my parent component code part :
<Elements stripe={stripePromise}>
<CheckOutForm cartItems={cartItems} />
</Elements>
Here is my child component code part :
<PaymentElement options={cardStyle} />
When its <CardElement options={cardStyle} />
I have no problem, it works fine.
So how do I retrieve my clientSecret please ?
Ive been dealing with that shit all day
The document I linked explains all of this
You need to create a Payment Intent on your server
And pass that value to the RN client
I already have created a payment intent on my server, here it is :
exports.createPaymentIntent = functions.https.onRequest(async (req, res) => {
try {
// Extrayez le nom du titulaire de la carte et l'adresse e-mail du corps de la demande
const { cardholderName, email, totalAmount } = req.body;
console.log("Total amount received from front-end:", totalAmount); // Vérifiez que la valeur est correcte ici
// Créez un PaymentIntent avec Stripe
const paymentIntent = await stripe.paymentIntents.create({
amount: totalAmount, // Montant en cents (par exemple, 10,00 $)
currency: "eur",
payment_method: "pm_card_visa",
billing_details: {
name: cardholderName,
email: email,
// Autres informations de facturation si nécessaire
},
});
res.json({ clientSecret: paymentIntent.client_secret });
} catch (error) {
res.status(500).json({ error: error.message });
}
});
But how do I pass the value to the RN client ?
Can you please review the code snippets in the doc I shared. They clearly show how to make the call to your back-end server to retrieve the Payment Intent
I'm asking you to read something. I don't know what you have been watching.