--- title: "Walley Component" description: "Add Walley to an existing Components integration." url: "https://docs.adyen.com/payment-methods/walley/web-component" source_url: "https://docs.adyen.com/payment-methods/walley/web-component.md" canonical: "https://docs.adyen.com/payment-methods/walley/web-component" last_modified: "2026-05-24T12:54:31+02:00" language: "en" --- # Walley Component Add Walley to an existing Components integration. [View source](/payment-methods/walley/web-component.md) This page explains how to add Walley to your existing Web Components integration. ## Requirements | Requirement | Description | | -------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | | **Integration type** | Make sure that you have built your [Components integration](/online-payments/build-your-integration/sessions-flow?platform=Web\&integration=Components%2F%3Ftarget%3D_blank). Walley for Web requires at least v3.23.0 of Components. | | **Setup steps** | Before you begin, contact our [Support Team](https://ca-test.adyen.com/ca/ca/contactUs/support.shtml?form=other) to add Walley in your test Customer Area. | ## API reference ### Tab: `/sessions` You must include the following fields when making a [/sessions](https://docs.adyen.com/api-explorer/Checkout/latest/post/sessions) request: | Parameter name | Required | Description | | -------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | | [telephoneNumber](https://docs.adyen.com/api-explorer/Checkout/latest/post/sessions#request-telephoneNumber) | ![-white\_check\_mark-](/user/data/smileys/emoji/white_check_mark.png "-white_check_mark-") | The shopper's telephone number. You must collect a working mobile phone number (including country code) from the customer. Incorrect or missing numbers will fail Walley's validation. | | [shopperEmail](https://docs.adyen.com/api-explorer/Checkout/latest/post/sessions#request-shopperEmail) | ![-white\_check\_mark-](/user/data/smileys/emoji/white_check_mark.png "-white_check_mark-") | The shopper's email address. | | [company.name](https://docs.adyen.com/api-explorer/Checkout/latest/post/sessions#request-company-name) | ![-white\_check\_mark-](/user/data/smileys/emoji/white_check_mark.png "-white_check_mark-") | The name of the company making the payment. This will be prefilled and presented to the shopper on Walley's payment form. Only required for **walley\_b2b** payments. | | [company.registrationNumber](https://docs.adyen.com/api-explorer/Checkout/latest/post/sessions#request-company-registrationNumber) | | Only relevant to business-to-business payments. The registration number of the company making the payment. | | [lineItems.id](https://docs.adyen.com/api-explorer/Checkout/latest/post/sessions#request-lineItems-id) | ![-white\_check\_mark-](/user/data/smileys/emoji/white_check_mark.png "-white_check_mark-") | The ID of the line item. | | [lineItems.description](https://docs.adyen.com/api-explorer/Checkout/latest/post/sessions#request-lineItems-description) | ![-white\_check\_mark-](/user/data/smileys/emoji/white_check_mark.png "-white_check_mark-") | A description of the line item. Maximum length: 50 characters. | | [lineItems.amountExcludingTax](https://docs.adyen.com/api-explorer/Checkout/latest/post/sessions#request-lineItems-amountExcludingTax) | ![-white\_check\_mark-](/user/data/smileys/emoji/white_check_mark.png "-white_check_mark-") | The item amount excluding the tax, in minor units. | | [lineItems.taxAmount](https://docs.adyen.com/api-explorer/Checkout/latest/post/sessions#request-lineItems-taxAmount) | ![-white\_check\_mark-](/user/data/smileys/emoji/white_check_mark.png "-white_check_mark-") | The tax amount, in minor units. | | [lineItems.taxPercentage](https://docs.adyen.com/api-explorer/Checkout/latest/post/sessions#request-lineItems-taxPercentage) | ![-white\_check\_mark-](/user/data/smileys/emoji/white_check_mark.png "-white_check_mark-") | The tax percentage, in minor units. | | [lineItems.quantity](https://docs.adyen.com/api-explorer/Checkout/latest/post/sessions#request-lineItems-quantity) | ![-white\_check\_mark-](/user/data/smileys/emoji/white_check_mark.png "-white_check_mark-") | The number of items. | ### Tab: `/payments` You must include the following fields when making a [/payments](https://docs.adyen.com/api-explorer/Checkout/latest/post/payments) request: | Parameter name | Required | Description | | -------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | | [telephoneNumber](https://docs.adyen.com/api-explorer/Checkout/latest/post/payments#request-telephoneNumber) | ![-white\_check\_mark-](/user/data/smileys/emoji/white_check_mark.png "-white_check_mark-") | The shopper's telephone number. You must collect a working mobile phone number (including country code) from the customer. Incorrect or missing numbers will fail Walley's validation. | | [shopperEmail](https://docs.adyen.com/api-explorer/Checkout/latest/post/payments#request-shopperEmail) | ![-white\_check\_mark-](/user/data/smileys/emoji/white_check_mark.png "-white_check_mark-") | The shopper's email address. | | [company.name](https://docs.adyen.com/api-explorer/Checkout/latest/post/payments#request-company-name) | ![-white\_check\_mark-](/user/data/smileys/emoji/white_check_mark.png "-white_check_mark-") | The name of the company making the payment. This will be prefilled and presented to the shopper on Walley's payment form. Only required for **walley\_b2b** payments. | | [company.registrationNumber](https://docs.adyen.com/api-explorer/Checkout/latest/post/payments#request-company-registrationNumber) | | Only relevant to business-to-business payments. The registration number of the company making the payment. | | [lineItems.id](https://docs.adyen.com/api-explorer/Checkout/latest/post/payments#request-lineItems-id) | ![-white\_check\_mark-](/user/data/smileys/emoji/white_check_mark.png "-white_check_mark-") | The ID of the line item. | | [lineItems.description](https://docs.adyen.com/api-explorer/Checkout/latest/post/payments#request-lineItems-description) | ![-white\_check\_mark-](/user/data/smileys/emoji/white_check_mark.png "-white_check_mark-") | A description of the line item. Maximum length: 50 characters. | | [lineItems.amountExcludingTax](https://docs.adyen.com/api-explorer/Checkout/latest/post/payments#request-lineItems-amountExcludingTax) | ![-white\_check\_mark-](/user/data/smileys/emoji/white_check_mark.png "-white_check_mark-") | The item amount excluding the tax, in minor units. | | [lineItems.taxAmount](https://docs.adyen.com/api-explorer/Checkout/latest/post/payments#request-lineItems-taxAmount) | ![-white\_check\_mark-](/user/data/smileys/emoji/white_check_mark.png "-white_check_mark-") | The tax amount, in minor units. | | [lineItems.taxPercentage](https://docs.adyen.com/api-explorer/Checkout/latest/post/payments#request-lineItems-taxPercentage) | ![-white\_check\_mark-](/user/data/smileys/emoji/white_check_mark.png "-white_check_mark-") | The tax percentage, in minor units. | | [lineItems.quantity](https://docs.adyen.com/api-explorer/Checkout/latest/post/payments#request-lineItems-quantity) | ![-white\_check\_mark-](/user/data/smileys/emoji/white_check_mark.png "-white_check_mark-") | The number of items. | #### curl ```bash curl https://checkout-test.adyen.com/v72/payments \ -H 'x-api-key: ADYEN_API_KEY' \ -H 'content-type: application/json' \ -d '{ "merchantAccount":"ADYEN_MERCHANT_ACCOUNT", "reference":"YOUR_ORDER_NUMBER", "amount":{ "currency":"EUR", "value":1000 }, "paymentMethod":{ "type":"" }, "countryCode": "NO", "shopperLocale": "no_NO", "telephoneNumber": "+46 840 839 298", "shopperEmail":"youremail@email.com", "returnUrl":"https://your-company.example.com/checkout?shopperOrder=12xy..", "lineItems":[ { "quantity":"1", "amountExcludingTax":"331", "taxPercentage":"2100", "description":"Shoes", "id":"Item #1", "taxAmount":"69" }, { "quantity":"1", "amountExcludingTax":"400", "taxPercentage":"2100", "description":"Shirt", "id":"Item #2", "taxAmount":"72" } ] }' ``` #### Java ```java // Set YOUR_X-API-KEY with the API key from the Customer Area. // Change to Environment.LIVE and add the Live URL prefix when you are ready to accept live payments. Client client = new Client("ADYEN_API_KEY", Environment.TEST); Checkout checkout = new Checkout(client); PaymentsRequest paymentsRequest = new PaymentsRequest(); String merchantAccount = "ADYEN_MERCHANT_ACCOUNT"; paymentsRequest.setMerchantAccount(merchantAccount); Amount amount = new Amount(); amount.setCurrency("EUR"); amount.setValue(1000L); paymentsRequest.setAmount(amount); DefaultPaymentMethodDetails paymentMethodDetails = new DefaultPaymentMethodDetails(); paymentMethodDetails.setType(""); paymentsRequest.setPaymentMethod(paymentMethodDetails); paymentsRequest.setReference("YOUR_ORDER_NUMBER"); paymentsRequest.setReturnUrl("https://your-company.example.com/checkout?shopperOrder=12xy.."); paymentsRequest.setCountryCode("NO"); paymentsRequest.setShopperLocale("no_NO"); paymentsRequest.setTelephoneNumber("+46 840 839 298"); paymentsRequest.setShopperEmail("youremail@email.com"); List lineItems = new ArrayList<>(); lineItems.add( new LineItem() .quantity(1L) .taxPercentage(2100L) .description("Shoes") .id("Item #1") .amountExcludingTax(331L) .taxAmount(69L) ); paymentsRequest.setLineItems(lineItems); PaymentsResponse paymentsResponse = checkout.payments(paymentsRequest); ``` #### PHP ```php // SET YOUR ADYEN_API_KEY with the API key from the Customer Area. $client = new \Adyen\Client(); $client->setXApiKey("ADYEN_API_KEY"); $service = new \Adyen\Service\Checkout($client); $params = array( "amount" => array( "currency" => "EUR", "value" => 1000 ), "reference" => "YOUR_ORDER_NUMBER", "paymentMethod" => array( "type" => "" ), "countryCode" => "NO", "shopperLocale" => "no_NO", "telephoneNumber" => "+46 840 839 298", "shopperEmail" => "youremail@email.com", "returnUrl" => "https://your-company.example.com/checkout?shopperOrder=12xy..", "merchantAccount" => "ADYEN_MERCHANT_ACCOUNT", "lineItems" => [ [ "quantity" => "1", "taxPercentage" => "2100", "description" => "Shoes", "id" => "Item #1", "amountExcludingTax" => "400", "taxAmount" => "69" ] ] ); $result = $service->payments($params); ``` #### C\# ```cs // SET YOUR ADYEN_API_KEY with the API key from the Customer Area. var client = new Client ("ADYEN_API_KEY", Environment.Test); var checkout = new Checkout(client); var amount = new Model.Checkout.Amount("EUR", 1000); var details = new Model.Checkout.DefaultPaymentMethodDetails{ Type = "" }; var paymentRequest = new Adyen.Model.Checkout.PaymentRequest { Reference = "YOUR_ORDER_NUMBER", Amount = amount, ReturnUrl = @"https://your-company.example.com/checkout?shopperOrder=12xy..", MerchantAccount = "ADYEN_MERCHANT_ACCOUNT", PaymentMethod = details, CountryCode = "NO", ShopperLocale = "no_NO", TelephoneNumber = "+46 840 839 298", ShopperEmail = "youremail@email.com", LineItems = new List { new LineItem(quantity:1, taxPercentage:2100, description:"Shoes", id:"Item #1", amountExcludingTax:331, taxAmount:69) }; var paymentResponse = checkout.Payments(paymentsRequest); ``` #### NodeJS (JavaScript) ```js // Adyen Node API Library v16.1.0 // Require the parts of the module you want to use const { Client, CheckoutAPI } = require('@adyen/api-library'); // Initialize the client object const client = new Client({apiKey: "ADYEN_API_KEY", environment: "TEST"}); // Create the request object const paymentRequest = { merchantAccount: "ADYEN_MERCHANT_ACCOUNT", reference: "YOUR_ORDER_NUMBER", amount: { currency: "EUR", value: 1000 }, paymentMethod: { type: "" }, lineItems: [ { quantity: "1", taxPercentage: "2100", description: "Shoes", id: "Item #1", amountExcludingTax: "331", taxAmount: "69" }, { quantity: "1", taxPercentage: "2100", description: "Shirt", id: "Item #2", amountExcludingTax: "400", taxAmount: "72" } ], countryCode: "NO", shopperLocale: "no_NO", telephoneNumber: "+46 840 839 298", shopperEmail: "youremail@email.com", returnUrl: "https://your-company.example.com/checkout?shopperOrder=12xy.." } // Make the request const checkoutAPI = new CheckoutAPI(client); const response = checkoutAPI.PaymentsApi.payments(paymentRequest, { idempotencyKey: "UUID" }); ``` #### Python ```py # Adyen Python API Library v12.0.0 import Adyen adyen = Adyen.Adyen() adyen.client.xapikey = "ADYEN_API_KEY" adyen.client.platform = "test" # The environment to use library in. json_request = { "merchantAccount": "ADYEN_MERCHANT_ACCOUNT", "reference": "YOUR_ORDER_NUMBER", "amount": { "currency": "EUR", "value": 1000 }, "paymentMethod": { "type": "" }, "countryCode": "NO", "shopperLocale": "no_NO", "telephoneNumber": "+46 840 839 298", "shopperEmail": "youremail@email.com", "returnUrl": "https://your-company.example.com/checkout?shopperOrder=12xy..", "lineItems": [ { "quantity": "1", "amountExcludingTax": "331", "taxPercentage": "2100", "description": "Shoes", "id": "Item #1", "taxAmount": "69" } ] } result = adyen.checkout.payments_api.payments(request=json_request, idempotency_key="UUID") ``` #### Ruby ```rb # Adyen Ruby API Library v9.1.0 require "adyen-ruby-api-library" adyen = Adyen::Client.new adyen.api_key = 'ADYEN_API_KEY' adyen.env = :test # Set to "live" for live environment request_body = { :merchantAccount => 'YOUR_MERCHANT_ACCOUNT', :reference => 'YOUR_ORDER_NUMBER', :amount => { :currency => 'EUR', :value => 1000 }, :paymentMethod => { :type => '' }, :countryCode => 'NO', :shopperLocale => 'no_NO', :telephoneNumber => '+46 840 839 298', :shopperEmail => 'youremail@email.com', :returnUrl => 'https://your-company.example.com/checkout?shopperOrder=12xy..', :lineItems => [ { :quantity => '1', :amountExcludingTax => '331', :taxPercentage => '2100', :description => 'Shoes', :id => 'Item #1', :taxAmount => '69' } ] } result = adyen.checkout.payments_api.payments(request_body, headers: { 'Idempotency-Key' => '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
``` ### 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 walley = new Redirect(checkout, { type: 'walley' }).mount('#walley-container'); ``` ** #### v5.x.x or earlier Use the `create` method of your `AdyenCheckout` instance, in this case `checkout`, to create the Component: ```js const walleyComponent = checkout.create('walley').mount('#walley-container'); ``` ## Test and go live You can perform the test scenarios described on [Walley's technical documentation](https://dev.walleypay.com/docs/checkout/test-data) using Adyen's [/payments](https://docs.adyen.com/api-explorer/Checkout/latest/post/payments) endpoint. Consider the following: * Include the `CivRegNo` as the [socialSecurityNumber](https://docs.adyen.com/api-explorer/Checkout/latest/post/payments#request-socialSecurityNumber). * When testing a Walley B2B transaction, provide the company information as shown in the following example: ```json "company": { "name": "Adyen N.V.", "registrationNumber": "5562000116" } ``` Check the status of Walley verification payments in your **Customer Area** > **Transactions** > **Payments**. ## See also * [Web Components integration guide](/online-payments/build-your-integration/sessions-flow?platform=Web\&integration=Components) * [Webhooks](/development-resources/webhooks) * [API Explorer](https://docs.adyen.com/api-explorer/#/CheckoutService/latest/overview)