george-paymentintent-paymentmethod | Stripe Developers | Page 1

outer rivetBOT Apr 10, 2023, 5:20 PM

#

lament scarab Apr 10, 2023, 5:21 PM

#

@river spoke why are you trying to detach a PM? Can you provide a bit more specificities?

#

george-paymentintent-paymentmethod

river spoke Apr 10, 2023, 5:22 PM

#

so if we create a payment intent and the user adds their payment details, but then decides they want to change their details and put new ones in

lament scarab Apr 10, 2023, 5:23 PM

#

in that case you just confirm the PaymentIntent with the new PaymentMethod, that's all you need to do

river spoke Apr 10, 2023, 5:24 PM

#

i tried that

#

but i get an error "payment_intent_unexpected_state"

lament scarab Apr 10, 2023, 5:25 PM

#

Can you give a concrete example so that I can look at it?

river spoke Apr 10, 2023, 5:25 PM

#

sure

#

i am on the test account atm

#

I create an intent with capture mode manual

#

give the secret to the client, and their i enter the test card details.

lament scarab Apr 10, 2023, 5:26 PM

#

Sorry all I need is a concrete PaymentIntent id pi_123 to look at

river spoke Apr 10, 2023, 5:26 PM

#

oh sorr y

#

haha

#

gotcha

#

pi_3MvOBIBShoQ4tiWp0CB5q9We

lament scarab Apr 10, 2023, 5:28 PM

#

Your PaymentIntent is in status: "requires_capture". You already hold those funds. You need to cancel that PaymentIntent to return the funds and create a separate PaymentIntent for the new card details

river spoke Apr 10, 2023, 5:29 PM

#

right

#

how would I go about allowing the user to enter their payment details without holding the funds?

lament scarab Apr 10, 2023, 5:32 PM

#

That kind of doesn't really make sense as a flow usually. Why would you want to do that? Can you explain your flow of funds clearly?

river spoke Apr 10, 2023, 5:32 PM

#

so, when the user is on our app, they can enter their payment details, and then see a summary and then click book

#

so the details have been entered before hand

#

but we dont want to hold any funds yet

#

as they might change payment details before they click book

lament scarab Apr 10, 2023, 5:34 PM

#

https://site-admin.stripe.com/docs/payments/accept-a-payment-deferred you likely want this flow instead in that case. It lets you collect card details first, create a PaymentMethod and then later confirm the PaymentIntent

river spoke Apr 10, 2023, 5:34 PM

#

would this be possible on react native?

#

or is it just a web feature?

lament scarab Apr 10, 2023, 5:49 PM

#

it's just web right now unfortunately. We're working on it for Mobile SDKs but it will take a while

river spoke Apr 10, 2023, 5:50 PM

#

so essentially when payment details are confirmed, the amount is automatically held?

lament scarab Apr 10, 2023, 5:55 PM

#

yes

river spoke Apr 10, 2023, 5:55 PM

#

i see

#

so i guess thats why some companies will make an authorization request (ie amount = 0), and then process the same method with a new intenet?

lament scarab Apr 10, 2023, 5:56 PM

#

no definitely not. You can't do $0 intent, and no one would do that flow

river spoke Apr 10, 2023, 5:57 PM

#

so how do companies create an athorization request?

lament scarab Apr 10, 2023, 5:58 PM

#

I'm sorry I have no idea what that word could mean to you

#

An "authorization" is usually the same as "placing a hold on the card" which is exactly what you are already doing

river spoke Apr 10, 2023, 6:00 PM

#

right

#

basically I am trying to relate to a service that I have already used, for example paying for an uber, where by entering my details onto the app to save, there is a payment of 0 value that is made

#

and that essentially "confirms" my card details

#

without actually creating a payment

lament scarab Apr 10, 2023, 6:01 PM

#

You want a SetupIntent in that case: https://stripe.com/docs/payments/setup-intents

river spoke Apr 10, 2023, 6:03 PM

#

right i see

#

so with this method, i can basically save the customer's details before processing the payment

lament scarab Apr 10, 2023, 6:04 PM

#

yes

#

but you really should not do this if you plan to charge them immediately

#

Uber does this because they won't know the amount to charge until the end of the ride which can be hours later

river spoke Apr 10, 2023, 6:05 PM

#

as in because of best practices or some other particular reason?

lament scarab Apr 10, 2023, 6:06 PM

#

many reasons: 3DS twice, higher cost, higher risk of declines, so really no reason at all to do this in your case

#

I think you want to use https://stripe.dev/stripe-react-native/api-reference/index.html#createPaymentMethod with https://stripe.dev/stripe-react-native/api-reference/index.html#CardField for now to collect card details first and then confirm the PaymentIntent on your second step/screen

river spoke Apr 10, 2023, 6:09 PM

