Advanced flow integration guide

Drop-in is our pre-built UI solution for accepting payments in your app. Drop-in shows all payment methods as a list, in the same block. This Advanced flow integration requires you to make server-side API requests to the /paymentMethods, /payments, and /payments/details endpoints.

How it works

The following flow applies for each payment method supported in Drop-in:

On this page we talk about both server-side and client-side integration steps:

1. From your server, submit a request to get a list of payment methods available to the shopper.
2. Create an instance of Drop-in.
3. From your server, submit a payment request with the data returned by Drop-in.
4. Determine from the response if you need to perform additional actions on your client app.
5. From your server, submit additional payment details with the data returned by Drop-in.
6. Present the payment result to the shopper.

When you have finished integrating with our Drop-in solution, proceed to test your integration.

Before you begin

If you haven't done so already, follow our Get started guide to set up your test account, get your API key, and install a server-side library.

Install the Adyen iOS client-side library

Choose how you want to install the Adyen iOS client-side library:

Get your client key

You need a client key, a public key linked to your API credential, that the iOS Drop-in uses for client-side authentication.

1. Log in to your Customer Area.
2. Go to Developers > API credentials, and select the API credential for your integration, for example ws@Company.[YourCompanyAccount].
3. Under Authentication, select Generate New Client Key.
4. Select Save.

Step 1: Get available payment methods

When your shopper is ready to pay, get a list of the available payment methods based on their country, device, and the payment amount.

From your server, make a POST /paymentMethods request, providing the following parameters. While most parameters are optional, we recommend that you include them because Adyen uses these to tailor the list of payment methods for your shopper.

Parameter name	Required	Description
merchantAccount		Your merchant account name.
amount		The currency of the payment and its value in minor units.
channel		The platform where the payment is taking place. Use iOS. Adyen returns only the payment methods available for iOS.
countryCode		The shopper's country code. Adyen returns only the payment methods available in this country.
shopperLocale		By default, the shopperlocale is set to en-US. To change the language, set this to the shopper's language and country code. You also need to set the same ShopperLocale within your Drop-in configuration.

Here's an example of how you would get the available payment methods for a shopper in the Netherlands, for a payment of 10 EUR:

curl https://checkout-test.adyen.com/v69/paymentMethods \
-H "x-API-key: YOUR_X-API-KEY" \
-H "content-type: application/json" \
-d '{
  "merchantAccount": "YOUR_MERCHANT_ACCOUNT",
  "countryCode": "NL",
  "amount": {
    "currency": "EUR",
    "value": 1000
  },
  "channel": "iOS",
  "shopperLocale": "nl-NL"
}'

require 'adyen-ruby-api-library'

# Set your X-API-KEY with the API key from the Customer Area.
adyen = Adyen::Client.new
adyen.env = :test
adyen.api_key = "YOUR_X-API-KEY"

response = adyen.checkout.payment_methods({
    :countryCode => 'NL',
    :shopperLocale => 'nl-NL',
    :amount => {
        :currency => 'EUR',
        :value => 1000
    },
    :channel => 'iOS',
    :merchantAccount => 'YOUR_MERCHANT_ACCOUNT'
})

// Set your X-API-KEY with the API key from the Customer Area.
String xApiKey = "YOUR_X-API-KEY";
Client client = new Client(xApiKey,Environment.TEST);
Checkout checkout = new Checkout(client);
PaymentMethodsRequest paymentMethodsRequest = new PaymentMethodsRequest();
paymentMethodsRequest.setMerchantAccount("YOUR_MERCHANT_ACCOUNT");
paymentMethodsRequest.setCountryCode("NL");
paymentMethodsRequest.setShopperLocale("nl-NL");
Amount amount = new Amount();
amount.setCurrency("EUR");
amount.setValue(1000L);
paymentMethodsRequest.setAmount(amount);
paymentMethodsRequest.setChannel(PaymentMethodsRequest.ChannelEnum.iOS);
PaymentMethodsResponse paymentMethodsResponse = checkout.paymentMethods(paymentMethodsRequest);
// Pass the response to your front end

