Security News
Supply Chain Attack Detected in Solana's web3.js Library
A supply chain attack has been detected in versions 1.95.6 and 1.95.7 of the popular @solana/web3.js library.
airwallex-payment-elements
Advanced tools
[![Version](https://img.shields.io/npm/v/airwallex-payment-elements.svg)](https://www.npmjs.org/package/airwallex-payment-elements) [![semantic-release](https://img.shields.io/badge/%20%20%F0%9F%93%A6%F0%9F%9A%80-semantic--release-e10079.svg)](https://git
This airwallex-payment-elements library is a lightweight javascript SDK that allows merchants to conveniently integrate the Airwallex checkout flow on their website.
Check out our demo here.
Merchants can integrate airwallex-payment-elements in the checkout page on their site. For every checkout, merchants should create a PaymentIntent entity through the Airwallex API to process payments with Airwallex.
Once the PaymentIntent is successfully created via API integration, the API will return a response with a unique ID and client secret for the intent. Merchants can then use these two keys to enable the payment elements to collect payment attempt details.
The package includes different payment processing elements that will allow merchants ot accept payments on their site. We have 6 different checkout elements:
The primary focus of this library is Elements, which enables Merchants to collect sensitive information (PCI) using customizable UI elements. This library also provides a single interface for interacting with the Payment Request API, allowing for the tokenization of sensitive information and handling of 3D secure authentication flows.
Elements includes the following features:
Install with Yarn
yarn add airwallex-payment-elements
Or, with NPM
npm install airwallex-payment-elements
The Card element is one of Airwallex's most popular payment integration. It is a single line multi-input field containing card number, card expiry, and card cvc.
Detailed Card integration guide here. More extensive documentation details below
import Airwallex from 'airwallex-payment-elements';
Airwallex.loadAirwallex({
env: 'demo', // 'staging' | 'demo' | 'prod'
});
<div id="card"></div>
<div id="submit">Submit</div>
const cardElement = Airwallex.createElement('card', {
intent: {
// Required, Card uses intent Id and client_secret to prepare checkout
id: 'replace-with-your-intent-id',
client_secret: 'replace-with-your-client-secret',
},
});
cardElement.mount('card'); // Injects iFrame into element container
document.getElementById('submit').addEventListener('click', () => {
Airwallex.confirmPaymentIntent({
element: card, // Must link element
id: 'replace-with-your-intent-id', // Same as intent details from above
client_secret: 'replace-with-your-client-secret',
}).then((response) => {
// Listen to the payment confirmation response
window.alert(JSON.stringify(response));
});
});
}
onReady
, onChange
, onSuccess
, and onError
event listeners to handle various events received from the Airwallex Payment server.// Replace EVENT_TYPE with 'onReady', 'onChange', 'onSuccess', or 'onError'
window.addEventListener(EVENT_TYPE, (event) => {
/*
... Handle event
*/
window.alert(event.detail);
});
Each payment processing method requires different customizations. Check out our examples of web integrations with the airwallex-payment-demo library.
You also can play around with different elements in our framework specific sandboxes below. They're all based off the airwallex-payment-demo repository!
We want to provide you with a seamless experience integrating with our platform. Let us know if you run into any problems, or have any comments and suggestions for us. We value your input!
.
├── dist
│ ├── index.d.ts
│ ├── index.js
│ └── index.js.map
├── docs # GATSBY DOC PROJECT
│ ├── gatsby-config.js
│ ├── package.json
│ ├── plugins
│ ├── public
│ ├── scripts
│ ├── source
│ │ ├── basic-usage # MANUAL MAINTAINED BY DEVELOPERS
│ │ ├── index.mdx # TECHNICAL OVERVIEW
│ │ └── sdk-reference # GENERATED BY TYPEDOC
│ ├── src
│ ├── tsconfig.json
│ └── yarn.lock
├── src
│ ├── __snapshots__
│ ├── index.test.ts
│ └── index.ts
├── types
│ ├── airwallex.d.ts
│ ├── element.d.ts
├── package.json
├── tsconfig.json
├── .gitlab-ci.yml # ADD DOC PROJECT BUILD AND DEPLOYMENT STAGE
├── typedocconfig.js # TYPEDOC CONFIG
└── yarn.lock
FAQs
[![Version](https://img.shields.io/npm/v/airwallex-payment-elements.svg)](https://www.npmjs.org/package/airwallex-payment-elements) [![semantic-release](https://img.shields.io/badge/%20%20%F0%9F%93%A6%F0%9F%9A%80-semantic--release-e10079.svg)](https://git
The npm package airwallex-payment-elements receives a total of 8,047 weekly downloads. As such, airwallex-payment-elements popularity was classified as popular.
We found that airwallex-payment-elements demonstrated a healthy version release cadence and project activity because the last version was released less than a year ago. It has 0 open source maintainers collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Security News
A supply chain attack has been detected in versions 1.95.6 and 1.95.7 of the popular @solana/web3.js library.
Research
Security News
A malicious npm package targets Solana developers, rerouting funds in 2% of transactions to a hardcoded address.
Security News
Research
Socket researchers have discovered malicious npm packages targeting crypto developers, stealing credentials and wallet data using spyware delivered through typosquats of popular cryptographic libraries.