mastercondiment

[viscid elm]

Hi, I see you're using Card Element, can you share the document you're following for this integration?

[kindred vessel]

I've taken most from here : https://linguinecode.com/post/integrate-stripe-payment-form-with-react

because I'm using strapi as a backend, I'm currently writing all my server code in the front just to see if it will work, and then will put it in the back once it's working.

So for that I just have

    let stripeResult = await axios.post(
        'https://api.stripe.com/v1/payment_intents',
        {
            amount: 1000,
            currency: 'CAD',
            payment_method_types: ['card'],
        },
        {
            headers: {
                Authorization: `Bearer ${secretKey}`,
                'content-type': 'application/x-www-form-urlencoded',
            },
        }
    );

which is returning my key

[viscid elm]

Can you share you confirmCardPayment code please?

[kindred vessel]

sure,

    let clientSecret = stripeResult.data.id;

    let attemptPaymentResponse = await stripe.confirmCardPayment(
        '{clientSecret}',
        {
            payment_method: {
                card: cardElement,
                billing_details: {
                    name: 'TEST',
                },
            },
        }
    );

[viscid elm]

From this code, it looks like you're just passing a string with this, {clientSecret} value. To correct this, you'd need to replace this with the actual client secret.

[kindred vessel]

okay great! I changed

let clientSecret = stripeResult.data.id;

to

let clientSecret = stripeResult.data.client_secret;

and it works. I'm now getting an error to make sure the element is still mounted - but the test payment seems to have gone through ^_^ Thank you for your help!