From 9a9bbe493f5b706552399f0e7c17566c8bb36b84 Mon Sep 17 00:00:00 2001 From: Patrick <102798810+patrick-hoban-cko@users.noreply.github.com> Date: Wed, 25 Oct 2023 17:23:24 +0100 Subject: [PATCH] CVV update for README.md (#252) * Update README.md Draft updates for CVV tokenisation * PIMOB:2173: Updating Readme file * Final tweaks for CVV tokenisation --------- Co-authored-by: Chintan Soni --- README.md | 76 +++++++++++++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 76 insertions(+) diff --git a/README.md b/README.md index 003bac8f..ddd13791 100644 --- a/README.md +++ b/README.md @@ -34,6 +34,8 @@ Frames for Android tokenises consumer data for use within [Checkout.com](https:/ - [Other features](#Other-features): _How we help with Google Pay & 3D Secure Challenges_ +- [Make a hosted CVV payment](#Make-a-payment-with-a-hosted-CVV): _Make a compliant saved card payment with hosted CVV tokenisation_ + - [Migrating](#Migrating): _If you have used 3.x.x version before_ - [License](#License) @@ -306,6 +308,80 @@ val request = GooglePayTokenRequest( checkoutApiClient.createToken(request) ``` +## Make a payment with a hosted CVV +Use our CVV component to make a compliant saved card payment in regions where sending a CVV is always mandatory. + +Within this flow, we will securely tokenise the CVV and return a CVV token to your application layer, which you can then use to continue the payment flow with. + +### Step 1: Create the CVVComponentApi + +```kotlin +// Create one time cvvComponentApi +val cvvComponentApi = CVVComponentApiFactory.create( + publicKey = "PUBLIC_KEY", // set your public key + environment = Environment.SANDBOX, // set the environment + context = context // set context +) +``` + +### Step 2: Create the CVVComponentMediator using CVVComponentConfig + +Prepare the object responsible for the CVV component configuration. + +Here you should inject the card scheme in order for the SDK to validate the length of the CVV using `isEnteredCVVValid`. If you don't pass a scheme, we will treat it as `UNKNOWN`. Within `CVVComponentConfig`, you can also configure the `cvvComponentStyle`, which has all the styling attributes of our existing UIs. + +If the CVV is length 0, the SDK will throw a validation error when calling `createToken`. + +```kotlin +val cvvComponentConfig = CVVComponentConfig( + cardScheme = CardScheme.fromString(cardSchemeValue = "your card scheme"), // set your card scheme (optional) + onCVVValueChange = { isEnteredCVVValid -> // update your listener from the onCVVValueChange + enteredVisaCVVUpdated.value = isEnteredCVVValid + }, + cvvInputFieldStyle = inputFieldStyle, // set your cvvInputFieldStyle +) +``` + +Once you've prepared the CVV component's config, then use the CVVComponentMediator. +```kotlin +val cvvComponentMediator = cvvComponentApi.createComponentMediator(cvvComponentConfig) +``` + +### Step 3: Load the CVV component + +For Compose based UIs: + +```kotlin +cvvComponentMediator.CVVComponent() +``` + +For XML-based UIs: + +```kotlin +// Access the LinearLayout by its Resource ID +val linearLayout = findViewById(R.id.linearLayout) +// Get the cvvComponentView +val cvvComponentView = cvvComponentMediator.provideCvvComponentContent(linearLayout) +// Add the cvvComponentView into parent Layout +linearLayout.addView(cvvComponentView) +``` + +#### Step 4: Create a CVV token +```kotlin + cvvComponentMediator.createToken { result -> + when (result) { + is CVVTokenizationResultHandler.Success -> { + /* Handle success result */ result.tokenDetails + } + is CVVTokenizationResultHandler.Failure -> { + /* Handle failure result */ result.errorMessage + } + } +} +``` + +You can then continue the payment flow with this `token` by passing into a field name as `cvv` in the payment request. + ## Migrating 3DS and GooglePay processing remain unaffected so using them should still work the same.