---
title: "Scalapay Component"
description: "Add Scalapay to an existing Components integration."
url: "https://docs.adyen.com/payment-methods/scalapay/web-component"
source_url: "https://docs.adyen.com/payment-methods/scalapay/web-component.md"
canonical: "https://docs.adyen.com/payment-methods/scalapay/web-component"
last_modified: "2019-09-06T17:19:00+02:00"
language: "en"
---

# Scalapay Component

Add Scalapay to an existing Components integration.

[View source](/payment-methods/scalapay/web-component.md)

This page explains how to add Scalapay to your existing Components integration.

## Requirements

Select the [server-side flow](/online-payments/build-your-integration) that your integration uses:

### Tab: Sessions flow

| Requirement          | Description                                                                                                                                                                                                  |
| -------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ |
| **Integration type** | Make sure that you have built a Sessions flow [Components integration](/online-payments/build-your-integration/sessions-flow?platform=%7B%7BgetParameter%28%27platform%27%29%7D%7D\&integration=Components). |
| **Setup steps**      | Before you begin, [add Scalapay in your Customer Area](/payment-methods/add-payment-methods).                                                                                                                |

### Tab: Advanced flow

| Requirement          | Description                                                                                                                                                                                                   |
| -------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| **Integration type** | Make sure that you have built an Advanced flow [Components integration](/online-payments/build-your-integration/advanced-flow?platform=%7B%7BgetParameter%28%27platform%27%29%7D%7D\&integration=Components). |
| **Setup steps**      | Before you begin, [add Scalapay in your Customer Area](/payment-methods/add-payment-methods).                                                                                                                 |

Activating Scalapay defaults the pricing to our standard pricing. Adyen offers Enterprise pricing for merchants with sufficient volume. Before activating Scalapay, contact your account manager to verify if you are eligible.

## API reference

Select which endpoint you are using:

### Tab: `/sessions`

This is the default with [Components v5.0.0](/online-payments/web-components) or later.