// Set your X-API-KEY with the API key from the Customer Area.
$client = new \Adyen\Client();
$client->setEnvironment(\Adyen\Environment::TEST);
$client->setXApiKey("YOUR_X-API-KEY");
$service = new \Adyen\Service\Checkout($client);

$params = array(
    "countryCode" => "NL",
    "shopperLocale" => "nl-NL",
    "amount" => array(
        "currency" => "EUR",
        "value" => 1000
    ),
    "channel" => "iOS",
    "merchantAccount" => "YOUR_MERCHANT_ACCOUNT"
);
$result = $service->paymentMethods($params);

# Set your X-API-KEY with the API key from the Customer Area.
adyen = Adyen.Adyen()
adyen.payment.client.platform = "test"
adyen.client.xapikey = 'YOUR_X-API-KEY'

request = {
    'countryCode': 'NL',
    'shopperLocale': 'nl-NL',
    'amount': {
        'value': 1000,
        'currency': 'EUR'
    },
    'channel': 'iOS',
    'merchantAccount': 'YOUR_MERCHANT_ACCOUNT'
}
result = adyen.checkout.payment_methods(request)

// Set your X-API-KEY with the API key from the Customer Area.
string apiKey = "YOUR_X-API-KEY";
var client = new Client (apiKey, Environment.Test);
var checkout = new Checkout(client);
var amount = new Adyen.Model.Checkout.Amount("EUR", 1000);
var paymentMethodsRequest = new Adyen.Model.Checkout.PaymentMethodsRequest(merchantAccount: "YOUR_MERCHANT_ACCOUNT")
{ 
    CountryCode = "NL",
    ShopperLocale = "nl-NL",
    Amount = amount,
    Channel = Adyen.Model.Checkout.PaymentMethodsRequest.ChannelEnum.iOS,
};
var paymentMethodsResponse = checkout.PaymentMethods(paymentMethodsRequest);

const {Client, Config, CheckoutAPI} = require('@adyen/api-library');
const config = new Config();
// Set your X-API-KEY with the API key from the Customer Area.
config.apiKey = '[YOUR_X-API-KEY]';
config.merchantAccount = '[YOUR_MERCHANT_ACCOUNT]';
const client = new Client({ config });
client.setEnvironment("TEST");
const checkout = new CheckoutAPI(client);
const paymentsResponse = checkout.paymentMethods({
    merchantAccount: config.merchantAccount,
    countryCode: "NL",
    shopperLocale: "nl-NL",
    amount: { currency: "EUR", value: 1000, },
    channel: "iOS"
}).then(res => res);

import (
    "github.com/adyen/adyen-go-api-library/v5/src/checkout"
    "github.com/adyen/adyen-go-api-library/v5/src/common"
    "github.com/adyen/adyen-go-api-library/v5/src/adyen"
)
// Set your X-API-KEY with the API key from the Customer Area.
client := adyen.NewClient(&common.Config{
    Environment: common.TestEnv,
    ApiKey:      "[YOUR_X-API-KEY]",
})
res, httpRes, err := client.Checkout.PaymentMethods(&checkout.PaymentMethodsRequest{
    CountryCode: "NL",
    ShopperLocale: "nl-NL",
    Amount: &checkout.Amount{
        Value:    1000,
        Currency: "EUR",
    },
    Channel: "iOS",
    MerchantAccount: "[YOUR_MERCHANT_ACCOUNT]",
})

The response includes the list of available paymentMethods:

{
 "paymentMethods":[
  {
    "details":[...],
    "name":"Credit Card",
    "type":"scheme"
    ...
  },
  {
    "details":[...],
    "name":"SEPA Direct Debit",
    "type":"sepadirectdebit"
  },
  ...
  ]
}

