Skip to content

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.

src/app/app.component.ts
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.