#

that is interesting

#

generally though there is one thing that we need to check before we attempt payment and that is issuing country

#

the reason being is we have 2 stripe accounts, one for accepting eu issued cards, and one for non eu

#

so the process was :
1-ask user to select region (EU, non-eu)
2-depending on their answer, initiate stripe component with correct strip account key
3-ask user to enter details and confirm
4-if issuing country is not in the region initially specified, then throw error

#

for this reason, we want to know if the card being entered is indeed in the right region before actually holding any money

lament scarab Apr 10, 2023, 6:13 PM

#

yeah so the flow I just outlined works

river spoke Apr 10, 2023, 6:14 PM

#

lament scarab I think you want to use <https://stripe.dev/stripe-react-native/api-reference/in...

will this create a method without an intent?

lament scarab Apr 10, 2023, 6:15 PM

#

yes

river spoke Apr 10, 2023, 6:16 PM

#

ok great we'll try using that!

#

thanks again!

lament scarab Apr 10, 2023, 6:17 PM

#

sure!

river spoke Apr 10, 2023, 6:21 PM

#

im attempting this right now

#

https://stripe.com/docs/payments/accept-a-payment-deferred

#

when the user now submits

lament scarab Apr 10, 2023, 6:21 PM

#

sounds good

river spoke Apr 10, 2023, 6:21 PM

#

does a payment method get created?

#

that i can retrieve server side?

#

if I do stripe.createPaymentMethod

#

it requires paymentIntents.CreatePaymentMethodData

#

where do i get the data for that?

#

oh got it

#

stripe.createPaymentMethod({ elements })

lament scarab Apr 10, 2023, 6:31 PM

#

you're supposed to use CardField

#

this is entirely separate from https://stripe.com/docs/payments/accept-a-payment-deferred

#

like ignore that link entirely it's not relevant to you on React Native

river spoke Apr 10, 2023, 6:32 PM

#

yes yes i got that

#

i should have mentioned that we do both web and react native

lament scarab Apr 10, 2023, 6:32 PM

#

gotcha

river spoke Apr 10, 2023, 6:32 PM

#

so i am now testing the web integration

lament scarab Apr 10, 2023, 6:33 PM

#

so yeah for web I would go with that deferred flow

river spoke Apr 10, 2023, 6:33 PM

#

so i tried that

#

i get an error when i submit the details

#

use createPaymentMethod with the Payment Element, your elements instance must be created with paymentMethodCreation: 'manual'.

#

even though i have inititated it that way]

#

 <Elements
          options={{
            // clientSecret: clientSecret,
            appearance: {
              theme: "stripe",
            },
            payment_method_creation: 'manual',
            paymentMethodTypes: ['card'],
            amount: 1000,
            mode: 'payment',
            currency: 'eur'
          }}
          stripe={stripePromise}
        >
          <CheckoutForm />
        </Elements>

lament scarab Apr 10, 2023, 6:34 PM

#

payment_method_creation and paymentMethodCreation are different

river spoke Apr 10, 2023, 6:35 PM

#

its been a long day...

#

worked!

#

so now that i got the details, i can do my checks

#

with regards to 3ds, if required it will happen with the intent im guessing

lament scarab Apr 10, 2023, 6:37 PM

#

yes

river spoke Apr 10, 2023, 6:37 PM

#

ok great

#

perfect

#

question,

#

sorry

#

if we wanted to integrate google pay and apple pay

#

which we do want to

#

can we create a payment method with the google/apple pay details before the intent as well?

lament scarab Apr 10, 2023, 6:41 PM

#

yes

river spoke Apr 10, 2023, 6:41 PM

#

ok great and that we can do on react native?

lament scarab Apr 10, 2023, 6:41 PM

#

I would say yes but I'm not certain. Best to start and try a lot of this 🙂

river spoke Apr 10, 2023, 6:41 PM

#

is there any documentation you can share for that?

#

haha indeed

outer rivetBOT Apr 10, 2023, 6:45 PM

#

lament scarab Apr 10, 2023, 6:45 PM

#

@river spoke https://stripe.com/docs/apple-pay?platform=react-native#create-payment-method is what you want for ApplePay and Google Pay

#

@sand rapids who just joined can likely help

river spoke Apr 10, 2023, 6:48 PM

#

ok great

#

i think this makes sense

#

i think you have answered all my questions

#

thanks a lot for your help

#

very much appreciated

#

have a good rest of your day!

sand rapids Apr 10, 2023, 6:54 PM

#

You too! Let us know if we can help any further!

river spoke Apr 10, 2023, 6:54 PM

#

one last thing! sorry.. once a user enters their card details, and a method is created, if the cvc was incorrect and we have to go back to the payment element, is there a way to re-initialise it with the same payment method id so that the data is prefilled?