Pass the response to your client app. You will use this in the next step to present which payment methods are available to the shopper.

Step 2: Add Drop-in to your payment form

Next, use Drop-in to show the available payment methods and to collect payment details from your shopper.

1. Decode the /paymentMethods response with the PaymentMethods structure.

   let paymentMethods = try JSONDecoder().decode(PaymentMethods.self, from: paymentMethodsResponse)

2. Create an instance of APIContext with the following parameters:

   Parameter name	Required	Description
   clientKey		Your client key.
   environment		Use test. When you're ready to accept live payments, change the value to one of our live environments.

   APIContext initialization

   // When you're ready to go live, change environment to Environment.live
   // You can also use other environment values described in https://adyen.github.io/adyen-ios/Docs/Structs/Environment.html
   let apiContext = APIContext(environment: Environment.test, clientKey: clientKey)

   https://docs.adyen.com/pt/pt/payment-methods/molpay/ios-component#apicontext-initialization

3. Inject the APIContext instance and add additional configuration in an instance of DropInComponent.Configuration. Check specific payment method pages to confirm if you need to include additional required parameters.

   // Check specific payment method pages to confirm if you need to configure additional required parameters.
   let configuration = DropInComponent.Configuration(apiContext: apiContext)

4. Initialize the DropInComponent class.

   Parameter name	Required	Description
   paymentMethods		The full, decoded /paymentMethods response.
   paymentMethodsConfiguration		Contains required or optional configuration for specific payment methods. For more information, refer to supported payment methods.
   payment		Show the amount a shopper has to pay on the Pay button. To do this, you include the currency code and the amount in minor units that the shopper has to pay.

   let dropInComponent = DropInComponent(paymentMethods: paymentMethods, configuration: dropInConfiguration)
   dropInComponent.delegate = self
   
   // Keep the Drop-in instance to avoid it being destroyed after the function is executed.
   self.dropInComponent = dropInComponent
   
   // Optional. In this example, the Pay button will display 10 EUR.
   dropInComponent.payment = Payment(amount: Amount(value: 1000, currencyCode: "EUR"))
   present(dropInComponent.viewController, animated: true)

5. After the shopper selects a payment method and provides payment details, Drop-in invokes the didSubmit method. Get the contents of data.paymentMethod and pass this to your server.

   func didSubmit(_ data: PaymentComponentData, for paymentMethod: PaymentMethod, from component: DropInComponent)

   If an error occurs on the app, Drop-in invokes the didFail method. Dismiss Drop-in's view controller and display an error message.

   func didFail(with error: Error, from component: DropInComponent)

   If the shopper decides not to continue with the selected payment method, Drop-in invokes the didCancel method. You can use didCancel to track the state of the payment.

   func didCancel(component: PaymentComponent, from dropInComponent: DropInComponent)

Localization

iOS Drop-in supports the languages listed here. However, if you want to customize the localization, you can add new localizable.strings file for the language that you need. You can also override existing entries by using the same keys. Check all available strings here.

For example, to override the cardholder name field title, set the following on your localizable.strings file:

"adyen.card.nameItem.title" = "Your cardholder name";

The library first checks the key in the main application bundle and then in the internal bundle.

You can use LocalizationParameters to customize the localization file name, bundle, or the separator for translation strings.
For example, if you store translations in MyLocalizable.strings files in the shared bundle CommonBundle:

let localizationParameters = LocalizationParameters(bundle: commonBundle, tableName: "MyLocalizable")
dropInComponent.localizationParameters = localizationParameters

Step 3: Make a payment

After the shopper submits their payment details or chooses to pay with a payment method that requires a redirection, you need to make a payment request to Adyen.

From your server, make a POST /payments request specifying:

