This page explains how to add Sofort to your existing Web Components integration.
Requirements
Select which endpoint you are using:
API reference
You do not need to send additional fields for Sofort. To see optional fields that you can send for all payment methods, choose the endpoint you integrated:
- /sessions: This is the default with Components v5.0.0 or later.
- /payments: If you implemented an additional use case.
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:
<div id="directEbanking-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
.
const sofort = new Redirect(checkout, { type: 'directEbanking' }).mount('#directEbanking-container');
v5.x.x or earlier
Use the create
method of your AdyenCheckout
instance, in this case checkout
, to create the Component:
const sofortComponent = checkout.create('directEbanking').mount('#directEbanking-container');
Recurring payments
We support recurring transactions for Sofort through SEPA Direct Debit. To make recurring payments, you need to:
Create a token
We strongly recommend that you request explicit permission from the shopper if you intend to make recurring SEPA payments. Being transparent about the payment schedule and the charged amount reduces the risk of chargebacks.
To create a token, include in your /payments request:
storePaymentMethod
: true- shopperReference: Your unique identifier for the shopper (minimum length three characters).
When the payment has been settled, you receive a webhook containing:
eventCode
: RECURRING_CONTRACToriginalReference
: ThepspReference
of the initial payment.pspReference
: This is the token that you need to make recurring payments for this shopper.
Make sure that your server is able to receive RECURRING_CONTRACT as part of your standard webhooks. You can enable the RECURRING_CONTRACT event code in the webhook settings page.
Make a payment with a token
To make a payment with the token, include in your /payments request:
paymentMethod.storedPaymentMethodId
: ThepspReference
from the RECURRING_CONTRACT.
You can also get this value using the /listRecurringDetails endpoint.
shopperReference
: The unique shopper identifier that you specified when creating the token.shopperInteraction
: ContAuth.recurringProcessingModel
: Subscription or UnscheduledCardOnFile.
For more information about the shopperInteraction
and recurringProcessingModel
fields, refer to Tokenization.
Test and go live
Sofort does not have a specialized test environment. This means that you are redirected to the Sofort live environment even when making a payment from the Adyen test environment.
You can test successful and cancelled payments in EUR for Sofort. For other scenarios, use real payment details and small amounts in your live environment.
Test a successful payment
To test your integration, use the following details:
Bank Name | Account Number | Country/region | PIN | TAN |
---|---|---|---|---|
DemoBank | Use any value | DE | Use any value | Follow the instructions |
Using a different bank name (live data) will initiate a real payment. This payment will not be transferred to your account, and is therefore lost. It is not possible to reverse or refund this payment.
- Set the
paymentMethod
type
to directEbanking. This redirects you to the Sofort page. - Under Bank name, select Demo Bank, then Next.
- Enter any test login details for Account number and PIN, and select Next.
- Select an account, then Next.
- Enter any test TAN and select Next.
- To check the status of your test payment, go to your test Customer Area > Transactions > Payments.
Test a cancelled payment
- Set the
paymentMethod
type
to directEbanking. This redirects you to the Sofort page. - Under Bank name, select Demo Bank.
- Select Next.
- Select the icon.
- Select Cancel payment.
- To check the status of your test payment, go to your test Customer Area > Transactions > Payments.
Go live
To accept live Sofort payments, you must submit a request for Sofort in your live Customer Area.