mkharibalaji / react-native-adyen-payment

React Native Adyen Payment
https://mkharibalaji.github.io/react-native-adyen-payment/
MIT License
35 stars 35 forks source link

Question: support for tokenization? #17

Open m3co-code opened 4 years ago

m3co-code commented 4 years ago

Hi! First of all thanks for your work in building this library!

We're just in the first steps of integrating adyen and have a working version for the web so far. We wanted to integrate this now also in our apps, but I'm not sure whether this library supports tokenization of cards in order to be used at a later point.

In specific, we're tokenizing the cards in our server with the following config in the /payments call towards Adyen:


{
    amount: { currency: "EUR", value: 0 },
    paymentMethod: paymentMethod, // this contains the encrypted payment method data from the FE
    reference: "tokenize-" + Date.now(),
    recurringProcessingModel: "UnscheduledCardOnFile",
    storePaymentMethod: true,
    shopperReference: accountId,
    merchantAccount: merchantAccount,
    returnUrl: "https://dummy.url", // Dummy URL. Needs to be adapted for the app (see JSDoc of the property).
}

The above call is exposed from our server on a custom POST /api/methods/tokenize endpoint and called in the onSubmit handler of the web adyen drop in.

Is it possible to realize the tokenization with this library? Sorry if my question is off. Please just let me know if this is the case. As said I'm pretty new and just getting into the whole topic. Thanks big times :teddy_bear:

mkharibalaji commented 4 years ago

@marco-jantke Will defenitely have a look into it.

ChielBruin commented 3 years ago

Short answer: Yes it is possible (at least on Android, will try for iOS next week)

In order to enable it you have to add the property showStorePaymentField to the component data:

var componentData = {
    scheme: {
       card_public_key : CARD_PUBLIC_KEY,
       showStorePaymentField: true,
    },
    bcmc: {
       card_public_key : CARD_PUBLIC_KEY,
       showStorePaymentField: true,
    }
}

I did not find this anywhere in the documentation, so it is probably a good idea to add this somewhere (as I won't expect anyone to go through the source code of this wrapper to figure it out).

ChielBruin commented 3 years ago

I checked on iOS and it seems not to work using the same solution as shown above for Android. Seems like I have to dive into the implementation to figure out the correct call in the coming days.

ChielBruin commented 3 years ago

I found the issue on iOS. It turns out that the properties have different names on Android and iOS. On Android it is called showStorePaymentField and on iOS it is called showsStorePaymentMethodField (note the extra 's' after show).

TLDR of the messages above: Yes, tokenization is supported on both iOS and Android. In order to enable it you have to pass two properties to the componentData:

const componentData = {
    scheme: {
       card_public_key : CARD_PUBLIC_KEY,
       showStorePaymentField: true,   // For Android
       showsStorePaymentMethodField: true, // For iOS
    },
    bcmc: {
       card_public_key : CARD_PUBLIC_KEY,
       showStorePaymentField: true,   // For Android
       showsStorePaymentMethodField: true, // For iOS
    }
}
m3co-code commented 3 years ago

Thanks a lot for digging into this. Very appreciated!

On Tue, Mar 16, 2021, 3:31 PM Chiel Bruin @.***> wrote:

I found the issue on iOS. It turns out that the properties have different names on Android and iOS. On Android it is called showStorePaymentField and on iOS it is called showsStorePaymentMethodField (note the extra 's' after show).

TLDR of the messages above: Yes, tokenization is supported on both iOS and Android. In order to enable it you have to pass two properties to the componentData:

const componentData = { scheme: { card_public_key : CARD_PUBLIC_KEY, showStorePaymentField: true, // For Android showsStorePaymentMethodField: true, // For iOS }, bcmc: { card_public_key : CARD_PUBLIC_KEY, showStorePaymentField: true, // For Android showsStorePaymentMethodField: true, // For iOS }}

— You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub https://github.com/mkharibalaji/react-native-adyen-payment/issues/17#issuecomment-800308547, or unsubscribe https://github.com/notifications/unsubscribe-auth/ABFNCTJ62E6RZXEPSWW3SHTTD5TSRANCNFSM4N2K2WKA .