Parameter name	Required	Description
merchantAccount		Your merchant account name.
amount		The currency of the payment and its value in minor units.
reference		Your unique reference for this payment.
paymentMethod		The data.paymentMethod from the didSubmit method from your client app.
returnUrl		URL to where the shopper should be taken back to after a redirection. This URL can have a maximum of 1024 characters. For more information on setting a custom URL scheme for your app, read the Apple Developer documentation.
applicationInfo		If you're building an Adyen solution for multiple merchants, include some basic identifying information, so that we can offer you better support. For more information, refer to Building Adyen solutions.

Here's an example of how you would make a payment request for 10 EUR:

curl https://checkout-test.adyen.com/v69/payments \
-H "x-API-key: YOUR_API_KEY" \
-H "content-type: application/json" \
-d '{
  "amount":{
    "currency":"EUR",
    "value":1000
  },
  "reference":"YOUR_ORDER_NUMBER",
  "paymentMethod":{hint:paymentMethod field of an object passed from the front end or client app}STATE_DATA{/hint},
  "returnUrl":"my-app://",
  "merchantAccount":"YOUR_MERCHANT_ACCOUNT"
}'

require 'adyen-ruby-api-library'

# Set your X-API-KEY with the API key from the Customer Area.
adyen = Adyen::Client.new
adyen.env = :test
adyen.api_key = "YOUR_X-API-KEY"

# STATE_DATA is the paymentMethod field of an object passed from the front end or client app, deserialized from JSON to a data structure.
paymentMethod = STATE_DATA

response = adyen.checkout.payments({ 
    :paymentMethod => paymentMethod,
    :amount => {
        :currency => 'EUR',
        :value => 1000
    },
    :reference => 'YOUR_ORDER_NUMBER',
    :returnUrl => 'my-app://',
    :merchantAccount => 'YOUR_MERCHANT_ACCOUNT'
})

# Check if further action is needed.
if response.body.has_key(:action)
   # Pass the action object to your front end
   # response.body[:action]
else
   # No further action needed, pass the resultCode object to your front end
   # response.body[:resultCode]

// Set your X-API-KEY with the API key from the Customer Area.
String xApiKey = "YOUR_X-API-KEY";
Client client = new Client(xApiKey,Environment.TEST);
Checkout checkout = new Checkout(client);
PaymentsRequest paymentsRequest = new PaymentsRequest();
paymentsRequest.setMerchantAccount("YOUR_MERCHANT_ACCOUNT");
// STATE_DATA is the paymentMethod field of an object passed from the front end or client app, deserialized from JSON to a data structure.
paymentsRequest.setPaymentMethod(STATE_DATA)
Amount amount = new Amount();
amount.setCurrency("EUR");
amount.setValue(1000L);
paymentsRequest.setAmount(amount);
paymentsRequest.setReference("YOUR_ORDER_NUMBER");
paymentsRequest.setReturnUrl("my-app://");
PaymentsResponse paymentsResponse = checkout.payments(paymentsRequest);

// Set your X-API-KEY with the API key from the Customer Area.
$client = new \Adyen\Client();
$client->setEnvironment(\Adyen\Environment::TEST);
$client->setXApiKey("YOUR_X-API-KEY");
$service = new \Adyen\Service\Checkout($client);

// STATE_DATA is the paymentMethod field of an object passed from the front end or client app, deserialized from JSON to a data structure.
$paymentMethod = STATE_DATA;;

$params = array(
    "paymentMethod" => $paymentMethod,
    "amount" => array(
        "currency" => "EUR",
        "value" => 1000
    ),
    "reference" => "YOUR_ORDER_NUMBER",
    "returnUrl" => "my-app://",
    "merchantAccount" => "YOUR_MERCHANT_ACCOUNT"
);
$result = $service->payments($params);

// Check if further action is needed
if (array_key_exists("action", $result)){
   // Pass the action object to your front end
   // $result["action"]
}
else {
   // No further action needed, pass the resultCode to your front end
   // $result['resultCode']
}

# Set your X-API-KEY with the API key from the Customer Area.
adyen = Adyen.Adyen()
adyen.payment.client.platform = "test"
adyen.client.xapikey = 'YOUR_X-API-KEY'

