#joseamica
brazen robinBOT
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.
orchid garnet
Hi @rigid ingot
rigid ingot
Need more details
orchid garnet
First question
rigid ingot
How are you integrating with us
orchid garnet
Hi, i just implement a system which verifies the country origin of the card.
the only things that worries me is this on <Elements/>:
paymentMethodCreation: 'manual',
This doesnt affect any flow of my payment?
Im using 2 approaches conditionally, the checkout form and also saved cards approach
orchid garnet
const validatePayment = async () => {
if (!stripe || !elements) {
return false
}
setLoading(true)
const { error: submitError } = await elements.submit()
if (submitError) {
handleError(submitError)
setLoading(false)
return false
}
const { error: paymentMethodError, paymentMethod } = await stripe.createPaymentMethod({
elements,
})
if (paymentMethodError) {
handleError(paymentMethodError)
setLoading(false)
return false
}
//THIS IS NEW!!!
if (paymentMethod.card.country !== 'MX') {
console.log('TARJETA INTERNACIONAL')
setIsInternationalCard(true)
}
setLoading(false)
return true
}
const handleSubmit = async event => {
event.preventDefault()
const isValid = await validatePayment()
if (isValid) {
setShowTipModal(true)
}
}
orchid garnet
```js
const validatePayment = async () => {
if (!stripe || !elements) {
...
ON this i am creating a payment method so then I can grab the card details and depending of the card, ill apply different fee.
rigid ingot
no that's the right guide for what you want
orchid garnet
Ok
Ill test further with that paymentMethodCreation. I dont want to mess with all my code
because as you can see on the image I also handle saved cards
My original question is. I code this a month ago and youll make me save a lot of time figuring this out
on my node backend:
const paymentIntent = await stripe.paymentIntents.create({
customer: customerId,
amount: amounts.total,
currency: currency,
payment_method: paymentMethodId,
setup_future_usage: 'off_session',
application_fee_amount: avoFee,
transfer_data: {
destination: 'acct_1Oks58PmsglnVXF2',
},
metadata: {
venueId: params.venueId,
billId: params.billId,
tipPercentage: amounts.tipPercentage,
avoFee: avoFee,
total: amounts.total,
amount: amounts.amount,
},
})
I dont know which one represents the one im saving the card. I want to pass to the req.body a boolean to conditionally save the card
Because on my <Elements i also have setup_future_usage:
<Elements
stripe={stripePromise}
options={{
mode: 'payment',
amount: total,
paymentMethodCreation: 'manual', //NOTE ES NECESARIA?
currency: 'mxn',
setup_future_usage: 'off_session',
appearance: {
theme: 'stripe',
variables: {
colorBackground: '#F6F6F9',
// colorText: '#30313d',
// colorDanger: '#df1b41',
fontFamily: 'Ideal Sans, system-ui, sans-serif',
spacingUnit: '5px',
colorPrimary: '#4fa94d',
borderRadius: '20px',
fontSmooth: 'auto',
},
},
}}
>
It would be ideal if the save card option was on the backend, but im not really sure
rigid ingot
setup_future_usage is passed on backend
that indicates saving the card
don't pass if you don't want card saved
orchid garnet
docs:
off_session
Use off_session if your customer may or may not be present in your checkout flow.
on_session
Use on_session if you intend to only reuse the payment method when your customer is present in your checkout flow.
there are only 2 options to define setup_future_session
rigid ingot
yep
orchid garnet
so which one doesnt save the card?
I dont know what it means "when your customer is present" how a customer will not be present on hte payment :S
the difference I see between my confirmPayment (CheckoutForm) vs confirmCardPayment (CheckoutCard) is that im not passing paymentMethodId: paymentMethodId to the server
But both components send the same info, so when Stripe knows if save the card or not
rigid ingot
passing setup_future_usage with any value saves card
If you don't pass that param at all then card is not saved
orchid garnet
ok let me test
Ill get back if doesnt work Thanks!
Do you guys
have any github repo which has correctly implemented this 2 ways of charging?
So i can see ?
orchid garnet
using cardConfirmPayment and confirmPAyment
rigid ingot
Oh the confirmCardPayment only works with card payments
You should use confirmPayment always if possible
orchid garnet
Ok thanks
orchid garnet
Im passing to my backend a paymentMethodId only using card, but in checkoutform i am not. There is any inconvencience?
rigid ingot
what do you mean
orchid garnet
I have 2 components, the checkoutform, and the checkoutcard, both created a payment intent, and each one pass different params to the backend.
On the checkout form im not passing any paymentId, but i created it just to validate the card country
orchid garnet
I need to pass the paymentId to the backend? or its not necesary
I am passing it on my checkoutCard component but in my checkoutForm im not
orchid garnet
payment_method: paymentMethodId,
because im assigning it on my paymentItent.create
rigid ingot
I mean that makes sense
That's how we do it in the guide you shared
I'd do it exactly how we recommend in there
orchid garnet
Thats not exactly what i need
I am managing to payment methods stripe is giving me.
With 2 different components
rigid ingot
If you're paying with saved cards, why do you need to pass the payment method to the backend?
Just pass it to confirmpayment on frontend
You only need to do it that way for new payment methods
orchid garnet
You guys told me its not a good idea... I move all my code to the backend
Because is "secure"
rigid ingot
Depends how you implement