sand rapids Apr 10, 2023, 6:56 PM

#

No that's not possible.

river spoke Apr 10, 2023, 6:57 PM

#

so if the following happens:
1- user enters card details
2- server creates payment intent
3- cvc error is returned
do we then need to ask the user to enter all the details again? and do we need to create a new intent or can we update the intent with a new payment method id?

sand rapids Apr 10, 2023, 7:00 PM

#

Ah actually, we do support CVC Recollection with the React Native SDK via createTokenForCVCUpdate: https://stripe.dev/stripe-react-native/api-reference/index.html#createTokenForCVCUpdate

#

So if it is just a CVC issue then you would not need to recollect entirety of card details

river spoke Apr 10, 2023, 7:02 PM

#

how do i then use the token?

sand rapids Apr 10, 2023, 7:02 PM

#

You would then pass that token to confirmPayment using the same PaymentIntent

#

https://stripe.dev/stripe-react-native/api-reference/index.html#confirmPayment

river spoke Apr 10, 2023, 7:02 PM

#

oh right

#

ok

#

and this only applies to cvc

#

so if the error was because of an incorrect expiry date, then we need to ask the user for all the details from scratch?

sand rapids Apr 10, 2023, 7:06 PM

#

Expiry isn't sensitive so you could collect this yourself if you want and update the PaymentMethod server-side: https://stripe.com/docs/api/payment_methods/update#update_payment_method-card

river spoke Apr 10, 2023, 7:07 PM

#

right i see

#

so for react native we just use the tokenising function, and then confirm the payment with the token, or we could send the token to the server and let server handle the confirmation correct?

sand rapids Apr 10, 2023, 7:08 PM

#

Yep pretty much

river spoke Apr 10, 2023, 7:08 PM

#

ok i see

#

is there a similar function on Stripe elements for web for cvc tokenisation?

#

i see that there is a CardCvcElement

sand rapids Apr 10, 2023, 7:11 PM

#

Yep

#

https://stripe.com/docs/payments/save-during-payment-cards-only?platform=react-native#react-native-recollect-cvc

#

Whoops that is the React Native version

#

But if you flip to "Web" at the top you will see the Web example which uses cardCVCElement

river spoke Apr 10, 2023, 7:14 PM

#

i see

#

will you guys be moving towards tokenizing all fields at some point?

sand rapids Apr 10, 2023, 7:15 PM

#

Not sure what you mean by that exactly?

river spoke Apr 10, 2023, 7:15 PM

#

so that we have full control on the input fields, and then tokenise card data and send the tokens in the request

sand rapids Apr 10, 2023, 7:16 PM

#

You mean are we moving towards having users build their own inputs for these details and then creating tokens from your custom inputs?

river spoke Apr 10, 2023, 7:17 PM

#

more like, will you be creating functions like createTokenForCVCUpdate but for the card number too

sand rapids Apr 10, 2023, 7:17 PM

#

That is what createPaymentMethod does

river spoke Apr 10, 2023, 7:18 PM

#

yes but it still uses stripe's render components

sand rapids Apr 10, 2023, 7:18 PM

#

Yeah but you could pass data to your server directly to create PaymentMethods on your server if you are PCI compliant. We just do not recommend that as it means a high PCI burden.

river spoke Apr 10, 2023, 7:19 PM

#

yes ofc ofc, i mean if you had the tokenize card number on front end, then you could send the token and have full control on reder, and not need to be PCI compliant?

sand rapids Apr 10, 2023, 7:19 PM

#

We don't really have any plans to have separate functions in our client SDKs for tokenizing individual pieces of data other than CVC if that is what you are getting at.

river spoke Apr 10, 2023, 7:19 PM

#

yep that haha

#

ok i see

sand rapids Apr 10, 2023, 7:19 PM

#

Yeah there is no real reason to tokenize card number without expiry

#

So you can't do those separately

#

CVC is separate since CVC can't be stored, so CVC re-collection comes into play

river spoke Apr 10, 2023, 7:20 PM

#

gotcha

#

will createTokenForCVCUpdate ever be needed when dealing with google/apple pay?

sand rapids Apr 10, 2023, 7:20 PM

#

It works the same with Google/Apple Pay really.

#

Google/Apple Pay just gives you a PaymentMethod object

#

Just like Card Field and createPaymentMethod will

#

So you can use createTokenForCVCUpdate with a wallet-generated PM if you want

river spoke Apr 10, 2023, 7:21 PM

#

got it

#

ok great

#

well thanks for your help once again!

sand rapids Apr 10, 2023, 7:21 PM

#

Sure thing!

river spoke Apr 10, 2023, 7:21 PM

#

greatly appreciated

#

enjoy the rest of your day

#george-paymentintent-paymentmethod