# STATE_DATA is the paymentMethod field of an object passed from the front end or client app, deserialized from JSON to a data structure.
paymentMethod = STATE_DATA

result = adyen.checkout.payments({
    'paymentMethod': paymentMethod,
    'amount': {
        'value': 1000,
        'currency': 'EUR'
    },
    'reference': 'YOUR_ORDER_NUMBER',
    'returnUrl': 'my-app://',
    'merchantAccount': 'YOUR_MERCHANT_ACCOUNT'
})

# Check if further action is needed
if 'action' in result.message:
   # Pass the action object to your front end
   # result.message['action']
else:
   # No further action needed, pass the resultCode to your front end
   # result.message['resultCode']

// Set your X-API-KEY with the API key from the Customer Area.
string apiKey = "YOUR_X-API-KEY";
var client = new Client (apiKey, Environment.Test);
var checkout = new Checkout(client);
var amount = new Adyen.Model.Checkout.Amount("EUR", 1000);
var paymentsRequest = new Adyen.Model.Checkout.PaymentRequest
{ 
// STATE_DATA is the paymentMethod field of an object passed from the front end or client app, deserialized from JSON to a data structure.
    PaymentMethod = STATE_DATA,
    Amount = amount,
    Reference = "YOUR_ORDER_NUMBER",
    ReturnUrl = @"my-app://",
};
var paymentResponse = checkout.Payments(paymentsRequest);

const {Client, Config, CheckoutAPI} = require('@adyen/api-library');
const config = new Config();
// Set your X-API-KEY with the API key from the Customer Area.
config.apiKey = '[YOUR_X-API-KEY]';
config.merchantAccount = '[YOUR_MERCHANT_ACCOUNT]';
const client = new Client({ config });
client.setEnvironment("TEST");
const checkout = new CheckoutAPI(client);
checkout.payments({
    merchantAccount: config.merchantAccount,
// STATE_DATA is the paymentMethod field of an object passed from the front end or client app, deserialized from JSON to a data structure.
    paymentMethod: STATE_DATA,
    amount: { currency: "EUR", value: 1000, },
    reference: "YOUR_ORDER_NUMBER",
    returnUrl: "my-app://"
}).then(res => res);

import (
    "github.com/adyen/adyen-go-api-library/v5/src/checkout"
    "github.com/adyen/adyen-go-api-library/v5/src/common"
    "github.com/adyen/adyen-go-api-library/v5/src/adyen"
)
// Set your X-API-KEY with the API key from the Customer Area.
client := adyen.NewClient(&common.Config{
    Environment: common.TestEnv,
    ApiKey:      "[YOUR_X-API-KEY]",
})
// STATE_DATA is the paymentMethod field of an object passed from the front end or client app, deserialized from JSON to a data structure.
paymentMethod := STATE_DATA
res, httpRes, err := client.Checkout.Payments(&checkout.PaymentRequest{
    PaymentMethod: paymentMethod,
    Amount: checkout.Amount{
        Value:    1000,
        Currency: "EUR",
    },
    Reference: "YOUR_ORDER_NUMBER",
    ReturnUrl: "my-app://",
    MerchantAccount: "[YOUR_MERCHANT_ACCOUNT]",
})

Your next steps depend on whether the /payments response contains an action object:

The following example shows a /payments response with action.type: threeDS2Fingerprint:

{
  "resultCode":"IdentifyShopper",
  "action":{
    "paymentData":"Ab02b4c0!BQABAgCuZFJrQOjSsl\/zt+...",
    "paymentMethodType":"scheme",
    "token":"eyJ0aHJlZURTTWV0aG9kTm90aWZpY...",
    "type":"threeDS2Fingerprint"
  },
  "authentication":{
    "threeds2.fingerprintToken":"eyJ0aHJlZURTTWV0aG9kTm90aWZpY..."
  },
  "details":[
    {
      "key":"threeds2.fingerprint",
      "type":"text"
    }
  ],
  ...
}

