Airwallex.js
Airwallex.js is a JavaScript library providing UI components and libraries that you can use to quickly and securely integrate with Airwallex products. For details on how to install and initialize Airwallex.js, see Getting started JS.
Development Resources
@airwallex/components-sdkNPM packageAirwallex.jsreference JS
Component Elements
@airwallex/components-sdk package contains many different types of Elements used for collecting information for various financial use cases.
| Component | Usage | Development resources |
|---|---|---|
| Payments | Provides payment elements to embed in the checkout flow for collecting payment details from the shopper using a specific payment method or via multiple payment method options. Note that Airwallex.js also supports the Hosted Payment Page solution using a redirect method. See Embedded vs. Hosted. |
|
| Payouts | Provides beneficiary and transfer elements to integrate the payout flow for international bank transfers. |
|
| Onboarding | Provides KYC and KYB elements to allow platforms to collect customer information required for account activation. |
|
| Risk | Provides various elements for risk assessment such as RFI (Request for Information) during customer account activation. |
|
| Compliance support | Provides various elements to comply with SCA (Strong Customer Authentication) in order to meet regulatory requirements. |
Embedded vs. Hosted
If you want to spend the least tech effort and want Airwallex to manage and maintain the solution for you then choose the Hosted solution. This integration redirects users to an Airwallex-hosted page where Airwallex handles the entire end-to-end user experience, as well as keeping the solution up to date with the latest Airwallex capabilities. For example, Hosted Payment Page is a payments acceptance solution where the shopper is redirected to a payment page hosted by Airwallex using the redirectToCheckout() JS method from Airwallex.js. Airwallex collects and stores the payment details and handles the payment processing from start to finish reducing merchant's PCI-DSS compliance costs.
However, if you want a bespoke solution with the flexibility to control the user experience including the look and feel then choose the Embedded Components solution. As an example, for payments acceptance, you can use individual Elements (Card, Apple Pay, Google Pay) as building blocks to create your own checkout experience or use the Drop-in Element to accept multiple payment methods, card or local payment methods, with a single integration. You will have the option to customize these payments Elements to match the design of your website.
Customization and styling
Each Element mounted in an iframe can be configured to match the design and appearance of your page. The layout of each Element stays consistent, but you can modify colours, fonts, borders, padding, and more. See Customization options.
Upgrading to Airwallex.js
Upgrade your legacy integration (Payment Elements , Payouts Web SDK ) to Airwallex.js to get access to new features. For more information, see upgrade to Airwallex.js.