AMSElement

2026-04-17 09:24

Use the AMSElement class to create a Payment Element instance on the frontend page. When creating the instance, you need to pass configuration information, including the environment, language, and payment session data (paymentSessionData) obtained from the server. The instance can be used to embed payment components, initiate payments, and other operations.

Method signature

When calling this method, please use the following standard method signature format.

TypeScript

JavaScript

copy
new AMSElement(options: IElementOptions)

Parameters

Parameter	Data type	Required	Description
environment	String	No	It is used to pass in environmental information. Valid values are: `sandbox`: Sandbox environment. `prod`: Default value. Production environment.
locale	String	No	It is used to pass in language information. You can choose the value to pass based on the region of the payment method. Valid values are: `en_US`: Default value. English `pt_BR`: Portuguese (Brazil) `pt_PT`: Portuguese `es_ES`: Spanish `ko_KR`: Korean `zh_CN`: Simplified Chinese `zh_HK`: Traditional Chinese `ms_MY`: Malay `in_ID`: Indonesian `th_TH`: Thai `vi_VN`: Vietnamese `tl_PH`: Filipino `it_IT`: Italian `de_DE`: German `fr_FR`: French `nl_NL`: Dutch `ja_JP`: Japanese `ro`: Romanian `pl_PL`: Polish `ar_SA`: Arabic `tr_TR`: Turkish `hi_IN`: Hindi Note: If the parameter is omitted or contains an unsupported value, the system will default to English.
sessionData	String	Yes	Payment session data. Use this parameter to create the configuration object: Pass the full paymentSessionData parameter obtained from the createPaymentSession (One-time Payments) API response to this parameter.

Sample

CDN

copy
// Get the browser language
let language = navigator.language || navigator.userLanguage;
language = language.replace("-", "_"); // Replace "-" with "_"

// Create Payment Element instance
const elementPayment = new window.AMSElement({
    environment: "sandbox",
    locale: "en_US",
    sessionData:sessionData
})

npm

copy
import { AMSElement, ThemeType, PaymentElementLayout } from '@alipay/ams-checkout' // Package management

// Get the browser language
let language = navigator.language || navigator.userLanguage;
language = language.replace("-", "_"); // Replace "-" with "_"

// Create Payment Element instance
const elementPayment = new AMSElement({
    environment: "sandbox",
    locale: "en_US",
    sessionData:sessionData
})