Step 4: Perform additional client-side actions

Some payment methods require additional action from the shopper such as: to authenticate a payment with 3D Secure, or to switch to another app to complete the payment.

To handle these additional client app actions, Drop-in uses the action object from the previous step. You should also use the action.type to determine your next steps.

1. Use dropInComponent.handle(action) to trigger Drop-in to perform additional actions.

   let action = try JSONDecoder().decode(Action.self, from: actionData)
   dropInComponent.handle(action)

2. Drop-in performs additional client app actions depending on the action.type. Your next steps depend on the type of action that Drop-in performs.

   Checkout API v67 Checkout API v66 and earlier

   Checkout API v67 Checkout API v66 and earlier

   action.type	Description	Next steps
   redirect	Drop-in redirects the shopper to another website or app to complete the payment. When the shopper is redirected back to your app, Drop-in calls the didProvide method.	1. Get the data from the didProvide method and pass it to your server. Dismiss the dropInComponent immediately, or wait until you have submitted the details to your server. 2. When the shopper returns to your app, handle the redirect result. 3. Proceed to step 5 to check the payment result.
   threeDS2	The payment qualifies for 3D Secure 2, and will go through either the frictionless or the challenge flow. Drop-in performs the authentication flow, and calls the didProvide method.	1. Get the data from the didProvide method and pass it to your server. Dismiss the dropInComponent immediately, or wait until you have submitted the details to your server. 2. Proceed to step 5 to submit additional payment details.
   sdk	Drop-in triggers the app switch from your app to the payment method's app, if installed in the shopper's device. When the shopper is redirected back to your app, Drop-in calls the didProvide method.	1. Get the data from the didProvide method and pass it to your server. Dismiss the dropInComponent immediately, or wait until you have submitted the details to your server. 2. Proceed to step 5 to check the payment result.
   voucher	Drop-in presents UI for voucher. The shopper expected to shared, save voucher as image or, in some cases, add voucher to AppleWallet. When shopper finishes the flow, Drop-in calls didComplete	Dismiss the dropInComponent immediately. Payment flow is completed.
   await	Drop-in presents await UI. The shopper expected to continue payment process outside of the merchant's app. Drop-in will poll payment status and, if completed, calls the didProvide method.	1. Get the data from the didProvide method and pass it to your server. Dismiss the dropInComponent immediately, or wait until you have submitted the details to your server. 2. Proceed to step 5 to submit additional payment details.
   qrCode	Drop-in presents UI for QR code payment. The shopper expected to continue payment process outside of the merchant's app. Drop-in performs the flow, and calls the didProvide method.	1. Get the data from the didProvide method and pass it to your server. Dismiss the dropInComponent immediately, or wait until you have submitted the details to your server. 2. Proceed to step 5 to submit additional payment details.

   action.type	Description	Next steps
   redirect	Drop-in redirects the shopper to another website or app to complete the payment. When the shopper is redirected back to your app, Drop-in calls the didProvide method.	1. Get the data from the didProvide method and pass it to your server. Dismiss the dropInComponent immediately, or wait until you have submitted the details to your server. 2. When the shopper returns to your app, handle the redirect result. 3. Proceed to step 5 to check the payment result.
   threeDS2Fingerprint	The payment qualifies for 3D Secure 2, and will go through either the frictionless or the challenge flow. Drop-in performs the authentication flow, and calls the didProvide method.	1. Get the data from the didProvide method and pass it to your server. Dismiss the dropInComponent immediately, or wait until you have submitted the details to your server. 2. Proceed to step 5 to submit additional payment details.
   threeDS2Challenge	The payment qualifies for 3D Secure 2, and the issuer is initiating a challenge flow. Drop-in performs the authentication flow, and calls the didProvide method.	1. Get the data from the didProvide method and pass it to your server. Dismiss the dropInComponent immediately, or wait until you have submitted the details to your server. 2. Proceed to step 5 to submit additional payment details.
   sdk	Drop-in triggers the app switch from your app to the payment method's app, if installed in the shopper's device. When the shopper is redirected back to your app, Drop-in calls the didProvide method.	1. Get the data from the didProvide method and pass it to your server. Dismiss the dropInComponent immediately, or wait until you have submitted the details to your server. 2. Proceed to step 5 to check the payment result.
   voucher	Drop-in presents UI for voucher. The shopper expected to shared, save voucher as image or, in some cases, add voucher to AppleWallet. When shopper finishes the flow, Drop-in calls didComplete	Dismiss the dropInComponent immediately. Payment flow is completed.
   await	Drop-in presents await UI. The shopper expected to continue payment process outside of the merchant's app. Drop-in will poll payment status and, if completed, calls the didProvide method.	1. Get the data from the didProvide method and pass it to your server. Dismiss the dropInComponent immediately, or wait until you have submitted the details to your server. 2. Proceed to step 5 to submit additional payment details.
   qrCode	Drop-in presents UI for QR code payment. The shopper expected to continue payment process outside of the merchant's app. Drop-in performs the flow, and calls the didProvide method.	1. Get the data from the didProvide method and pass it to your server. Dismiss the dropInComponent immediately, or wait until you have submitted the details to your server. 2. Proceed to step 5 to submit additional payment details.

