On this page, you can find additional configuration for adding MobilePay to your Components integration.
Before you begin
This page assumes you have already:
API reference
Select which endpoint you're integrating:
This is the default with Components v5.0.0 or later.
| Parameter name | Required | Description |
|---|---|---|
| telephoneNumber | If you already have your shopper's phone number, send it in the request so they no longer have to provide this later when they're redirected to MobilePay. |
For a full list of optional fields that you can send for all payment methods, see /sessions.
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="mobilepay-container"></div>Step 2: Create an instance of the Component
Use the create method of your AdyenCheckout instance, in this case checkout, to create the Component:
const mobilePayComponent = checkout.create('mobilepay').mount('#mobilepay-container');Test and go live
Once you've set up your payment form to show MobilePay and completed your payment method integration, you can test the payment flow.
We recommend that you do a penny test using a live MobilePay account in your live Customer Area, as this is the fastest way to test your integration.
Live penny test (recommended)
- Make sure you have access to a live MobilePay account that is coupled with a Visa, Mastercard, or Dankort account, and a valid phone number.
- Submit a request for MobilePay in your live Customer Area.
- After MobilePay is added to your Customer Area, make a payment for a minimal amount choosing MobilePay as the payment method.
- Check the status of the test payment in your live Customer Area > Transactions > Payments.
Go live
Before you can accept live MobilePay payments, you need to submit a request for MobilePay in your live Customer Area.