teamie

[soft plover]

Hey there

[crude wedge]

Hello

[soft plover]

Okay so that portion of the code is for after payment is completed

We will add URL params so that you can retrieve the PaymentIntent and check the status

[crude wedge]

So I do not need that code to process the payment?

[soft plover]

Correct, notice that that code is for a switch case for the status of the PaymentIntent which you should then use to handle what happens after the payment is initiated.

[crude wedge]

Oh yes I see that clearly now.

Thank you for the clarification.

[soft plover]

Sure

[crude wedge]

One last concern, in place of the:

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

Can I switch this with something like:

const payload= await stripe.confirmCardPayment(clientSecret, {
      payment_method: {
        card: elements.getElement(CardElement),
      },
      confirmParams :{
         return_url: "my url",
         receipt_email: email
    });

[soft plover]

Yep if you are just using Card Element then that's fine

Here is our guide for Card Element: https://stripe.com/docs/payments/accept-card-payments

Which includes React tabs

[crude wedge]

I tried setting up the:

automatic_payment_methods: {
      enabled: true,
  },

But I got an error about a return URL

[soft plover]

Well you can't use automatic payment methods with Card Element

[crude wedge]

I didn't use the Card Element yet. I got the error message while testing the server

"msg" : "You must provide a `return_url` when confirming using automatic_payment_methods[enabled]=true."

That was the error I got while testing

  const paymentIntent = await stripe.paymentIntents.create({
    amount: total,
    currency: 'php',
    confirm: true,
    automatic_payment_methods: {
      enabled: true,
    },
  });

I think this was because I used the confirm: true flag. There was no error as I removed that. Does that mean everything will work fine on the frontend?

[woven pewter]

Hi there 👋 taking over. Sorry for the wait (server is a bit busy).

Give me a few minutes to get caught up.

[crude wedge]

Okay thank you

[woven pewter]

If you remove confirm: true then the Payment Intent will not automatically confirm itself on creation: https://stripe.com/docs/api/payment_intents/create?event_types-payment_intent.payment_failed#create_payment_intent-confirm

If you want it to confirm automatically, then you should remove automatic_payment_methods, include a return_url and put confirm: true back in

[crude wedge]

Okay.. I have returned the flags.

  const paymentIntent = await stripe.paymentIntents.create({
    amount: total,
    currency: 'php',
    confirm: true,
    payment_method: 'pm_card_visa',
    payment_method_types: ['card'],
  });

I'd like to accept different types of cards but it seems this is set to only receiving visa cards. Is there a workaround for this?

[woven pewter]

The card parameter will accept different types of cards automatically. The pm_card_visa is a test token for testing visa payments specifically

[crude wedge]

Also, can I set up the receipt email on the server instead of the frontend? I saw a doc from Stripe that set it up on React and another on Node. My current set up is using React but I'd preferably do that on the server.

[crude wedge]

So if I set payment_method: 'card', this will accept all kinds of cards automatically? Lastly can I use this payment_method: 'card' alongside payment_method_types: ['card']?

[woven pewter]

So if I set payment_method: 'card', this will accept all kinds of cards automatically? Lastly can I use this payment_method: 'card' alongside payment_method_types: ['card']?
payment_method is the specific card you want to charge. payment_method_options is used to specify which types of payment methods you wish to be able to accept. I would recommend reading the docs on these fields: https://stripe.com/docs/api/payment_intents/object?event_types-payment_intent.payment_failed#payment_intent_object-payment_method_options

[crude wedge]

Please I keep getting this error message on my frontend:

"You did not provide an API key. You need to provide your API key in the Authorization header, using Bearer auth (e.g. 'Authorization: Bearer YOUR_SECRET_KEY'). See https://stripe.com/docs/api#authentication for details, or we can help at https://support.stripe.com/."

But I clearly set up the secret key on the server using the .env variable and I also set up the pk on the frontend

[crude wedge]

Will read this

const stripe = require('stripe')(process.env.STRIPE_SECRET_KEY);

[woven pewter]

If you hard-code the API key, does it work?

[crude wedge]

I'll try that now. I also had that issue on the frontend where I use my "pk" until I hardcoded it.

We're advised not to share the keys especially the sk directly which is why I'm using env vars

Now the error message changed to "Invalid integer: NaN"

[woven pewter]

Correct, you shouldn't share those keys and it's best to use ENV variables, but I wanted to troubleshoot. You should make sure your request works with the hard-coded API key first, then work on getting the ENV variables setup properly