Handle the redirect result

If the Action class returns .redirect, the shopper is redirected to an external site or to another application to complete the payment. You then need to inform Drop-in when the shopper returns to your app. To do this, implement the following in your UIApplicationDelegate:

func application(_ app: UIApplication, open url: URL, options: [UIApplicationOpenURLOptionsKey: Any] = [:]) -> Bool {
    RedirectComponent.applicationDidOpen(from: url)
    return true
}

Step 5: Submit additional payment details

If the shopper performed additional action to complete the payment, you need to make another request to Adyen to either submit the additional payment details or to check the payment result.

From your server, make a POST /payments/details request with the data from the didProvide method from your client app.

curl https://checkout-test.adyen.com/v69/payments/details \
-H "x-API-key: YOUR_X-API-KEY" \
-H "content-type: application/json" \
-d '{hint:object passed from the front end or client app}STATE_DATA{/hint}'

require 'adyen-ruby-api-library'

# Set your X-API-KEY with the API key from the Customer Area.
adyen = Adyen::Client.new
adyen.env = :test
adyen.api_key = "YOUR_X-API-KEY"

# STATE_DATA is an object passed from the front end or client app, deserialized from JSON to a data structure.
request = STATE_DATA 
response = adyen.checkout.payments.details(request)  

# Check if further action is needed.
if response.body.has_key(:action)
   # Pass the action object to your frontend
   puts response.body[:action]
else
   # No further action needed, pass the resultCode to your frontend
   puts response.body[:resultCode]
end

// Set your X-API-KEY with the API key from the Customer Area.
String xApiKey = "YOUR_X-API-KEY";
Client client = new Client(xApiKey,Environment.TEST);
Checkout checkout = new Checkout(client);
// STATE_DATA is an object passed from the front end or client app, deserialized from JSON to a data structure.
PaymentsDetailsRequest paymentsDetailsRequest = STATE_DATA;
PaymentsResponse paymentsDetailsResponse = checkout.paymentsDetails(paymentsDetailsRequest);

// Set your X-API-KEY with the API key from the Customer Area.
$client = new \Adyen\Client();
$client->setEnvironment(\Adyen\Environment::TEST);
$client->setXApiKey("YOUR_X-API-KEY");
$service = new \Adyen\Service\Checkout($client);

// STATE_DATA is an object passed from the front end or client app, deserialized from JSON to a data structure.
$params = STATE_DATA;
$result = $service->paymentsDetails($params);

