{"title":"Card Component v4.x.x integration","category":"default","creationDate":1567783140,"content":"<p>This page explains how to add cards to your existing Android Components integration.<\/p>\n<p>Our <a href=\"\/pt\/online-payments\/build-your-integration\/sessions-flow?platform=Android&amp;integration=Components\">Card Component<\/a> renders the available cards in your payment form, and securely collects sensitive card information, so it doesn't touch your server.<\/p>\n<h2>Requirements<\/h2>\n<table>\n<thead>\n<tr>\n<th style=\"text-align: left;\">Requirement<\/th>\n<th style=\"text-align: left;\">Description<\/th>\n<\/tr>\n<\/thead>\n<tbody>\n<tr>\n<td style=\"text-align: left;\"><strong>Integration type<\/strong><\/td>\n<td style=\"text-align: left;\">Make sure that you have built an Advanced flow <a href=\"\/pt\/online-payments\/build-your-integration\/advanced-flow\/?platform=Android&amp;integration=Components\">Android Components integration<\/a>. <\/td>\n<\/tr>\n<tr>\n<td style=\"text-align: left;\"><strong>Setup steps<\/strong><\/td>\n<td style=\"text-align: left;\">Before you begin: <ul><li markdown=\"1\"><a href=\"\/pt\/payment-methods\/add-payment-methods\">Aadd the cards that you want to accept in your Customer Area<\/a>.<\/li> <li><a href=\"#get-client-key\">Get your client key<\/a>.<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<h3 id=\"get-client-key\">Get your client key<\/h3>\n<ol>\n<li>Log in to your <a href=\"https:\/\/ca-test.adyen.com\/\" target=\"_blank\" rel=\"nofollow noopener noreferrer\" class=\"external-link no-image\">Customer Area<\/a>.<\/li>\n<li>Go to <strong>Developers<\/strong> &gt; <strong>API credentials<\/strong>, and select the credential username for your integration, for example <strong>ws@Company.[YourCompanyAccount]<\/strong>.<\/li>\n<li>Under <strong>Client settings<\/strong> &gt; <strong>Authentication<\/strong> select the <strong>Client key<\/strong> tab.<\/li>\n<li>Select <strong>Generate client key<\/strong>.<\/li>\n<li>Select the copy icon <i class=\"adl-icon-copy\"><\/i> and store your client key securely in your system.<\/li>\n<li>Under <strong>Add allowed origins<\/strong>, enter your <a href=\"\/pt\/development-resources\/client-side-authentication#allowed-origins\">domains<\/a> and select <strong>Add<\/strong>.<\/li>\n<li>Select <strong>Save changes<\/strong>.<\/li>\n<\/ol>\n<h2>Show the available cards in your payment form<\/h2>\n<div class=\"additional-info-block output-inline\">\n<div class=\"additional-info-block__body\"><p>For information about the supported locations and currencies for each card, refer to <a href=\"https:\/\/www.adyen.com\/payment-methods\" target=\"_blank\" rel=\"nofollow noopener noreferrer\" class=\"external-link no-image\">Payment methods<\/a>.<\/p><\/div><\/div>\n\n<p>To show the Card Component in your payment form, you need to:<\/p>\n<ol>\n<li>\n<p>Specify in your  <a href=\"https:\/\/docs.adyen.com\/api-explorer\/Checkout\/latest\/post\/paymentMethods\" class=\"codeLabel  external-link no-image\" target=\"_blank\" rel=\"nofollow noopener noreferrer\">\/paymentMethods<\/a> request a combination of  <a href=\"https:\/\/docs.adyen.com\/api-explorer\/Checkout\/latest\/post\/paymentMethods\" class=\"codeLabel  external-link no-image\" target=\"_blank\" rel=\"nofollow noopener noreferrer\">countryCode<\/a> and  <a href=\"https:\/\/docs.adyen.com\/api-explorer\/Checkout\/latest\/post\/paymentMethods#request-amount\" class=\"codeLabel  external-link no-image\" target=\"_blank\" rel=\"nofollow noopener noreferrer\">amount.currency<\/a>. This is used to determine which cards are available to the shopper.<\/p>\n<\/li>\n<li>\n<p>Deserialize the  <a href=\"https:\/\/docs.adyen.com\/api-explorer\/Checkout\/latest\/post\/paymentMethods\" class=\"codeLabel  external-link no-image\" target=\"_blank\" rel=\"nofollow noopener noreferrer\">\/paymentMethods<\/a> response, and get the object with <code>type<\/code>: <span translate=\"no\"><strong>scheme<\/strong><\/span>.<br \/>\nFor showing stored cards, get the object with <code>type<\/code>: <span translate=\"no\"><strong>storedPaymentMethods<\/strong><\/span>.<\/p>\n<\/li>\n<li>\n<p>Add the Card Component:<\/p>\n<p>a. Import the Card Component to your <code>build.gradle<\/code> file.<\/p>\n<pre><code class=\"language-groovy\">  implementation \"com.adyen.checkout:card:&lt;latest-version&gt;\"<\/code><\/pre>\n<p>For the latest version, refer to our <a href=\"https:\/\/github.com\/Adyen\/adyen-android\" target=\"_blank\" rel=\"nofollow noopener noreferrer\" class=\"external-link no-image\">GitHub<\/a>.<\/p>\n<p>b. <a id=\"create-card-configuration\"><\/a>Create a <code>cardConfiguration<\/code> object, and pass your client key. You can also include <a href=\"#optional-configuration\">optional configuration<\/a>, for example to make the cardholder name required.<\/p>\n<pre><code class=\"language-kotlin\"> val cardConfiguration = CardConfiguration.Builder(context, \"YOUR_CLIENT_KEY\")\n      \/\/ Makes the cardholder name required\n      .setHolderNameRequired(true)\n      \/\/ When you are ready to accept live payments, change the value to one of our live environments.\n      .setEnvironment(Environment.TEST)\n      .build()<\/code><\/pre>\n<p>c.  <a id=\"initialize-component\"><\/a> Initialize the Card Component. Pass the object from the  <a href=\"https:\/\/docs.adyen.com\/api-explorer\/Checkout\/latest\/post\/paymentMethods\" class=\"codeLabel  external-link no-image\" target=\"_blank\" rel=\"nofollow noopener noreferrer\">\/paymentMethods<\/a> response and the <code>cardConfiguration<\/code> object.<\/p>\n<pre><code class=\"language-kotlin\">   val cardComponent = CardComponent.PROVIDER.get(this@YourActivity, paymentMethod, cardConfiguration)<\/code><\/pre>\n<p>d. Add the Card Component view to your layout.<\/p>\n<pre><code class=\"language-xml\">   &lt;com.adyen.checkout.Card.CardView\n          android:id=\"@+id\/cardView\"\n          android:layout_width=\"wrap_content\"\n          android:layout_height=\"wrap_content\"\/&gt;<\/code><\/pre>\n<p>e. Attach the Component to the view to start getting your shopper's payment details.<\/p>\n<pre><code class=\"language-kotlin\">   cardView.attach(cardComponent, this@YourActivity)<\/code><\/pre>\n<p>f. When shoppers enter their payment details, you start receiving updates. If <code>isValid<\/code> is true and the shopper proceeds to pay, pass the <code>paymentComponentState.data<\/code> to your server and <a href=\"#make-a-payment\">make a payment request<\/a>.<\/p>\n<pre><code class=\"language-kotlin\"> cardComponent.observe(this) { paymentComponentState -&gt;\n    if (paymentComponentState?.isValid == true) {\n       \/\/ When the shopper proceeds to pay, pass the `paymentComponentState.data` to your server to send a \/payments request\n       sendPayment(paymentComponentState.data)\n    }\n }<\/code><\/pre>\n<!-- list separator -->\n<\/li>\n<\/ol>\n<h3>Optional configuration<\/h3>\n<p>When you create the <a href=\"https:\/\/adyen.github.io\/adyen-android\/card\/com.adyen.checkout.card\/-card-configuration\/index.html\" target=\"_blank\" rel=\"nofollow noopener noreferrer\" class=\"external-link no-image\">\n  <code>CardConfiguration<\/code>\n<\/a> object, you can optionally add configuration parameters.<\/p>\n<h4>Address field configuration<\/h4>\n<p>Configure the postal code field in <code>AddressConfiguration.PostalCode<\/code>.<\/p>\n<p>Include the following parameter:<\/p>\n<table>\n<thead>\n<tr>\n<th>Parameter<\/th>\n<th>Description<\/th>\n<th>Default value<\/th>\n<\/tr>\n<\/thead>\n<tbody>\n<tr>\n<td><code>addressFieldPolicy<\/code><\/td>\n<td>Set if shoppers are required to fill in the fields. <br> Possible values: <br> - <strong>Required<\/strong> <br> - <strong>Optional<\/strong> <br> - <strong>OptionalForCardTypes<\/strong>: include the <code>brand<\/code> parameter, which is a list of values of type <code>String<\/code> to specify which brands input is optional for.<\/td>\n<td><strong>Required<\/strong><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<div data-component-wrapper=\"code-sample\">\n    <code-sample :title=\"'Address field settings'\" :id=\"''\" :code-data='[{\"language\":\"kotlin\",\"tabTitle\":\"\",\"content\":\"\\\/\\\/ Create a configuration object for the postal code field.\\nval addressConfiguration = AddressConfiguration.PostalCode(\\n    \\\/\\\/ Set it as optional for specific brands.\\n    addressFieldPolicy = AddressConfiguration.AddressFieldPolicy.OptionalForCardTypes(\\n       \\\/\\\/ Provide a list of strings to specify the brands.\\n       brands = listOf(\\\"jcb\\\", \\\"cup\\\")))\\n\\n\\\/\\\/ Set address configuration in card configuration object\\nval cardConfiguration = CardConfiguration.Builder(context, \\\"YOUR_CLIENT_KEY\\\")\\n    .setAddressConfiguration(addressConfiguration)\"}]' :enable-copy-link-to-code-block=\"true\" :code-sample-card-size=\"'fullsize'\"><\/code-sample>\n<\/div>\n<h2 id=\"make-a-payment\">Make a payment<\/h2>\n<p>When the shopper proceeds to pay, the Component returns the <code>paymentComponentState.data.paymentMethod<\/code>.<\/p>\n<ol>\n<li>Pass the <code>paymentComponentState.data<\/code> to your server.<\/li>\n<li>\n<p>From your server, make a  <a href=\"https:\/\/docs.adyen.com\/api-explorer\/Checkout\/latest\/post\/payments\" class=\"codeLabel  external-link no-image\" target=\"_blank\" rel=\"nofollow noopener noreferrer\">\/payments<\/a> request, specifying:<\/p>\n<ul>\n<li><code>paymentMethod<\/code>: The <code>paymentComponentState.data.paymentMethod<\/code> from your client app.<\/li>\n<\/ul>\n<\/li>\n<\/ol>\n<div data-component-wrapper=\"code-sample\">\n    <code-sample :title=\"''\" :id=\"'card-payment'\" :code-data=\"[{&quot;language&quot;:&quot;bash&quot;,&quot;tabTitle&quot;:&quot;curl&quot;,&quot;content&quot;:&quot;curl https:\\\/\\\/checkout-test.adyen.com\\\/v68\\\/payments \\\\\\n-H 'x-api-key: ADYEN_API_KEY' \\\\\\n-H 'content-type: application\\\/json' \\\\\\n-d '{\\n \\&quot;amount\\&quot;: {\\n   \\&quot;currency\\&quot;: \\&quot;USD\\&quot;,\\n   \\&quot;value\\&quot;: 1000\\n },\\n \\&quot;reference\\&quot;: \\&quot;YOUR_ORDER_NUMBER\\&quot;,\\n \\&quot;{hint:paymentComponentState.data.paymentMethod from app}paymentMethod{\\\/hint}\\&quot;: {\\n   \\&quot;type\\&quot;: \\&quot;scheme\\&quot;,\\n   \\&quot;encryptedCardNumber\\&quot;: \\&quot;adyenjs_0_1_18$MT6ppy0FAMVMLH...\\&quot;,\\n   \\&quot;encryptedExpiryMonth\\&quot;: \\&quot;adyenjs_0_1_18$MT6ppy0FAMVMLH...\\&quot;,\\n   \\&quot;encryptedExpiryYear\\&quot;: \\&quot;adyenjs_0_1_18$MT6ppy0FAMVMLH...\\&quot;,\\n   \\&quot;encryptedSecurityCode\\&quot;: \\&quot;adyenjs_0_1_18$MT6ppy0FAMVMLH...\\&quot;,\\n   \\&quot;holderName\\&quot;: \\&quot;S. Hopper\\&quot;\\n },\\n \\&quot;returnUrl\\&quot;: \\&quot;adyencheckout:\\\/\\\/your.package.name\\&quot;,\\n \\&quot;merchantAccount\\&quot;: \\&quot;ADYEN_MERCHANT_ACCOUNT\\&quot;\\n}'&quot;},{&quot;language&quot;:&quot;java&quot;,&quot;tabTitle&quot;:&quot;Java&quot;,&quot;content&quot;:&quot;\\\/\\\/ Adyen Java API Library v27.0.0\\nimport com.adyen.Client;\\nimport com.adyen.enums.Environment;\\nimport com.adyen.model.checkout.*;\\nimport java.time.OffsetDateTime;\\nimport java.util.*;\\nimport com.adyen.model.RequestOptions;\\nimport com.adyen.service.checkout.*;\\n\\n\\\/\\\/ For the live environment, additionally include your liveEndpointUrlPrefix.\\nClient client = new Client(\\&quot;ADYEN_API_KEY\\&quot;, Environment.TEST);\\n\\n\\\/\\\/ Create the request object(s)\\nAmount amount = new Amount()\\n  .currency(\\&quot;USD\\&quot;)\\n  .value(1000L);\\n\\nCardDetails cardDetails = new CardDetails()\\n  .encryptedCardNumber(\\&quot;adyenjs_0_1_18$MT6ppy0FAMVMLH...\\&quot;)\\n  .holderName(\\&quot;S. Hopper\\&quot;)\\n  .encryptedSecurityCode(\\&quot;adyenjs_0_1_18$MT6ppy0FAMVMLH...\\&quot;)\\n  .encryptedExpiryYear(\\&quot;adyenjs_0_1_18$MT6ppy0FAMVMLH...\\&quot;)\\n  .encryptedExpiryMonth(\\&quot;adyenjs_0_1_18$MT6ppy0FAMVMLH...\\&quot;)\\n  .type(CardDetails.TypeEnum.SCHEME);\\n\\nPaymentRequest paymentRequest = new PaymentRequest()\\n  .reference(\\&quot;YOUR_ORDER_NUMBER\\&quot;)\\n  .amount(amount)\\n  .merchantAccount(\\&quot;ADYEN_MERCHANT_ACCOUNT\\&quot;)\\n  .paymentMethod(new CheckoutPaymentMethod(cardDetails))\\n  .returnUrl(\\&quot;adyencheckout:\\\/\\\/your.package.name\\&quot;);\\n\\n\\\/\\\/ Send the request\\nPaymentsApi service = new PaymentsApi(client);\\nPaymentResponse response = service.payments(paymentRequest, new RequestOptions().idempotencyKey(\\&quot;UUID\\&quot;));&quot;},{&quot;language&quot;:&quot;php&quot;,&quot;tabTitle&quot;:&quot;PHP&quot;,&quot;content&quot;:&quot;\\\/\\\/ Adyen PHP API Library v19.0.0\\nuse Adyen\\\\Client;\\nuse Adyen\\\\Environment;\\nuse Adyen\\\\Model\\\\Checkout\\\\Amount;\\nuse Adyen\\\\Model\\\\Checkout\\\\CheckoutPaymentMethod;\\nuse Adyen\\\\Model\\\\Checkout\\\\PaymentRequest;\\nuse Adyen\\\\Service\\\\Checkout\\\\PaymentsApi;\\n\\n$client = new Client();\\n$client-&gt;setXApiKey(\\&quot;ADYEN_API_KEY\\&quot;);\\n\\\/\\\/ For the live environment, additionally include your liveEndpointUrlPrefix.\\n$client-&gt;setEnvironment(Environment::TEST);\\n\\n\\n\\\/\\\/ Create the request object(s)\\n$amount = new Amount();\\n$amount\\n  -&gt;setCurrency(\\&quot;USD\\&quot;)\\n  -&gt;setValue(1000);\\n\\n$checkoutPaymentMethod = new CheckoutPaymentMethod();\\n$checkoutPaymentMethod\\n  -&gt;setEncryptedCardNumber(\\&quot;adyenjs_0_1_18\\\\$MT6ppy0FAMVMLH...\\&quot;)\\n  -&gt;setHolderName(\\&quot;S. Hopper\\&quot;)\\n  -&gt;setEncryptedSecurityCode(\\&quot;adyenjs_0_1_18\\\\$MT6ppy0FAMVMLH...\\&quot;)\\n  -&gt;setEncryptedExpiryYear(\\&quot;adyenjs_0_1_18\\\\$MT6ppy0FAMVMLH...\\&quot;)\\n  -&gt;setEncryptedExpiryMonth(\\&quot;adyenjs_0_1_18\\\\$MT6ppy0FAMVMLH...\\&quot;)\\n  -&gt;setType(\\&quot;scheme\\&quot;);\\n\\n$paymentRequest = new PaymentRequest();\\n$paymentRequest\\n  -&gt;setReference(\\&quot;YOUR_ORDER_NUMBER\\&quot;)\\n  -&gt;setAmount($amount)\\n  -&gt;setMerchantAccount(\\&quot;ADYEN_MERCHANT_ACCOUNT\\&quot;)\\n  -&gt;setPaymentMethod($checkoutPaymentMethod)\\n  -&gt;setReturnUrl(\\&quot;adyencheckout:\\\/\\\/your.package.name\\&quot;);\\n\\n$requestOptions['idempotencyKey'] = 'UUID';\\n\\n\\\/\\\/ Send the request\\n$service = new PaymentsApi($client);\\n$response = $service-&gt;payments($paymentRequest, $requestOptions);&quot;},{&quot;language&quot;:&quot;cs&quot;,&quot;tabTitle&quot;:&quot;C#&quot;,&quot;content&quot;:&quot;\\\/\\\/ Adyen .net API Library v17.0.0\\nusing Adyen;\\nusing Environment = Adyen.Model.Environment;\\nusing Adyen.Model;\\nusing Adyen.Model.Checkout;\\nusing Adyen.Service.Checkout;\\n\\n\\\/\\\/ For the live environment, additionally include your liveEndpointUrlPrefix.\\nvar config = new Config()\\n{\\n    XApiKey = \\&quot;ADYEN_API_KEY\\&quot;,\\n    Environment = Environment.Test\\n};\\nvar client = new Client(config);\\n\\n\\\/\\\/ Create the request object(s)\\nAmount amount = new Amount\\n{\\n  Currency = \\&quot;USD\\&quot;,\\n  Value = 1000\\n};\\n\\nCardDetails cardDetails = new CardDetails\\n{\\n  EncryptedCardNumber = \\&quot;adyenjs_0_1_18$MT6ppy0FAMVMLH...\\&quot;,\\n  HolderName = \\&quot;S. Hopper\\&quot;,\\n  EncryptedSecurityCode = \\&quot;adyenjs_0_1_18$MT6ppy0FAMVMLH...\\&quot;,\\n  EncryptedExpiryYear = \\&quot;adyenjs_0_1_18$MT6ppy0FAMVMLH...\\&quot;,\\n  EncryptedExpiryMonth = \\&quot;adyenjs_0_1_18$MT6ppy0FAMVMLH...\\&quot;,\\n  Type = CardDetails.TypeEnum.Scheme\\n};\\n\\nPaymentRequest paymentRequest = new PaymentRequest\\n{\\n  Reference = \\&quot;YOUR_ORDER_NUMBER\\&quot;,\\n  Amount = amount,\\n  MerchantAccount = \\&quot;ADYEN_MERCHANT_ACCOUNT\\&quot;,\\n  PaymentMethod = new CheckoutPaymentMethod(cardDetails),\\n  ReturnUrl = \\&quot;adyencheckout:\\\/\\\/your.package.name\\&quot;\\n};\\n\\n\\\/\\\/ Send the request\\nvar service = new PaymentsService(client);\\nvar response = service.Payments(paymentRequest, requestOptions: new RequestOptions { IdempotencyKey = \\&quot;UUID\\&quot;});&quot;},{&quot;language&quot;:&quot;js&quot;,&quot;tabTitle&quot;:&quot;NodeJS (JavaScript)&quot;,&quot;content&quot;:&quot;\\\/\\\/ Adyen Node API Library v18.0.0\\n\\\/\\\/ Require the parts of the module you want to use\\nconst { Client, CheckoutAPI } = require('@adyen\\\/api-library');\\n\\\/\\\/ Initialize the client object\\n\\\/\\\/ For the live environment, additionally include your liveEndpointUrlPrefix.\\nconst client = new Client({apiKey: \\&quot;ADYEN_API_KEY\\&quot;, environment: \\&quot;TEST\\&quot;});\\n\\n\\\/\\\/ Create the request object(s)\\nconst paymentRequest = {\\n  amount: {\\n    currency: \\&quot;USD\\&quot;,\\n    value: 1000\\n  },\\n  reference: \\&quot;YOUR_ORDER_NUMBER\\&quot;,\\n  paymentMethod: {\\n    type: \\&quot;scheme\\&quot;,\\n    encryptedCardNumber: \\&quot;adyenjs_0_1_18$MT6ppy0FAMVMLH...\\&quot;,\\n    encryptedExpiryMonth: \\&quot;adyenjs_0_1_18$MT6ppy0FAMVMLH...\\&quot;,\\n    encryptedExpiryYear: \\&quot;adyenjs_0_1_18$MT6ppy0FAMVMLH...\\&quot;,\\n    encryptedSecurityCode: \\&quot;adyenjs_0_1_18$MT6ppy0FAMVMLH...\\&quot;,\\n    holderName: \\&quot;S. Hopper\\&quot;\\n  },\\n  returnUrl: \\&quot;adyencheckout:\\\/\\\/your.package.name\\&quot;,\\n  merchantAccount: \\&quot;ADYEN_MERCHANT_ACCOUNT\\&quot;\\n}\\n\\n\\\/\\\/ Send the request\\nconst checkoutAPI = new CheckoutAPI(client);\\nconst response = checkoutAPI.PaymentsApi.payments(paymentRequest, { idempotencyKey: \\&quot;UUID\\&quot; });&quot;},{&quot;language&quot;:&quot;go&quot;,&quot;tabTitle&quot;:&quot;Go&quot;,&quot;content&quot;:&quot;\\\/\\\/ Adyen Go API Library v10.4.0\\nimport (\\n  \\&quot;context\\&quot;\\n  \\&quot;github.com\\\/adyen\\\/adyen-go-api-library\\\/v9\\\/src\\\/common\\&quot;\\n  \\&quot;github.com\\\/adyen\\\/adyen-go-api-library\\\/v9\\\/src\\\/adyen\\&quot;\\n  \\&quot;github.com\\\/adyen\\\/adyen-go-api-library\\\/v9\\\/src\\\/checkout\\&quot;\\n)\\n\\\/\\\/ For the live environment, additionally include your liveEndpointUrlPrefix.\\nclient := adyen.NewClient(&amp;common.Config{\\n  ApiKey:      \\&quot;ADYEN_API_KEY\\&quot;,\\n  Environment: common.TestEnv,\\n})\\n\\n\\\/\\\/ Create the request object(s)\\namount := checkout.Amount{\\n  Currency: \\&quot;USD\\&quot;,\\n  Value: 1000,\\n}\\n\\ncardDetails := checkout.CardDetails{\\n  EncryptedCardNumber: common.PtrString(\\&quot;adyenjs_0_1_18$MT6ppy0FAMVMLH...\\&quot;),\\n  HolderName: common.PtrString(\\&quot;S. Hopper\\&quot;),\\n  EncryptedSecurityCode: common.PtrString(\\&quot;adyenjs_0_1_18$MT6ppy0FAMVMLH...\\&quot;),\\n  EncryptedExpiryYear: common.PtrString(\\&quot;adyenjs_0_1_18$MT6ppy0FAMVMLH...\\&quot;),\\n  EncryptedExpiryMonth: common.PtrString(\\&quot;adyenjs_0_1_18$MT6ppy0FAMVMLH...\\&quot;),\\n  Type: common.PtrString(\\&quot;scheme\\&quot;),\\n}\\n\\npaymentRequest := checkout.PaymentRequest{\\n  Reference: \\&quot;YOUR_ORDER_NUMBER\\&quot;,\\n  Amount: amount,\\n  MerchantAccount: \\&quot;ADYEN_MERCHANT_ACCOUNT\\&quot;,\\n  PaymentMethod: checkout.CardDetailsAsCheckoutPaymentMethod(&amp;cardDetails),\\n  ReturnUrl: \\&quot;adyencheckout:\\\/\\\/your.package.name\\&quot;,\\n}\\n\\n\\\/\\\/ Send the request\\nservice := client.Checkout()\\nreq := service.PaymentsApi.PaymentsInput().IdempotencyKey(\\&quot;UUID\\&quot;).PaymentRequest(paymentRequest)\\nres, httpRes, err := service.PaymentsApi.Payments(context.Background(), req)&quot;},{&quot;language&quot;:&quot;py&quot;,&quot;tabTitle&quot;:&quot;Python&quot;,&quot;content&quot;:&quot;# Adyen Python API Library v12.5.1\\nimport Adyen\\n\\nadyen = Adyen.Adyen()\\nadyen.client.xapikey = \\&quot;ADYEN_API_KEY\\&quot;\\n# For the live environment, additionally include your liveEndpointUrlPrefix.\\nadyen.client.platform = \\&quot;test\\&quot; # The environment to use library in.\\n\\n# Create the request object(s)\\njson_request = {\\n  \\&quot;amount\\&quot;: {\\n    \\&quot;currency\\&quot;: \\&quot;USD\\&quot;,\\n    \\&quot;value\\&quot;: 1000\\n  },\\n  \\&quot;reference\\&quot;: \\&quot;YOUR_ORDER_NUMBER\\&quot;,\\n  \\&quot;paymentMethod\\&quot;: {\\n    \\&quot;type\\&quot;: \\&quot;scheme\\&quot;,\\n    \\&quot;encryptedCardNumber\\&quot;: \\&quot;adyenjs_0_1_18$MT6ppy0FAMVMLH...\\&quot;,\\n    \\&quot;encryptedExpiryMonth\\&quot;: \\&quot;adyenjs_0_1_18$MT6ppy0FAMVMLH...\\&quot;,\\n    \\&quot;encryptedExpiryYear\\&quot;: \\&quot;adyenjs_0_1_18$MT6ppy0FAMVMLH...\\&quot;,\\n    \\&quot;encryptedSecurityCode\\&quot;: \\&quot;adyenjs_0_1_18$MT6ppy0FAMVMLH...\\&quot;,\\n    \\&quot;holderName\\&quot;: \\&quot;S. Hopper\\&quot;\\n  },\\n  \\&quot;returnUrl\\&quot;: \\&quot;adyencheckout:\\\/\\\/your.package.name\\&quot;,\\n  \\&quot;merchantAccount\\&quot;: \\&quot;ADYEN_MERCHANT_ACCOUNT\\&quot;\\n}\\n\\n# Send the request\\nresult = adyen.checkout.payments_api.payments(request=json_request, idempotency_key=\\&quot;UUID\\&quot;)&quot;},{&quot;language&quot;:&quot;rb&quot;,&quot;tabTitle&quot;:&quot;Ruby&quot;,&quot;content&quot;:&quot;# Adyen Ruby API Library v9.5.1\\nrequire \\&quot;adyen-ruby-api-library\\&quot;\\n\\nadyen = Adyen::Client.new\\nadyen.api_key = 'ADYEN_API_KEY'\\n# For the live environment, additionally include your liveEndpointUrlPrefix.\\nadyen.env = :test # Set to \\&quot;live\\&quot; for live environment\\n\\n# Create the request object(s)\\nrequest_body = {\\n  :amount =&gt; {\\n    :currency =&gt; 'USD',\\n    :value =&gt; 1000\\n  },\\n  :reference =&gt; 'YOUR_ORDER_NUMBER',\\n  :paymentMethod =&gt; {\\n    :type =&gt; 'scheme',\\n    :encryptedCardNumber =&gt; 'adyenjs_0_1_18$MT6ppy0FAMVMLH...',\\n    :encryptedExpiryMonth =&gt; 'adyenjs_0_1_18$MT6ppy0FAMVMLH...',\\n    :encryptedExpiryYear =&gt; 'adyenjs_0_1_18$MT6ppy0FAMVMLH...',\\n    :encryptedSecurityCode =&gt; 'adyenjs_0_1_18$MT6ppy0FAMVMLH...',\\n    :holderName =&gt; 'S. Hopper'\\n  },\\n  :returnUrl =&gt; 'adyencheckout:\\\/\\\/your.package.name',\\n  :merchantAccount =&gt; 'ADYEN_MERCHANT_ACCOUNT'\\n}\\n\\n# Send the request\\nresult = adyen.checkout.payments_api.payments(request_body, headers: { 'Idempotency-Key' =&gt; 'UUID' })&quot;},{&quot;language&quot;:&quot;ts&quot;,&quot;tabTitle&quot;:&quot;NodeJS (TypeScript)&quot;,&quot;content&quot;:&quot;\\\/\\\/ Adyen Node API Library v18.0.0\\n\\\/\\\/ Require the parts of the module you want to use\\nimport { Client, CheckoutAPI, Types } from \\&quot;@adyen\\\/api-library\\&quot;;\\n\\\/\\\/ Initialize the client object\\n\\\/\\\/ For the live environment, additionally include your liveEndpointUrlPrefix.\\nconst client = new Client({apiKey: \\&quot;ADYEN_API_KEY\\&quot;, environment: \\&quot;TEST\\&quot;});\\n\\n\\\/\\\/ Create the request object(s)\\nconst amount: Types.checkout.Amount = {\\n  currency: \\&quot;USD\\&quot;,\\n  value: 1000\\n};\\n\\nconst cardDetails: Types.checkout.CardDetails = {\\n  encryptedCardNumber: \\&quot;adyenjs_0_1_18$MT6ppy0FAMVMLH...\\&quot;,\\n  holderName: \\&quot;S. Hopper\\&quot;,\\n  encryptedSecurityCode: \\&quot;adyenjs_0_1_18$MT6ppy0FAMVMLH...\\&quot;,\\n  encryptedExpiryYear: \\&quot;adyenjs_0_1_18$MT6ppy0FAMVMLH...\\&quot;,\\n  encryptedExpiryMonth: \\&quot;adyenjs_0_1_18$MT6ppy0FAMVMLH...\\&quot;,\\n  type: Types.checkout.CardDetails.TypeEnum.Scheme\\n};\\n\\nconst paymentRequest: Types.checkout.PaymentRequest = {\\n  reference: \\&quot;YOUR_ORDER_NUMBER\\&quot;,\\n  amount: amount,\\n  merchantAccount: \\&quot;ADYEN_MERCHANT_ACCOUNT\\&quot;,\\n  paymentMethod: cardDetails,\\n  returnUrl: \\&quot;adyencheckout:\\\/\\\/your.package.name\\&quot;\\n};\\n\\n\\\/\\\/ Send the request\\nconst checkoutAPI = new CheckoutAPI(client);\\nconst response = checkoutAPI.PaymentsApi.payments(paymentRequest, { idempotencyKey: \\&quot;UUID\\&quot; });&quot;}]\" :enable-copy-link-to-code-block=\"true\" :code-sample-card-size=\"'fullsize'\"><\/code-sample>\n<\/div>\n<p>The  <a href=\"https:\/\/docs.adyen.com\/api-explorer\/Checkout\/latest\/post\/payments\" class=\"codeLabel  external-link no-image\" target=\"_blank\" rel=\"nofollow noopener noreferrer\">\/payments<\/a> response contains:<\/p>\n<ul>\n<li><a href=\"https:\/\/docs.adyen.com\/api-explorer\/#\/CheckoutService\/latest\/payments__resParam_pspReference\" class=\"codeLabel external-link no-image\" target=\"_blank\" rel=\"nofollow noopener noreferrer\">pspReference<\/a>: Our unique identifier for the transaction.<\/li>\n<li><code>resultCode<\/code>: Use this to <a href=\"#present-the-payment-result\">present the payment result to your shopper<\/a>.<\/li>\n<li><code>merchantReference<\/code>: The <code>reference<\/code> from the  <a href=\"https:\/\/docs.adyen.com\/api-explorer\/Checkout\/latest\/post\/payments\" class=\"codeLabel  external-link no-image\" target=\"_blank\" rel=\"nofollow noopener noreferrer\">\/payments<\/a> request.<\/li>\n<li><code>additionalData<\/code>: Additional information about the transaction.<br \/>\nTo specify the fields that you want to receive in <code>additionalData<\/code>, log in to your <a href=\"https:\/\/ca-test.adyen.com\/\" target=\"_blank\" rel=\"nofollow noopener noreferrer\" class=\"external-link no-image\">Customer Area<\/a>, and go to <strong>Developers<\/strong> &gt; <strong>Additional data<\/strong>.  <\/li>\n<\/ul>\n<div data-component-wrapper=\"code-sample\">\n    <code-sample :title=\"'\/payments response'\" :id=\"''\" :code-data='[{\"language\":\"json\",\"tabTitle\":\"\",\"content\":\"{\\n  \\\"additionalData\\\": {\\n    \\\"cardSummary\\\": \\\"1111\\\"\\n  },\\n  \\\"pspReference\\\": \\\"851572424333194G\\\",\\n  \\\"resultCode\\\": \\\"Authorised\\\",\\n  \\\"merchantReference\\\": \\\"YOUR_ORDER_NUMBER\\\"\\n}\"}]' :enable-copy-link-to-code-block=\"true\" :code-sample-card-size=\"'fullsize'\"><\/code-sample>\n<\/div>\n<h2 id=\"present-the-payment-result\">Present the payment result<\/h2>\n<p>Use the\u00a0 <a href=\"https:\/\/docs.adyen.com\/api-explorer\/Checkout\/latest\/post\/payments#responses-200-resultCode\" class=\"codeLabel  external-link no-image\" target=\"_blank\" rel=\"nofollow noopener noreferrer\">resultCode<\/a> from the  <a href=\"https:\/\/docs.adyen.com\/api-explorer\/Checkout\/latest\/post\/payments\" class=\"codeLabel  external-link no-image\" target=\"_blank\" rel=\"nofollow noopener noreferrer\">\/payments<\/a> response to present the payment result to your shopper. You will also receive the outcome of the payment asynchronously in a <a href=\"\/pt\/development-resources\/webhooks\">webhook<\/a>.<\/p>\n<p><\/p>\n<p>For card payments, you can receive the following <code>resultCode<\/code> values:<\/p>\n<table>\n<thead>\n<tr>\n<th>resultCode<\/th>\n<th>Description<\/th>\n<th>Action to take<\/th>\n<\/tr>\n<\/thead>\n<tbody>\n<tr>\n<td><strong>Authorised<\/strong><\/td>\n<td>The payment was successful.<\/td>\n<td>Inform the shopper that the payment has been successful. <br> If you are using <a href=\"\/pt\/online-payments\/capture#manual-capture\">manual capture<\/a>, you also need to <a href=\"\/pt\/online-payments\/capture\">capture<\/a> the payment.<\/td>\n<\/tr>\n<tr>\n<td><strong>Cancelled<\/strong><\/td>\n<td>The shopper cancelled the payment.<\/td>\n<td>Ask the shopper whether they want to continue with the order, or ask them to select a different payment method.<\/td>\n<\/tr>\n<tr>\n<td><strong>Error<\/strong><\/td>\n<td>There was an error when the payment was being processed. For more information, check the <a href=\"\/pt\/development-resources\/refusal-reasons\">\n  <code>refusalReason<\/code>\n<\/a> field.<\/td>\n<td>Inform the shopper that there was an error processing their payment.<\/td>\n<\/tr>\n<tr>\n<td><strong>Refused<\/strong><\/td>\n<td>The payment was refused.  For more information, check the <a href=\"\/pt\/development-resources\/refusal-reasons\">\n  <code>refusalReason<\/code>\n<\/a> field.<\/td>\n<td>Ask the shopper to try the payment again using a different payment method.<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<div class=\"notices green\">\n<p>Additional <code>resultCode<\/code> values are possible in case of the 3D Secure authentication flow. For more information, refer to <a href=\"\/pt\/online-payments\/build-your-integration\/payment-result-codes\/#3d-secure-authentication\">Result codes<\/a>.<\/p>\n<\/div>\n<h2 id=\"recurring-payments\">Recurring payments<\/h2>\n<p>Adyen's <a href=\"\/pt\/online-payments\/tokenization\">tokenization service<\/a> allows you to securely store shopper's card details for recurring payments. To make recurring payments, you first need to create a shopper token, and then use the token to make future payments for the shopper.<\/p>\n<h3>Create a token<\/h3>\n<p>When a shopper chooses to pay with card, the Card Component renders a switch for saving the card details for future payments. If a shopper selects this option, the <code>paymentComponentState<\/code> from the Component will include <code>data.storePaymentMethod<\/code>. Pass this to your server.<\/p>\n<p><\/p>\n<p>To create a token, include in your  <a href=\"https:\/\/docs.adyen.com\/api-explorer\/Checkout\/latest\/post\/payments\" class=\"codeLabel  external-link no-image\" target=\"_blank\" rel=\"nofollow noopener noreferrer\">\/payments<\/a> request:<\/p>\n<ul>\n<li><code>storePaymentMethod<\/code>: The <code>paymentComponentState.data.storePaymentMethod<\/code> from your client app.<\/li>\n<li> <a href=\"https:\/\/docs.adyen.com\/api-explorer\/Checkout\/latest\/post\/payments#request-shopperReference\" class=\"codeLabel  external-link no-image\" target=\"_blank\" rel=\"nofollow noopener noreferrer\">shopperReference<\/a>&#58; Your unique identifier for the shopper.<\/li>\n<\/ul>\n<p><\/p>\n<p>If you do not want to show the switch for saving card details, set <code>showStoredPaymentMethods<\/code> to <strong>false<\/strong> when <a href=\"#create-card-configuration\">creating the <code>cardConfiguration<\/code> object<\/a>:<\/p>\n<pre><code class=\"language-kotlin\">     val cardConfiguration = CardConfiguration.Builder(context, \"YOUR_CLIENT_KEY\")\n          \/\/ hides the switch for saving card details\n          .setShowStorePaymentField(false)\n          .build()<\/code><\/pre>\n<h3>Show a stored card in your payment form<\/h3>\n<p>When the shopper proceeds to pay, the Component returns the <code>paymentComponentState.data.paymentMethod<\/code>.<\/p>\n<ol>\n<li>Pass the <code>paymentComponentState.data.paymentMethod<\/code> to your server.<\/li>\n<li>\n<p>From your server, make a  <a href=\"https:\/\/docs.adyen.com\/api-explorer\/Checkout\/latest\/post\/payments\" class=\"codeLabel  external-link no-image\" target=\"_blank\" rel=\"nofollow noopener noreferrer\">\/payments<\/a> request, specifying:<\/p>\n<ul>\n<li><code>paymentMethod<\/code>: The <code>paymentComponentState.data.paymentMethod<\/code> from your client app.<\/li>\n<\/ul>\n<div data-component-wrapper=\"code-sample\">\n<code-sample :title=\"'Make a payment with a token'\" :id=\"'pay-contracts'\" :code-data=\"[{&quot;language&quot;:&quot;bash&quot;,&quot;tabTitle&quot;:&quot;curl&quot;,&quot;content&quot;:&quot;curl https:\\\/\\\/checkout-test.adyen.com\\\/checkout\\\/v72\\\/payments \\\\\\n-H 'x-api-key: ADYEN_API_KEY' \\\\\\n-H 'content-type: application\\\/json' \\\\\\n-d '{\\n   \\&quot;amount\\&quot;:{\\n      \\&quot;value\\&quot;:2000,\\n      \\&quot;currency\\&quot;:\\&quot;USD\\&quot;\\n   },\\n   \\&quot;paymentMethod\\&quot;:{\\n      \\&quot;type\\&quot;:\\&quot;scheme\\&quot;,\\n      \\&quot;{hint:Previously known as recurringDetailReference}storedPaymentMethodId{\\\/hint}\\&quot;:\\&quot;M5N7TQ4TG5PFWR50\\&quot;\\n   },\\n   \\&quot;reference\\&quot;:\\&quot;YOUR_ORDER_REFERENCE\\&quot;,\\n   \\&quot;shopperInteraction\\&quot;: \\&quot;ContAuth\\&quot;,\\n   \\&quot;recurringProcessingModel\\&quot;: \\&quot;UnscheduledCardOnFile\\&quot;,\\n   \\&quot;merchantAccount\\&quot;:\\&quot;YOUR_MERCHANT_ACCOUNT\\&quot;,\\n   \\&quot;shopperReference\\&quot;:\\&quot;YOUR_SHOPPER_REFERENCE\\&quot;\\n}'&quot;},{&quot;language&quot;:&quot;java&quot;,&quot;tabTitle&quot;:&quot;Java&quot;,&quot;content&quot;:&quot;\\\/\\\/ Adyen Java API Library v26.3.0\\nimport com.adyen.Client;\\nimport com.adyen.enums.Environment;\\nimport com.adyen.model.checkout.*;\\nimport java.time.OffsetDateTime;\\nimport java.util.*;\\nimport com.adyen.model.RequestOptions;\\nimport com.adyen.service.checkout.*;\\n\\n\\\/\\\/ For the live environment, additionally include your liveEndpointUrlPrefix.\\nClient client = new Client(\\&quot;ADYEN_API_KEY\\&quot;, Environment.TEST);\\n\\n\\\/\\\/ Create the request object(s)\\nAmount amount = new Amount()\\n  .currency(\\&quot;USD\\&quot;)\\n  .value(2000L);\\n\\nCardDetails cardDetails = new CardDetails()\\n  .storedPaymentMethodId(\\&quot;M5N7TQ4TG5PFWR50\\&quot;)\\n  .type(CardDetails.TypeEnum.SCHEME);\\n\\nPaymentRequest paymentRequest = new PaymentRequest()\\n  .reference(\\&quot;YOUR_ORDER_REFERENCE\\&quot;)\\n  .amount(amount)\\n  .merchantAccount(\\&quot;YOUR_MERCHANT_ACCOUNT\\&quot;)\\n  .recurringProcessingModel(PaymentRequest.RecurringProcessingModelEnum.UNSCHEDULEDCARDONFILE)\\n  .paymentMethod(new CheckoutPaymentMethod(cardDetails))\\n  .shopperInteraction(PaymentRequest.ShopperInteractionEnum.CONTAUTH)\\n  .shopperReference(\\&quot;YOUR_SHOPPER_REFERENCE\\&quot;);\\n\\n\\\/\\\/ Send the request\\nPaymentsApi service = new PaymentsApi(client);\\nPaymentResponse response = service.payments(paymentRequest, new RequestOptions().idempotencyKey(\\&quot;UUID\\&quot;));&quot;},{&quot;language&quot;:&quot;php&quot;,&quot;tabTitle&quot;:&quot;PHP&quot;,&quot;content&quot;:&quot;\\\/\\\/ Adyen PHP API Library v18.2.1\\nuse Adyen\\\\Client;\\nuse Adyen\\\\Environment;\\nuse Adyen\\\\Model\\\\Checkout\\\\Amount;\\nuse Adyen\\\\Model\\\\Checkout\\\\CheckoutPaymentMethod;\\nuse Adyen\\\\Model\\\\Checkout\\\\PaymentRequest;\\nuse Adyen\\\\Service\\\\Checkout\\\\PaymentsApi;\\n\\n$client = new Client();\\n$client-&gt;setXApiKey(\\&quot;ADYEN_API_KEY\\&quot;);\\n\\\/\\\/ For the live environment, additionally include your liveEndpointUrlPrefix.\\n$client-&gt;setEnvironment(Environment::TEST);\\n\\n\\n\\\/\\\/ Create the request object(s)\\n$amount = new Amount();\\n$amount\\n  -&gt;setCurrency(\\&quot;USD\\&quot;)\\n  -&gt;setValue(2000);\\n\\n$checkoutPaymentMethod = new CheckoutPaymentMethod();\\n$checkoutPaymentMethod\\n  -&gt;setStoredPaymentMethodId(\\&quot;M5N7TQ4TG5PFWR50\\&quot;)\\n  -&gt;setType(\\&quot;scheme\\&quot;);\\n\\n$paymentRequest = new PaymentRequest();\\n$paymentRequest\\n  -&gt;setReference(\\&quot;YOUR_ORDER_REFERENCE\\&quot;)\\n  -&gt;setAmount($amount)\\n  -&gt;setMerchantAccount(\\&quot;YOUR_MERCHANT_ACCOUNT\\&quot;)\\n  -&gt;setRecurringProcessingModel(\\&quot;UnscheduledCardOnFile\\&quot;)\\n  -&gt;setPaymentMethod($checkoutPaymentMethod)\\n  -&gt;setShopperInteraction(\\&quot;ContAuth\\&quot;)\\n  -&gt;setShopperReference(\\&quot;YOUR_SHOPPER_REFERENCE\\&quot;);\\n\\n$requestOptions['idempotencyKey'] = 'UUID';\\n\\n\\\/\\\/ Send the request\\n$service = new PaymentsApi($client);\\n$response = $service-&gt;payments($paymentRequest, $requestOptions);&quot;},{&quot;language&quot;:&quot;cs&quot;,&quot;tabTitle&quot;:&quot;C#&quot;,&quot;content&quot;:&quot;\\\/\\\/ Adyen .net API Library v17.0.0\\nusing Adyen;\\nusing Environment = Adyen.Model.Environment;\\nusing Adyen.Model;\\nusing Adyen.Model.Checkout;\\nusing Adyen.Service.Checkout;\\n\\n\\\/\\\/ For the live environment, additionally include your liveEndpointUrlPrefix.\\nvar config = new Config()\\n{\\n    XApiKey = \\&quot;ADYEN_API_KEY\\&quot;,\\n    Environment = Environment.Test\\n};\\nvar client = new Client(config);\\n\\n\\\/\\\/ Create the request object(s)\\nAmount amount = new Amount\\n{\\n  Currency = \\&quot;USD\\&quot;,\\n  Value = 2000\\n};\\n\\nCardDetails cardDetails = new CardDetails\\n{\\n  StoredPaymentMethodId = \\&quot;M5N7TQ4TG5PFWR50\\&quot;,\\n  Type = CardDetails.TypeEnum.Scheme\\n};\\n\\nPaymentRequest paymentRequest = new PaymentRequest\\n{\\n  Reference = \\&quot;YOUR_ORDER_REFERENCE\\&quot;,\\n  Amount = amount,\\n  MerchantAccount = \\&quot;YOUR_MERCHANT_ACCOUNT\\&quot;,\\n  RecurringProcessingModel = PaymentRequest.RecurringProcessingModelEnum.UnscheduledCardOnFile,\\n  PaymentMethod = new CheckoutPaymentMethod(cardDetails),\\n  ShopperInteraction = PaymentRequest.ShopperInteractionEnum.ContAuth,\\n  ShopperReference = \\&quot;YOUR_SHOPPER_REFERENCE\\&quot;\\n};\\n\\n\\\/\\\/ Send the request\\nvar service = new PaymentsService(client);\\nvar response = service.Payments(paymentRequest, requestOptions: new RequestOptions { IdempotencyKey = \\&quot;UUID\\&quot;});&quot;},{&quot;language&quot;:&quot;go&quot;,&quot;tabTitle&quot;:&quot;Go&quot;,&quot;content&quot;:&quot;\\\/\\\/ Adyen Go API Library v10.4.0\\nimport (\\n  \\&quot;context\\&quot;\\n  \\&quot;github.com\\\/adyen\\\/adyen-go-api-library\\\/v9\\\/src\\\/common\\&quot;\\n  \\&quot;github.com\\\/adyen\\\/adyen-go-api-library\\\/v9\\\/src\\\/adyen\\&quot;\\n  \\&quot;github.com\\\/adyen\\\/adyen-go-api-library\\\/v9\\\/src\\\/checkout\\&quot;\\n)\\n\\\/\\\/ For the live environment, additionally include your liveEndpointUrlPrefix.\\nclient := adyen.NewClient(&amp;common.Config{\\n  ApiKey:      \\&quot;ADYEN_API_KEY\\&quot;,\\n  Environment: common.TestEnv,\\n})\\n\\n\\\/\\\/ Create the request object(s)\\namount := checkout.Amount{\\n  Currency: \\&quot;USD\\&quot;,\\n  Value: 2000,\\n}\\n\\ncardDetails := checkout.CardDetails{\\n  StoredPaymentMethodId: common.PtrString(\\&quot;M5N7TQ4TG5PFWR50\\&quot;),\\n  Type: common.PtrString(\\&quot;scheme\\&quot;),\\n}\\n\\npaymentRequest := checkout.PaymentRequest{\\n  Reference: \\&quot;YOUR_ORDER_REFERENCE\\&quot;,\\n  Amount: amount,\\n  MerchantAccount: \\&quot;YOUR_MERCHANT_ACCOUNT\\&quot;,\\n  RecurringProcessingModel: common.PtrString(\\&quot;UnscheduledCardOnFile\\&quot;),\\n  PaymentMethod: checkout.CardDetailsAsCheckoutPaymentMethod(&amp;cardDetails),\\n  ShopperInteraction: common.PtrString(\\&quot;ContAuth\\&quot;),\\n  ShopperReference: common.PtrString(\\&quot;YOUR_SHOPPER_REFERENCE\\&quot;),\\n}\\n\\n\\\/\\\/ Send the request\\nservice := client.Checkout()\\nreq := service.PaymentsApi.PaymentsInput().IdempotencyKey(\\&quot;UUID\\&quot;).PaymentRequest(paymentRequest)\\nres, httpRes, err := service.PaymentsApi.Payments(context.Background(), req)&quot;},{&quot;language&quot;:&quot;py&quot;,&quot;tabTitle&quot;:&quot;Python&quot;,&quot;content&quot;:&quot;# Adyen Python API Library v12.5.1\\nimport Adyen\\n\\nadyen = Adyen.Adyen()\\nadyen.client.xapikey = \\&quot;ADYEN_API_KEY\\&quot;\\n# For the live environment, additionally include your liveEndpointUrlPrefix.\\nadyen.client.platform = \\&quot;test\\&quot; # The environment to use library in.\\n\\n# Create the request object(s)\\njson_request = {\\n  \\&quot;amount\\&quot;: {\\n    \\&quot;value\\&quot;: 2000,\\n    \\&quot;currency\\&quot;: \\&quot;USD\\&quot;\\n  },\\n  \\&quot;paymentMethod\\&quot;: {\\n    \\&quot;type\\&quot;: \\&quot;scheme\\&quot;,\\n    \\&quot;storedPaymentMethodId\\&quot;: \\&quot;M5N7TQ4TG5PFWR50\\&quot;\\n  },\\n  \\&quot;reference\\&quot;: \\&quot;YOUR_ORDER_REFERENCE\\&quot;,\\n  \\&quot;shopperInteraction\\&quot;: \\&quot;ContAuth\\&quot;,\\n  \\&quot;recurringProcessingModel\\&quot;: \\&quot;UnscheduledCardOnFile\\&quot;,\\n  \\&quot;merchantAccount\\&quot;: \\&quot;YOUR_MERCHANT_ACCOUNT\\&quot;,\\n  \\&quot;shopperReference\\&quot;: \\&quot;YOUR_SHOPPER_REFERENCE\\&quot;\\n}\\n\\n# Send the request\\nresult = adyen.checkout.payments_api.payments(request=json_request, idempotency_key=\\&quot;UUID\\&quot;)&quot;},{&quot;language&quot;:&quot;rb&quot;,&quot;tabTitle&quot;:&quot;Ruby&quot;,&quot;content&quot;:&quot;# Adyen Ruby API Library v9.5.1\\nrequire \\&quot;adyen-ruby-api-library\\&quot;\\n\\nadyen = Adyen::Client.new\\nadyen.api_key = 'ADYEN_API_KEY'\\n# For the live environment, additionally include your liveEndpointUrlPrefix.\\nadyen.env = :test # Set to \\&quot;live\\&quot; for live environment\\n\\n# Create the request object(s)\\nrequest_body = {\\n  :amount =&gt; {\\n    :value =&gt; 2000,\\n    :currency =&gt; 'USD'\\n  },\\n  :paymentMethod =&gt; {\\n    :type =&gt; 'scheme',\\n    :storedPaymentMethodId =&gt; 'M5N7TQ4TG5PFWR50'\\n  },\\n  :reference =&gt; 'YOUR_ORDER_REFERENCE',\\n  :shopperInteraction =&gt; 'ContAuth',\\n  :recurringProcessingModel =&gt; 'UnscheduledCardOnFile',\\n  :merchantAccount =&gt; 'YOUR_MERCHANT_ACCOUNT',\\n  :shopperReference =&gt; 'YOUR_SHOPPER_REFERENCE'\\n}\\n\\n# Send the request\\nresult = adyen.checkout.payments_api.payments(request_body, headers: { 'Idempotency-Key' =&gt; 'UUID' })&quot;},{&quot;language&quot;:&quot;ts&quot;,&quot;tabTitle&quot;:&quot;NodeJS (TypeScript)&quot;,&quot;content&quot;:&quot;\\\/\\\/ Adyen Node API Library v17.3.0\\n\\\/\\\/ Require the parts of the module you want to use\\nimport { Client, CheckoutAPI, Types } from \\&quot;@adyen\\\/api-library\\&quot;;\\n\\\/\\\/ Initialize the client object\\n\\\/\\\/ For the live environment, additionally include your liveEndpointUrlPrefix.\\nconst client = new Client({apiKey: \\&quot;ADYEN_API_KEY\\&quot;, environment: \\&quot;TEST\\&quot;});\\n\\n\\\/\\\/ Create the request object(s)\\nconst amount: Types.checkout.Amount = {\\n  currency: \\&quot;USD\\&quot;,\\n  value: 2000\\n};\\n\\nconst cardDetails: Types.checkout.CardDetails = {\\n  storedPaymentMethodId: \\&quot;M5N7TQ4TG5PFWR50\\&quot;,\\n  type: Types.checkout.CardDetails.TypeEnum.Scheme\\n};\\n\\nconst paymentRequest: Types.checkout.PaymentRequest = {\\n  reference: \\&quot;YOUR_ORDER_REFERENCE\\&quot;,\\n  amount: amount,\\n  merchantAccount: \\&quot;YOUR_MERCHANT_ACCOUNT\\&quot;,\\n  recurringProcessingModel: Types.checkout.PaymentRequest.RecurringProcessingModelEnum.UnscheduledCardOnFile,\\n  paymentMethod: cardDetails,\\n  shopperInteraction: Types.checkout.PaymentRequest.ShopperInteractionEnum.ContAuth,\\n  shopperReference: \\&quot;YOUR_SHOPPER_REFERENCE\\&quot;\\n};\\n\\n\\\/\\\/ Send the request\\nconst checkoutAPI = new CheckoutAPI(client);\\nconst response = checkoutAPI.PaymentsApi.payments(paymentRequest, { idempotencyKey: \\&quot;UUID\\&quot; });&quot;}]\" :enable-copy-link-to-code-block=\"true\" :code-sample-card-size=\"'fullsize'\"><\/code-sample>\n<\/div>\n<\/li>\n<\/ol>\n<p>You can also use tokens to make shopper-not-present payments for subscriptions or contracts. For more information, refer to <a href=\"\/pt\/online-payments\/tokenization\/make-token-payments#make-a-subscription-or-unscheduled-card-on-file-payment\">Making a payment for a subscription or contract<\/a>.<\/p>\n<h2 id=\"test-and-go-live\">Test and go live<\/h2>\n<p>If your client-side integration isn't ready, you can <a href=\"\/pt\/development-resources\/test-cards-and-credentials\/test-card-numbers#test-encrypted-card-details\">test API requests with encrypted card details<\/a> by adding a <code>test_<\/code> prefix to the test card details.<\/p>\n<p>Before making live card payments:<\/p>\n<ol>\n<li>\n<p>Test your integration using our <a href=\"\/pt\/development-resources\/test-cards-and-credentials\/test-card-numbers\">test card numbers<\/a>. You can check the status of test payments in your\u00a0<a href=\"https:\/\/ca-test.adyen.com\/\" target=\"_blank\" rel=\"nofollow noopener noreferrer\" class=\"external-link no-image\">Customer Area<\/a>\u00a0&gt;\u00a0<strong>Transactions<\/strong>\u00a0&gt;\u00a0<strong>Payments<\/strong>.<\/p>\n<\/li>\n<li>\n<p><a href=\"\/pt\/payment-methods\/add-payment-methods\">Add the cards that you want to accept<\/a> in your <a href=\"https:\/\/ca-live.adyen.com\/\" target=\"_blank\" rel=\"nofollow noopener noreferrer\" class=\"external-link no-image\">live Customer Area<\/a>.<\/p>\n<\/li>\n<li>\n<p>Configure the Component using the <a href=\"\/pt\/development-resources\/client-side-authentication\">client key<\/a> from your <a href=\"https:\/\/ca-live.adyen.com\/\" target=\"_blank\" rel=\"nofollow noopener noreferrer\" class=\"external-link no-image\">live Customer Area<\/a>.<\/p>\n<p><\/p>\n<\/li>\n<li>\n<p>Before you can start accepting card payments in the live environment, you need to assess your PCI DSS compliance and submit the required <em>Self-Assessment Questionnaire A<\/em> document. For more information, refer to <a href=\"\/pt\/development-resources\/pci-dss-compliance-guide#mobile-in-app-online-payments-integration\">PCI DSS compliance guide<\/a>.<\/p>\n<\/li>\n<\/ol>\n<h2 id=\"see-also\">See also<\/h2>\n<div class=\"see-also-links output-inline\" id=\"see-also\">\n<ul><li><a href=\"\/online-payments\/build-your-integration\/sessions-flow?platform=Android&amp;integration=Components\"\n                        target=\"_self\"\n                        >\n                    Android Components integration guide\n                <\/a><\/li><li><a href=\"\/online-payments\/tokenization\"\n                        target=\"_self\"\n                        >\n                    Tokenization\n                <\/a><\/li><li><a href=\"\/development-resources\/webhooks\"\n                        target=\"_self\"\n                        >\n                    Webhooks\n                <\/a><\/li><li><a href=\"https:\/\/docs.adyen.com\/api-explorer\/#\/CheckoutService\/latest\/overview\"\n                        target=\"_blank\"\n                         class=\"external\">\n                    API Explorer\n                <\/a><\/li><\/ul><\/div>\n","url":"https:\/\/docs.adyen.com\/pt\/payment-methods\/cards\/android-component\/earlier-versions","articleFields":{"description":"Add card payments to your existing Components integration."},"algolia":{"url":"https:\/\/docs.adyen.com\/pt\/payment-methods\/cards\/android-component\/earlier-versions","title":"Card Component v4.x.x integration","content":"This page explains how to add cards to your existing Android Components integration.\nOur Card Component renders the available cards in your payment form, and securely collects sensitive card information, so it doesn't touch your server.\nRequirements\n\n\n\nRequirement\nDescription\n\n\n\n\nIntegration type\nMake sure that you have built an Advanced flow Android Components integration. \n\n\nSetup steps\nBefore you begin: Aadd the cards that you want to accept in your Customer Area. Get your client key.\n\n\n\nGet your client key\n\nLog in to your Customer Area.\nGo to Developers &gt; API credentials, and select the credential username for your integration, for example ws@Company.[YourCompanyAccount].\nUnder Client settings &gt; Authentication select the Client key tab.\nSelect Generate client key.\nSelect the copy icon  and store your client key securely in your system.\nUnder Add allowed origins, enter your domains and select Add.\nSelect Save changes.\n\nShow the available cards in your payment form\n\nFor information about the supported locations and currencies for each card, refer to Payment methods.\n\nTo show the Card Component in your payment form, you need to:\n\n\nSpecify in your  \/paymentMethods request a combination of  countryCode and  amount.currency. This is used to determine which cards are available to the shopper.\n\n\nDeserialize the  \/paymentMethods response, and get the object with type: scheme.\nFor showing stored cards, get the object with type: storedPaymentMethods.\n\n\nAdd the Card Component:\na. Import the Card Component to your build.gradle file.\n  implementation \"com.adyen.checkout:card:&lt;latest-version&gt;\"\nFor the latest version, refer to our GitHub.\nb. Create a cardConfiguration object, and pass your client key. You can also include optional configuration, for example to make the cardholder name required.\n val cardConfiguration = CardConfiguration.Builder(context, \"YOUR_CLIENT_KEY\")\n      \/\/ Makes the cardholder name required\n      .setHolderNameRequired(true)\n      \/\/ When you are ready to accept live payments, change the value to one of our live environments.\n      .setEnvironment(Environment.TEST)\n      .build()\nc.   Initialize the Card Component. Pass the object from the  \/paymentMethods response and the cardConfiguration object.\n   val cardComponent = CardComponent.PROVIDER.get(this@YourActivity, paymentMethod, cardConfiguration)\nd. Add the Card Component view to your layout.\n   &lt;com.adyen.checkout.Card.CardView\n          android:id=\"@+id\/cardView\"\n          android:layout_width=\"wrap_content\"\n          android:layout_height=\"wrap_content\"\/&gt;\ne. Attach the Component to the view to start getting your shopper's payment details.\n   cardView.attach(cardComponent, this@YourActivity)\nf. When shoppers enter their payment details, you start receiving updates. If isValid is true and the shopper proceeds to pay, pass the paymentComponentState.data to your server and make a payment request.\n cardComponent.observe(this) { paymentComponentState -&gt;\n    if (paymentComponentState?.isValid == true) {\n       \/\/ When the shopper proceeds to pay, pass the `paymentComponentState.data` to your server to send a \/payments request\n       sendPayment(paymentComponentState.data)\n    }\n }\n\n\n\nOptional configuration\nWhen you create the \n  CardConfiguration\n object, you can optionally add configuration parameters.\nAddress field configuration\nConfigure the postal code field in AddressConfiguration.PostalCode.\nInclude the following parameter:\n\n\n\nParameter\nDescription\nDefault value\n\n\n\n\naddressFieldPolicy\nSet if shoppers are required to fill in the fields.  Possible values:  - Required  - Optional  - OptionalForCardTypes: include the brand parameter, which is a list of values of type String to specify which brands input is optional for.\nRequired\n\n\n\n\n    \n\nMake a payment\nWhen the shopper proceeds to pay, the Component returns the paymentComponentState.data.paymentMethod.\n\nPass the paymentComponentState.data to your server.\n\nFrom your server, make a  \/payments request, specifying:\n\npaymentMethod: The paymentComponentState.data.paymentMethod from your client app.\n\n\n\n\n    \n\nThe  \/payments response contains:\n\npspReference: Our unique identifier for the transaction.\nresultCode: Use this to present the payment result to your shopper.\nmerchantReference: The reference from the  \/payments request.\nadditionalData: Additional information about the transaction.\nTo specify the fields that you want to receive in additionalData, log in to your Customer Area, and go to Developers &gt; Additional data.  \n\n\n    \n\nPresent the payment result\nUse the\u00a0 resultCode from the  \/payments response to present the payment result to your shopper. You will also receive the outcome of the payment asynchronously in a webhook.\n\nFor card payments, you can receive the following resultCode values:\n\n\n\nresultCode\nDescription\nAction to take\n\n\n\n\nAuthorised\nThe payment was successful.\nInform the shopper that the payment has been successful.  If you are using manual capture, you also need to capture the payment.\n\n\nCancelled\nThe shopper cancelled the payment.\nAsk the shopper whether they want to continue with the order, or ask them to select a different payment method.\n\n\nError\nThere was an error when the payment was being processed. For more information, check the \n  refusalReason\n field.\nInform the shopper that there was an error processing their payment.\n\n\nRefused\nThe payment was refused.  For more information, check the \n  refusalReason\n field.\nAsk the shopper to try the payment again using a different payment method.\n\n\n\n\nAdditional resultCode values are possible in case of the 3D Secure authentication flow. For more information, refer to Result codes.\n\nRecurring payments\nAdyen's tokenization service allows you to securely store shopper's card details for recurring payments. To make recurring payments, you first need to create a shopper token, and then use the token to make future payments for the shopper.\nCreate a token\nWhen a shopper chooses to pay with card, the Card Component renders a switch for saving the card details for future payments. If a shopper selects this option, the paymentComponentState from the Component will include data.storePaymentMethod. Pass this to your server.\n\nTo create a token, include in your  \/payments request:\n\nstorePaymentMethod: The paymentComponentState.data.storePaymentMethod from your client app.\n shopperReference&#58; Your unique identifier for the shopper.\n\n\nIf you do not want to show the switch for saving card details, set showStoredPaymentMethods to false when creating the cardConfiguration object:\n     val cardConfiguration = CardConfiguration.Builder(context, \"YOUR_CLIENT_KEY\")\n          \/\/ hides the switch for saving card details\n          .setShowStorePaymentField(false)\n          .build()\nShow a stored card in your payment form\nWhen the shopper proceeds to pay, the Component returns the paymentComponentState.data.paymentMethod.\n\nPass the paymentComponentState.data.paymentMethod to your server.\n\nFrom your server, make a  \/payments request, specifying:\n\npaymentMethod: The paymentComponentState.data.paymentMethod from your client app.\n\n\n\n\n\n\nYou can also use tokens to make shopper-not-present payments for subscriptions or contracts. For more information, refer to Making a payment for a subscription or contract.\nTest and go live\nIf your client-side integration isn't ready, you can test API requests with encrypted card details by adding a test_ prefix to the test card details.\nBefore making live card payments:\n\n\nTest your integration using our test card numbers. You can check the status of test payments in your\u00a0Customer Area\u00a0&gt;\u00a0Transactions\u00a0&gt;\u00a0Payments.\n\n\nAdd the cards that you want to accept in your live Customer Area.\n\n\nConfigure the Component using the client key from your live Customer Area.\n\n\n\nBefore you can start accepting card payments in the live environment, you need to assess your PCI DSS compliance and submit the required Self-Assessment Questionnaire A document. For more information, refer to PCI DSS compliance guide.\n\n\nSee also\n\n\n                    Android Components integration guide\n                \n                    Tokenization\n                \n                    Webhooks\n                \n                    API Explorer\n                \n","type":"page","locale":"pt","boost":16,"hierarchy":{"lvl0":"Home","lvl1":"Payment methods","lvl2":"Cards","lvl3":"Card Component integration","lvl4":"Card Component v4.x.x integration"},"hierarchy_url":{"lvl0":"https:\/\/docs.adyen.com\/pt","lvl1":"https:\/\/docs.adyen.com\/pt\/payment-methods","lvl2":"https:\/\/docs.adyen.com\/pt\/payment-methods\/cards","lvl3":"https:\/\/docs.adyen.com\/pt\/payment-methods\/cards\/android-component","lvl4":"\/pt\/payment-methods\/cards\/android-component\/earlier-versions"},"levels":5,"category":"Payment method","category_color":"green","tags":["Component","v4.x.x","integration"]},"articleFiles":{"card-payment.js":"<p alt=\"\">card-payment.js<\/p>"}}