{"title":"Directory Lookup","category":"default","creationDate":1776961627,"content":"
\n

Hosted Payment Pages are no longer available<\/strong><\/p>\n

To accept payments through an Adyen-hosted page, use our Hosted Checkout<\/a>.<\/p>\n

This page is for the classic Hosted Payment Pages (HPP) integration, which has reached end-of-life. We are no longer processing transactions though HPP.<\/p>\n<\/div><\/div>\n

Learn how to accept local payment methods\u00a0(such as direct bank transfer, ewallets, or mobile payments) using the Directory Lookup integration.<\/p>\n

\n

With Directory Lookup, you\u00a0can fetch the available payment methods from Adyen. In return, the\u00a0plataforma de pagamentos da Adyen\u00a0responds with a list of cards and\u00a0local payment methods<\/a>\u00a0supported for the specified payment amount in the current region.<\/p>\n

\n

Enable payment methods<\/strong><\/p>

Local payment methods vary per country or region.
\nFor more information, see payment methods<\/a>.<\/p><\/div><\/div>\n\n

Use this payment data to dynamically generate a customized payment page allowing the shopper to complete their\u00a0purchase using a targeted selection of payment methods.<\/p>\n

After selecting a payment method, the shopper is redirected to the payment method's\u00a0page (for example, iDEAL or Sofort) and completes the payment.<\/p>\n

Following any payment request, Adyen sends back a webhook event<\/a> providing the status of the payment.<\/p>\n

Overview<\/h2>\n

The flow of a payment using a local payment method is illustrated in the diagram below:<\/p>\n

\"\"\u00a0<\/p>\n

Requirements<\/h2>\n

To process local payment methods, create a new\u00a0skin<\/a>\u00a0and\u00a0style the form to let your\u00a0shopper\u00a0select a\u00a0payment method:<\/p>\n

    \n
  1. Go to\u00a0Customer Area<\/a>\u00a0>\u00a0Account<\/strong>\u00a0>\u00a0Skins<\/strong>\u00a0>\u00a0Create a new skin\u2028.<\/strong><\/li>\n
  2. Add the skin description.<\/li>\n
  3. Generate the HMAC keys\u00a0for the test and live platforms\u00a0(remember to take a note of this key) and click\u00a0Save<\/strong>.<\/li>\n
  4. Select the skin from the list and click\u00a0Test<\/strong>\u00a0from the menu bar to verify that\u00a0Currently on Test<\/strong>\u00a0shows the version information in green.<\/li>\n<\/ol>\n

    Step 1: Request local payment methods<\/h2>\n

    To retrieve a list of available local payment methods\u00a0make\u00a0a POST request to the\u00a0directory.shtml<\/code>\u00a0endpoint\u00a0with the fields in the code example. For Adyen to verify the authenticity of the request\u00a0calculate the signature<\/a>\u00a0of the request and include this in the\u00a0merchantSig<\/code>\u00a0field.<\/p>\n

    The example below shows how to make such a request. For additional fields and more details for the payment methods request, refer to the\u00a0API Reference<\/a>.\u2028\u2028\u00a0<\/p>\n

    curl https:\/\/test.adyen.com\/hpp\/directory.shtml \\\n -d countryCode=DE \\\n -d currencyCode=EUR \\\n -d merchantAccount=YOUR_MERCHANT_ACCOUNT \\\n -d merchantReference=Test_directory_lookup \\\n -d paymentAmount=2000 \\\n -d sessionValidity=2017-12-25T10%3A31%3A06Z \\\n -d skinCode=sH9qpMyS \\\n -d merchantSig=94AwPXSxs0ECicXi1UDdKEmdzHQ6rf7EF9CC%2FzUO5Tg%3D<\/code><\/pre>\n
    \n
    All the fields mentioned in the request example (currencyCode<\/code>,\u00a0merchantAccount<\/code>,\u00a0paymentAmount<\/code>, skinCode<\/code>, merchantReference<\/code>, sessionValidity<\/code> and merchantSig<\/code>), except countryCode<\/code>, are mandatory.<\/p>\n
    We recommended that you provide the countryCode<\/code> field, to accurately state the actual location of the payment, so that the correct payment methods for that location are retrieved.<\/p>\n<\/div><\/div>\n
    Step 2: Display local payment methods<\/h2>\n
    The directory lookup returns the available payment methods for the shopper based on the country\/region they are shopping from, the amount and currency and skin code you provided. The returned data is a JSON object containing an array with the\u00a0payment methods.\u00a0You can parse the response and provide the list of payment methods to your shopper.<\/p>\n
    Version 1<\/h3>\n
    A response returns a JSON object containing a list of applicable\u00a0payment methods.\u00a0Each payment method has a\u00a0name<\/code>,\u00a0brandCode<\/code>,\u00a0and optionally, a list of issuers (depending on the payment method). In this case, the\u00a0issuerId<\/code>\u00a0identifies a specific issuer and can be used to direct a shopper to the related\u00a0method's webpage.\u2028\u2028<\/p>\n
    When parsing this response, you can format and display the methods according to your design if you like.<\/p>\n
    {\n   \"paymentMethods\":[\n      {\n         \"brandCode\":\"ideal\",\n         \"name\":\"iDEAL\",\n         \"issuers\":[\n            {\n               \"issuerId\":\"1121\",\n               \"name\":\"Test Issuer\"\n            },\n            {\n               \"issuerId\":\"1152\",\n               \"name\":\"Test Issuer 3\"\n            },\n            {\n               \"issuerId\":\"1151\",\n               \"name\":\"Test Issuer 2\"\n            }\n         ]\n      },\n      {\n         \"brandCode\":\"sepadirectdebit\",\n         \"name\":\"SEPA Direct Debit\"\n      },\n      {\n         \"brandCode\":\"klarna\",\n         \"name\":\"Klarna Invoice\"\n      },\n      {\n         \"brandCode\":\"boku\",\n         \"name\":\"Boku\"\n      },\n      {\n         \"brandCode\":\"paysafecard\",\n         \"name\":\"Paysafecard\"\n      },\n      {\n         \"brandCode\":\"paypal\",\n         \"name\":\"PayPal\"\n      }\n   ]\n}<\/code><\/pre>\n
    Version 2<\/h3>\n
    In case you made a directory lookup request to version 2 (https:\/\/test.adyen.com\/hpp\/directory\/v2.shtml<\/a>), each payment method also returns the\u00a0logos<\/code>\u00a0field containing links to normal, small, and tiny images.<\/p>\n
    \u00a0{\n   \"paymentMethods\":[\n      {\n         \"brandCode\":\"paypal\",\n         \"logos\":{\n            \"normal\":\"http:\\\/\\\/test\\\/hpp\\\/img\\\/pm\\\/paypal.png\",\n            \"small\":\"http:\\\/\\\/test\\\/hpp\\\/img\\\/pm\\\/paypal_small.png\",\n            \"tiny\":\"http:\\\/\\\/test\\\/hpp\\\/img\\\/pm\\\/paypal_tiny.png\"\n         },\n         \"name\":\"PayPal\"\n      },\n      {\n         \"brandCode\":\"amex\",\n         \"logos\":{\n            \"normal\":\"http:\\\/\\\/test\\\/hpp\\\/img\\\/pm\\\/amex.png\",\n            \"small\":\"http:\\\/\\\/test\\\/hpp\\\/img\\\/pm\\\/amex_small.png\",\n            \"tiny\":\"http:\\\/\\\/test\\\/hpp\\\/img\\\/pm\\\/amex_tiny.png\"\n         },\n         \"name\":\"American Express\"\n      },\n      {\n         \"brandCode\":\"ideal\",\n         \"issuers\":[\n            {\n               \"issuerId\":\"1121\",\n               \"name\":\"Test Issuer\"\n            },\n            {\n               \"issuerId\":\"1154\",\n               \"name\":\"Test Issuer 5\"\n            }\n         ],\n         \"logos\":{\n            \"normal\":\"http:\\\/\\\/test\\\/hpp\\\/img\\\/pm\\\/ideal.png\",\n            \"small\":\"http:\\\/\\\/test\\\/hpp\\\/img\\\/pm\\\/ideal_small.png\",\n            \"tiny\":\"http:\\\/\\\/test\\\/hpp\\\/img\\\/pm\\\/ideal_tiny.png\"\n         },\n         \"name\":\"iDEAL\"\n      },\n      {\n         \"brandCode\":\"mc\",\n         \"logos\":{\n            \"normal\":\"http:\\\/\\\/test\\\/hpp\\\/img\\\/pm\\\/mc.png\",\n            \"small\":\"http:\\\/\\\/test\\\/hpp\\\/img\\\/pm\\\/mc_small.png\",\n            \"tiny\":\"http:\\\/\\\/test\\\/hpp\\\/img\\\/pm\\\/mc_tiny.png\"\n         },\n         \"name\":\"MasterCard\"\n      }\n   ]\n}<\/code><\/pre>\n
    Step 3: Submit a payment request<\/h2>\n
    After your shopper selects the local payment method, make a POST request including the brandCode<\/code> and issuerId<\/code> (if available) of the selected payment method.\u2028\u2028 Recalculate the signature of your payment request with the brandCode<\/code> and issuerId<\/code> as extra fields and post the request to the\u00a0skipDetails.shtml<\/code>\u00a0endpoint. Your shopper is then redirected to the selected local method to finalize the\u00a0payment.\u2028\u2028\u2028<\/p>\n
    \n
    Some payment methods restrict WebView in the app for security reasons. We recommend using the following if you want to display local payment method in your app:<\/p>\n