// Check if further action is needed
if (array_key_exists("action", $result)){
   // Pass the action object to your frontend.
   // $result["action"]
}
else {
   // No further action needed, pass the resultCode to your front end
   // $result['resultCode']
}

# Set your X-API-KEY with the API key from the Customer Area.
adyen = Adyen.Adyen()
adyen.payment.client.platform = "test"
adyen.client.xapikey = 'YOUR_X-API-KEY'

# STATE_DATA is an object passed from the front end or client app, deserialized from JSON to a data structure.
request = STATE_DATA
result = adyen.checkout.payments_details(request)

# Check if further action is needed.
if 'action' in result.message:
   # Pass the action object to your front end
   # result.message['action']
else:
   # No further action needed, pass the resultCode to your front end
   # result.message['resultCode']

// Set your X-API-KEY with the API key from the Customer Area.
string apiKey = "YOUR_X-API-KEY";
var client = new Client (apiKey, Environment.Test);
var checkout = new Checkout(client);
// STATE_DATA is an object passed from the front end or client app, deserialized from JSON to a data structure.
var paymentsDetailsRequest = STATE_DATA;
var paymentsDetailsResponse = checkout.PaymentDetails(paymentsDetailsRequest);

const {Client, Config, CheckoutAPI} = require('@adyen/api-library');
const config = new Config();
// Set your X-API-KEY with the API key from the Customer Area.
config.apiKey = '[YOUR_X-API-KEY]';
const client = new Client({ config });
client.setEnvironment("TEST");
const checkout = new CheckoutAPI(client);
// STATE_DATA is an object passed from the front end or client app, deserialized from JSON to a data structure.
checkout.paymentsDetails(STATE_DATA).then(res => res);

import (
    "github.com/adyen/adyen-go-api-library/v5/src/checkout"
    "github.com/adyen/adyen-go-api-library/v5/src/common"
    "github.com/adyen/adyen-go-api-library/v5/src/adyen"
)
// Set your X-API-KEY with the API key from the Customer Area.
client := adyen.NewClient(&common.Config{
    Environment: common.TestEnv,
    ApiKey:      "[YOUR_X-API-KEY]",
})
// STATE_DATA is an object passed from the front end or client app, deserialized from JSON to a data structure.
req := STATE_DATA;
res, httpRes, err := client.Checkout.PaymentsDetails(&req)

Your next steps depend on whether the /payments/details response contains an action object:

 {
   "pspReference": "NC6HT9CRT65ZGN82",
   "resultCode": "Authorised"
 }

 {
   "pspReference": "KHQC5N7G84BLNK43",
   "refusalReason": "Not enough balance",
   "resultCode": "Refused"
 }

Step 6: Present the payment result

After the shopper completes the payment and no more further actions are required on the client app, use the resultCode to inform the shopper of the payment status.

For other possible resultCode values and recommended messages that you can present to your shopper, see Result codes.

Error handling

In case you encounter errors in your integration, refer to the following:

• API error codes: If you receive a non-HTTP 200 response, use the errorCode to troubleshoot and modify your request.
• Payment refusals: If you receive an HTTP 200 response with an Error or Refused resultCode, check the refusal reason and, if possible, modify your request.

Test and go live

Before going live, use our list of test cards and other payment methods to test your integration. We recommend testing each payment method that you intend to offer to your shoppers.

You can check the status of a test payment in your Customer Area, under Transactions > Payments.

To debug or troubleshoot test payments, you can also use API logs in your test environment.

When you are ready to go live, you need to:

1. Apply for a live account.
2. Assess your PCI DSS compliance, and submit the Self-Assessment Questionnaire-A.
3. Configure your live account.
4. Switch from test to our live endpoints.

5. Load Drop-in from one of our live environments and set the dropInComponent.environment to match your live endpoints:

   Endpoint region	environment value
   Europe	liveEurope
   Australia	liveAustralia
   US	liveUnitedStates

See also