Initialize to your project
Import Stripe and call initialize with a publishable key. Do this once per JavaScript runtime, before you create or present any payment UI.
import { Stripe } from '@capacitor-community/stripe';
export async function initialize(): Promise<void> {
await Stripe.initialize({
publishableKey: 'Your Publishable Key',
});
}
method initialize(...)
Configures the Stripe SDK. Call this once before using any payment method.
initialize(opts: StripeInitializationOptions) => Promise<void>
interface StripeInitializationOptions
| Prop | Type | Description | Since |
|---|---|---|---|
publishableKey |
string |
Stripe publishable key for the account that creates the client-side payment UI. Never pass a secret key to the client application. | 3.0.0 |
stripeAccount |
string |
Connected account ID used when making client-side calls on behalf of a Stripe Connect account. | 3.0.0 |
Create a publishable key in the Stripe Dashboard. Never ship the secret key to the client.
Stripe Connect
Set optional stripeAccount to make plugin API calls for a connected account.
await Stripe.initialize({
publishableKey: 'Your Publishable Key',
stripeAccount: 'acct_xxxxxxxxxxxxx',
});
On Android, Google Pay can also read com.getcapacitor.community.stripe.stripe_account from application metadata. See Google Pay.
handleURLCallback
handleURLCallback is iOS only. Use it with returnURL on PaymentSheet or PaymentFlow so Stripe can finish 3D Secure after the customer returns from the bank page.
await Stripe.createPaymentSheet({
paymentIntentClientSecret,
returnURL: 'your-app://stripe-redirect',
});
// Call from the iOS URL open handler with the returned URL.
await Stripe.handleURLCallback({ url });
method handleURLCallback(...)
Passes an incoming return URL back to the Stripe SDK after redirect-based
authentication.
iOS only. Call this from your app URL handler when Stripe redirects back
to the application.
handleURLCallback(opts: StripeURLHandlingOptions) => Promise<void>
interface StripeURLHandlingOptions
| Prop | Type | Description | Since |
|---|---|---|---|
url |
string |
Full callback URL received by the application. | 4.0.0 |
The method is not implemented on Android or web. If Stripe did not handle the URL, the promise rejects and you should continue with your normal deep-link handling.
Example
Angular
Initialize from the root component. See Angular.
import { Component } from '@angular/core';
import { Stripe } from '@capacitor-community/stripe';
@Component({
selector: 'app-root',
templateUrl: 'app.component.html',
styleUrls: ['app.component.scss'],
})
export class AppComponent {
constructor() {
void Stripe.initialize({
publishableKey: 'Your Publishable Key',
});
}
}
React
CapacitorStripeProvider initializes the plugin for you. See React.