.paymentRequestWithCardForm(options) -> Promise
Opens the Add Card view to to accept a payment. On success the
returned object is a PaymentMethod
options (iOS only) — An object with the following keys:
| Key | Type | Description | ||||
|---|---|---|---|---|---|---|
| requiredBillingAddressFields | String | The billing address fields the user must fill out when prompted for their payment details. Can be one of: **full | name | zip** or left unspecified to disable | ||
| prefilledInformation | Object | You can set this property to pre-fill any information you’ve already collected from your user | ||||
| theme | Object | Can be used to visually style Stripe-provided UI |
options.prefilledInformation — An object with the following keys:
| Key | Type | Description |
|---|---|---|
| String | The user’s email address | |
| phone | String | The user’s phone number |
| billingAddress | Object | The user’s billing address. When set, the add card form will be filled with this address |
options.prefilledInformation.billingAddress — An object with the following keys:
| Key | Type | Description |
|---|---|---|
| name | String | The user’s full name (e.g. "Jane Doe") |
| line1 | String | The first line of the user’s street address (e.g. "123 Fake St") |
| line2 | String | The apartment, floor number, etc of the user’s street address (e.g. "Apartment 1A") |
| city | String | The city in which the user resides (e.g. "San Francisco") |
| state | String | The state in which the user resides (e.g. "CA") |
| postalCode | String | The postal code in which the user resides (e.g. "90210") |
| country | String | The ISO country code of the address (e.g. "US") |
| phone | String | The phone number of the address (e.g. "8885551212") |
| String | The email of the address (e.g. "jane@doe.com") |
options.theme — An object with the following keys:
| Key | Type | Description |
|---|---|---|
| primaryBackgroundColor | String | The primary background color of this theme |
| secondaryBackgroundColor | String | The secondary background color of this theme |
| primaryForegroundColor | String | The primary foreground color of this theme. This will be used as the text color for any important labels in a view with this theme (such as the text color for a text field that the user needs to fill out) |
| secondaryForegroundColor | String | The secondary foreground color of this theme. This will be used as the text color for any supplementary labels in a view with this theme (such as the placeholder color for a text field that the user needs to fill out) |
| accentColor | String | The accent color of this theme - it will be used for any buttons and other elements on a view that are important to highlight |
| errorColor | String | The error color of this theme - it will be used for rendering any error messages or view |
Example
const options = {
requiredBillingAddressFields: 'full',
prefilledInformation: {
billingAddress: {
name: 'Gunilla Haugeh',
line1: 'Canary Place',
line2: '3',
city: 'Macon',
state: 'Georgia',
country: 'US',
postalCode: '31217',
},
},
}
const paymentMethod = await stripe.paymentRequestWithCardForm(options)
// Application-specific code
// api.sendPaymentMethodToBackend(paymentMethod)