Tipsi-stripe: Missing tokenId from stripe.paymentRequestWithCardForm() response

[jamesl1001]

Before I have submitted the issue

[x] I have read an installation guide
[x] I know that for an iOS I need to install pods because I've read the installation guide
[x] I have read a linking guide and checked that everything is OK like in manual linking guide
[x] I know that before using tipsi-stripe I need to set options for my app as described in usage guide

The problem

stripe.paymentRequestWithCardForm() is no longer returning tokenId

It returns the following:

billingDetails: {...}
card: {...}
created: 1575564470
customerId: null
id: "pm_..."
livemode: false
type: "card"

tokenId returns correctly if I hardcode the card details using stripe.createTokenWithCard({number: '4242424242424242', expMonth: 11, expYear: 27, cvc: '223'})

I would ideally prefer to use the prebuilt component since it handles validation etc.

Code To Reproduce Issue (Good To Have)

stripe.paymentRequestWithCardForm()
    .then(res => {
        console.log(res.tokenId) <=== undefined
    })
    .catch(error => {
        console.log(error)
    })

Environment

• tipsi-stripe version: 8.0.0-beta.7
• Last tipsi-stripe version where the issue was not reproduced (if applicable): Can't reproduce even when rolling back to stable npm version
• iOS or Android: Android
• OS version: 9
• React-Native version: 0.61.2
• (Android only) com.google.firebase:firebase-core version: N/A
• (Android only) com.google.android.gms:play-services-base version:

Links to logs and sources

For Android, please provide the following sections from android/app/build.gradle:

• android.compileSdkVersion 28
• android.buildToolsVersion 28.0.3
• android.defaultConfig.minSdkVersion 19
• android.defaultConfig.targetSdkVersion 28
• android.defaultConfig.multiDexEnabled (if exists) Y

[jamesl1001]

FIXED

paymentRequestWithCardForm() now returns the payment method token (response.id) rather than the card token (response.tokenId) so there is now no need to pass the card token to createPaymentMethod() in order to retrieve the payment method token.

[rohitkum28]

@jamesl1001 Can you give more details? Even I am facing the same issue.

[jamesl1001]

In our code we just call stripe.paymentRequestWithCardForm() as a promise and the response contains the payment method token in the id field. We then pass that along with the amount to the backend to process the payment. For example:

stripe.paymentRequestWithCardForm({
    // options
})
    .then(res => {
        console.log(res.id) // here is the payment method token
    }
    .catch(err => {
        // handle errors
    }

[chetanCyquent]

Hi
I am struggling with same in v8.0.0-beta.10 for getting token.
But i am receiving payment method id.
e.g
looking for "tok_XXXX" but getting "pm_XXXX"

And Backend(PHP) is looking for "tok_XX" to complete the payment, so payment is failing at backend.

Please guide me for same to get it worked.

Thanks.

[rhodydan]

So, here is the deal. With beta10, there is no more card tokens on payment. It has been re-written to handle the payment flow to use payment method and PaymentIntents. There is a nice flow diagram in stripe's documents that outlines this without the additional 3ds authentication.

https://stripe.com/img/docs/payments/cards/finalize-on-server-no-auth-web.png

[rohitkum28]

For anyone still facing this issue, I have written a blog on complete Payment Intent API integration with tipsi-stripe 8.0.0-beta.10. You can follow that to get more clarity.

[prox2]

@rohitkum28 my friend you saved me with your blog, i have been struggling a lot as there is not updated straightforward integration. thank you alot :)

[Deepaky802]

I was facing the same issue, here are the steps I fixed with.

In android/app/build.gradle paste these

implementation 'com.google.android.gms:play-services-wallet:18.1.2'
implementation 'com.android.support:appcompat-v7:24.1.1'

In AndroidManifest paste this
<meta-data android:name="com.google.android.gms.wallet.api.enabled" android:value="true" />
inside application tag

And in your code where you're calling payment API put setOptions inside the constructor

Hope this will fix :)