| Parameter name                                                                                               | Required                                                                                    | Description                                                              |
| ------------------------------------------------------------------------------------------------------------ | ------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------ |
| [countryCode](https://docs.adyen.com/api-explorer/Checkout/latest/post/sessions#request-countryCode)         | ![-white\_check\_mark-](/user/data/smileys/emoji/white_check_mark.png "-white_check_mark-") | The shopper's two-letter country code: **IT**, **FR**, **PT** or **ES**. |
| [shopperName](https://docs.adyen.com/api-explorer/Checkout/latest/post/sessions#request-shopperName)         | ![-white\_check\_mark-](/user/data/smileys/emoji/white_check_mark.png "-white_check_mark-") | The shopper's `firstName` and `lastName`.                                |
| [billingAddress](https://docs.adyen.com/api-explorer/Checkout/latest/post/sessions#request-billingAddress)   |                                                                                             | The shopper's billing address.                                           |
| [deliveryAddress](https://docs.adyen.com/api-explorer/Checkout/latest/post/sessions#request-deliveryAddress) |                                                                                             | The delivery address for the goods purchased.                            |
| [lineItems](https://docs.adyen.com/api-explorer/Checkout/latest/post/sessions#request-lineItems)             |                                                                                             | Price and product information about the purchased items.                 |

### Tab: `/payments`

If you implemented an [additional use case](/online-payments/build-your-integration).

| Parameter name                                                                                                                                                           | Required                                                                                    | Description                                                                                                                                                                                                                                         |
| ------------------------------------------------------------------------------------------------------------------------------------------------------------------------ | ------------------------------------------------------------------------------------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| [countryCode](https://docs.adyen.com/api-explorer/Checkout/latest/post/payments#request-countryCode)                                                                     | ![-white\_check\_mark-](/user/data/smileys/emoji/white_check_mark.png "-white_check_mark-") | The shopper's two-letter country code: **IT**, **FR**, **PT** or **ES**.                                                                                                                                                                            |
| [shopperName](https://docs.adyen.com/api-explorer/Checkout/latest/post/payments#request-shopperName)                                                                     | ![-white\_check\_mark-](/user/data/smileys/emoji/white_check_mark.png "-white_check_mark-") | The shopper's `firstName` and `lastName`.                                                                                                                                                                                                           |
| [billingAddress](https://docs.adyen.com/api-explorer/Checkout/latest/post/payments#request-billingAddress)                                                               |                                                                                             | The shopper's billing address.                                                                                                                                                                                                                      |
| [deliveryAddress](https://docs.adyen.com/api-explorer/Checkout/latest/post/payments#request-deliveryAddress)                                                             |                                                                                             | The delivery address for the goods purchased.                                                                                                                                                                                                       |
| [lineItems](https://docs.adyen.com/api-explorer/Checkout/latest/post/payments#request-lineItems)                                                                         |                                                                                             | Price and product information about the purchased items.                                                                                                                                                                                            |
| [additionalData.airline.flight\_date](https://docs.adyen.com/api-explorer/Checkout/latest/post/payments#request-additionalData-AdditionalDataAirline)                    |                                                                                             | Optional for flights: provide the outbound flight date and time. Format: `YYYY-MM-DD hh:mm`. For example **2025-03-11 22:14**. Provide either `additionalData.airline.flight_date` or `additionalData.lodging.checkInDate` in the same transaction. |
| [additionalData.lodging.checkInDate](https://docs.adyen.com/api-explorer/Checkout/latest/post/payments#request-additionalData-AdditionalDataLodging-lodging-checkInDate) |                                                                                             | Optional for lodging: provide the check in date for lodging. Format: `YYYYMMDD`. For example **20251101**. Provide either `additionalData.airline.flight_date` or `additionalData.lodging.checkInDate` in the same transaction.                     |

The following example uses `countryCode`: **IT** and `paymentMethod.type`: **scalapay\_3x**.

#### curl

```bash
curl https://checkout-test.adyen.com/v72/payments \
-H 'x-api-key: ADYEN_API_KEY' \
-H 'content-type: application/json' \
-d '{
  "merchantAccount":"YOUR_MERCHANT_ACCOUNT",
  "reference":"YOUR_ORDER_NUMBER",
  "countryCode":"IT",
  "paymentMethod": {
    "type":"scalapay_3x"
  },
  "amount":{
    "currency":"EUR",
    "value":1000
  },
  "shopperName": {
     "firstName":"Simone",
     "lastName":"Hopper"
  },
  "returnUrl":"https://your-company.example.com/checkout?shopperOrder=12xy.."
}'
```

#### Java

```java
// Adyen Java API Library v28.2.0
import com.adyen.Client;
import com.adyen.enums.Environment;
import com.adyen.model.checkout.*;
import java.time.OffsetDateTime;
import java.util.*;
import com.adyen.model.RequestOptions;
import com.adyen.service.checkout.*;

// For the live environment, additionally include your liveEndpointUrlPrefix.
Client client = new Client("ADYEN_API_KEY", Environment.TEST);

// Create the request object(s)
Amount amount = new Amount()
  .currency("EUR")
  .value(1000L);

Name name = new Name()
  .firstName("Simone")
  .lastName("Hopper");

PaymentDetails paymentDetails = new PaymentDetails()
  .type(PaymentDetails.TypeEnum.SCALAPAY_3X);

PaymentRequest paymentRequest = new PaymentRequest()
  .reference("YOUR_ORDER_NUMBER")
    .countryCode("IT")
  .amount(amount)
  .shopperName(name)
  .merchantAccount("YOUR_MERCHANT_ACCOUNT")
  .paymentMethod(new CheckoutPaymentMethod(paymentDetails))
  .returnUrl("https://your-company.example.com/checkout?shopperOrder=12xy..");

// Send the request
PaymentsApi service = new PaymentsApi(client);
PaymentResponse response = service.payments(paymentRequest, new RequestOptions().idempotencyKey("UUID"));
```

#### PHP

```php
// Adyen PHP API Library v20.1.0
use Adyen\Client;
use Adyen\Environment;
use Adyen\Model\Checkout\Amount;
use Adyen\Model\Checkout\Name;
use Adyen\Model\Checkout\CheckoutPaymentMethod;
use Adyen\Model\Checkout\PaymentRequest;
use Adyen\Service\Checkout\PaymentsApi;

$client = new Client();
$client->setXApiKey("ADYEN_API_KEY");
// For the live environment, additionally include your liveEndpointUrlPrefix.
$client->setEnvironment(Environment::TEST);


// Create the request object(s)
$amount = new Amount();
$amount
  ->setCurrency("EUR")
  ->setValue(1000);

$name = new Name();
$name
  ->setFirstName("Simone")
  ->setLastName("Hopper");

$checkoutPaymentMethod = new CheckoutPaymentMethod();
$checkoutPaymentMethod
  ->setType("scalapay_3x");

$paymentRequest = new PaymentRequest();
$paymentRequest
  ->setReference("YOUR_ORDER_NUMBER")
  ->setCountryCode("IT")
  ->setAmount($amount)
  ->setShopperName($name)
  ->setMerchantAccount("YOUR_MERCHANT_ACCOUNT")
  ->setPaymentMethod($checkoutPaymentMethod)
  ->setReturnUrl("https://your-company.example.com/checkout?shopperOrder=12xy..");

$requestOptions['idempotencyKey'] = 'UUID';

// Send the request
$service = new PaymentsApi($client);
$response = $service->payments($paymentRequest, $requestOptions);
```

#### C\#

```cs
// Adyen .net API Library v19.1.0
using Adyen;
using Environment = Adyen.Model.Environment;
using Adyen.Model;
using Adyen.Model.Checkout;
using Adyen.Service.Checkout;

// For the live environment, additionally include your liveEndpointUrlPrefix.
var config = new Config()
{
    XApiKey = "ADYEN_API_KEY",
    Environment = Environment.Test
};
var client = new Client(config);

// Create the request object(s)
Amount amount = new Amount
{
  Currency = "EUR",
  Value = 1000
};

Name name = new Name
{
  FirstName = "Simone",
  LastName = "Hopper"
};

PaymentDetails paymentDetails = new PaymentDetails
{
  Type = PaymentDetails.TypeEnum.Scalapay3x
};

PaymentRequest paymentRequest = new PaymentRequest
{
  Reference = "YOUR_ORDER_NUMBER",
  countryCode = "IT",
  Amount = amount,
  ShopperName = name,
  MerchantAccount = "YOUR_MERCHANT_ACCOUNT",
  PaymentMethod = new CheckoutPaymentMethod(paymentDetails),
  ReturnUrl = "https://your-company.example.com/checkout?shopperOrder=12xy.."
};

// Send the request
var service = new PaymentsService(client);
var response = service.Payments(paymentRequest, requestOptions: new RequestOptions { IdempotencyKey = "UUID"});
```

#### NodeJS (JavaScript)

```js
// Adyen Node API Library v19.2.0
// Require the parts of the module you want to use
const { Client, CheckoutAPI } = require('@adyen/api-library');
// Initialize the client object
// For the live environment, additionally include your liveEndpointUrlPrefix.
const client = new Client({apiKey: "ADYEN_API_KEY", environment: "TEST"});

// Create the request object(s)
const paymentRequest = {
  merchantAccount: "YOUR_MERCHANT_ACCOUNT",
  reference: "YOUR_ORDER_NUMBER",
  countryCode: "IT",
  paymentMethod: {
    type: "scalapay_3x"
  },
  amount: {
    currency: "EUR",
    value: 1000
  },
  shopperName: {
    firstName: "Simone",
    lastName: "Hopper"
  },
  returnUrl: "https://your-company.example.com/checkout?shopperOrder=12xy.."
}

// Send the request
const checkoutAPI = new CheckoutAPI(client);
const response = checkoutAPI.PaymentsApi.payments(paymentRequest, { idempotencyKey: "UUID" });
```

#### Go

```go
// Adyen Go API Library v12.1.0
import (
  "context"
  "github.com/adyen/adyen-go-api-library/v9/src/common"
  "github.com/adyen/adyen-go-api-library/v9/src/adyen"
  "github.com/adyen/adyen-go-api-library/v9/src/checkout"
)
// For the live environment, additionally include your liveEndpointUrlPrefix.
client := adyen.NewClient(&common.Config{
  ApiKey:      "ADYEN_API_KEY",
  Environment: common.TestEnv,
})

// Create the request object(s)
amount := checkout.Amount{
  Currency: "EUR",
  Value: 1000,
}

name := checkout.Name{
  FirstName: "Simone",
  LastName: "Hopper",
}

paymentDetails := checkout.PaymentDetails{
  Type: common.PtrString("scalapay_3x"),
}

paymentRequest := checkout.PaymentRequest{
  countryCode: "IT",
  Reference: "YOUR_ORDER_NUMBER",
  Amount: amount,
  ShopperName: &name,
  MerchantAccount: "YOUR_MERCHANT_ACCOUNT",
  PaymentMethod: checkout.PaymentDetailsAsCheckoutPaymentMethod(&paymentDetails),
  ReturnUrl: "https://your-company.example.com/checkout?shopperOrder=12xy..",
}

// Send the request
service := client.Checkout()
req := service.PaymentsApi.PaymentsInput().IdempotencyKey("UUID").PaymentRequest(paymentRequest)
res, httpRes, err := service.PaymentsApi.Payments(context.Background(), req)
```

#### Python

```py
# Adyen Python API Library v12.7.0
import Adyen

adyen = Adyen.Adyen()
adyen.client.xapikey = "ADYEN_API_KEY"
# For the live environment, additionally include your liveEndpointUrlPrefix.
adyen.client.platform = "test" # The environment to use library in.

# Create the request object(s)
json_request = {
  "merchantAccount": "YOUR_MERCHANT_ACCOUNT",
  "reference": "YOUR_ORDER_NUMBER",
  "countryCode": "IT",
  "paymentMethod": {
    "type": "scalapay_3x"
  },
  "amount": {
    "currency": "EUR",
    "value": 1000
  },
  "shopperName": {
    "firstName": "Simone",
    "lastName": "Hopper"
  },
  "returnUrl": "https://your-company.example.com/checkout?shopperOrder=12xy.."
}

# Send the request
result = adyen.checkout.payments_api.payments(request=json_request, idempotency_key="UUID")
```

#### Ruby

```rb
# Adyen Ruby API Library v9.7.1
require "adyen-ruby-api-library"

adyen = Adyen::Client.new
adyen.api_key = 'ADYEN_API_KEY'
# For the live environment, additionally include your liveEndpointUrlPrefix.
adyen.env = :test # Set to "live" for live environment

# Create the request object(s)
request_body = {
  :merchantAccount => 'YOUR_MERCHANT_ACCOUNT',
  :reference => 'YOUR_ORDER_NUMBER',
  :countryCode => 'IT',
  :paymentMethod => {
    :type => 'scalapay_3x'
  },
  :amount => {
    :currency => 'EUR',
    :value => 1000
  },
  :shopperName => {
    :firstName => 'Simone',
    :lastName => 'Hopper'
  },
  :returnUrl => 'https://your-company.example.com/checkout?shopperOrder=12xy..'
}

# Send the request
result = adyen.checkout.payments_api.payments(request_body, headers: { 'Idempotency-Key' => 'UUID' })
```

#### NodeJS (TypeScript)

```ts
// Adyen Node API Library v19.2.0
// Require the parts of the module you want to use
import { Client, CheckoutAPI, Types } from "@adyen/api-library";
// Initialize the client object
// For the live environment, additionally include your liveEndpointUrlPrefix.
const client = new Client({apiKey: "ADYEN_API_KEY", environment: "TEST"});

// Create the request object(s)
const amount: Types.checkout.Amount = {
  currency: "EUR",
  value: 1000
};

const name: Types.checkout.Name = {
  firstName: "Simone",
  lastName: "Hopper"
};

const paymentDetails: Types.checkout.PaymentDetails = {
  type: Types.checkout.PaymentDetails.TypeEnum.Scalapay3x
};

const paymentRequest: Types.checkout.PaymentRequest = {
  reference: "YOUR_ORDER_NUMBER",
  countryCode: "IT",
  amount: amount,
  shopperName: name,
  merchantAccount: "YOUR_MERCHANT_ACCOUNT",
  paymentMethod: paymentDetails,
  returnUrl: "https://your-company.example.com/checkout?shopperOrder=12xy.."
};

// Send the request
const checkoutAPI = new CheckoutAPI(client);
const response = checkoutAPI.PaymentsApi.payments(paymentRequest, { idempotencyKey: "UUID" });
```

## Component configuration

### Step 1: Create a DOM element

Create a DOM element on your checkout page, placing it where you want the payment method form to be rendered:

```html
 <div id="scalapay_3x-container"></div>
```

### Step 2: Create an instance of the Component

#### v6.0.0 or later

Create an instance of the Component, passing:

* Your instance of `AdyenCheckout`.

```js
const scalapay = new Redirect(checkout, { type: 'scalapay_3x' }).mount('#scalapay_3x-container');
```

**

#### v5.x.x or earlier

Use the `create` method of your `AdyenCheckout` instance, in this case `checkout`, to create the Component:

```js
const scalapayComponent = checkout.create('scalapay_3x').mount('#scalapay_3x-container');
```

## Test and go live

Use the test cards for the test scenarios that are specified on the [Scalapay website](https://developers.scalapay.com/docs/test-the-order-flow).

Check the status of Scalapay test payments in your [Customer Area](https://ca-test.adyen.com/) > **Transactions** > **Payments**.

Before you can accept live Scalapay payments, [submit a request for Scalapay](/payment-methods/add-payment-methods) in your [live Customer Area](https://ca-live.adyen.com/).

## See also

* [Web Components integration guide](/online-payments/components-web)
* [Webhooks](/development-resources/webhooks)
* [Tokenization for recurring payments](/online-payments/tokenization)
* [API Explorer](https://docs.adyen.com/api-explorer/#/CheckoutService/latest/overview)
