@capacitor-community/stripe-terminal v6.2.1

@capacitor-community/stripe-terminal

Stripe SDK bindings for Capacitor Applications. This plugin is still in the RC (release candidate) phase. We have confirmed that it works well in the demo project. Please refer to https://github.com/capacitor-community/stripe/tree/main/demo/angular for the implementation.

Install

npm install @capacitor-community/stripe-terminal
npx cap sync

Web

No additional steps are necessary.

Note: Stripe Web SDK is beta version. So this plugin's implement is experimental. Please refer to https://github.com/stripe/terminal-js for more information.

iOS

• iOS Configure your app

Android

Add permissions to your android/app/src/main/AndroidManifest.xml file:

+ <uses-permission android:name="android.permission.ACCESS_FINE_LOCATION" />
+ <uses-permission android:name="android.permission.BLUETOOTH" android:maxSdkVersion="30" />
+ <uses-permission android:name="android.permission.BLUETOOTH_ADMIN" android:maxSdkVersion="30" />
+ <uses-permission android:name="android.permission.BLUETOOTH_SCAN" />
+ <uses-permission android:name="android.permission.BLUETOOTH_ADVERTISE" />
+ <uses-permission android:name="android.permission.BLUETOOTH_CONNECT" />

If used in conjunction with the @capacitor-community/stripe plugin, the following settings may be necessary

Add packagingOptions to your android/app/build.gradle file:

android {
...
+  packagingOptions {
+    resources.excludes.add("org/bouncycastle/x509/*")
+  }
}

And update minSdkVersion to 26 And compileSdkVersion to 34 in your android/app/build.gradle file:

  ext {
-    minSdkVersion = 22
-    compileSdkVersion = 33
+    minSdkVersion = 30
+    compileSdkVersion = 34

Usage

Simple collect payment

Use plugin client

(async ()=> {
  /**
   * tokenProviderEndpoint: The URL of your backend to provide a token. Use Post request to get a token.
   */
  await StripeTerminal.initialize({ tokenProviderEndpoint: 'https://example.com/token', isTest: true })
  const { readers } = await StripeTerminal.discoverReaders({
    type: TerminalConnectTypes.TapToPay,
    locationId: "**************",
  });
  await StripeTerminal.connectReader({
    reader: readers[0],
  });
  // Collect payment intent
  await StripeTerminal.collectPaymentMethod({ paymentIntent: "**************" });
  // Process and confirm payment intent
  await StripeTerminal.confirmPaymentIntent();
  // disconnect reader
  await StripeTerminal.disconnectReader();
});

set string token

(async ()=> {
  // run before StripeTerminal.initialize
  StripeTerminal.addListener(TerminalEventsEnum.RequestedConnectionToken, async () => {
    const { token } = (await fetch("https://example.com/token")).json();
    StripeTerminal.setConnectionToken({ token });
  });
});
(async ()=> {
  await StripeTerminal.initialize({ isTest: true })
  const { readers } = await StripeTerminal.discoverReaders({
    type: TerminalConnectTypes.TapToPay,
    locationId: "**************",
  });
  await StripeTerminal.connectReader({
    reader: readers[0],
  });
  // Collect payment intent
  await StripeTerminal.collectPaymentMethod({ paymentIntent: "**************" });
  // Process and confirm payment intent
  await StripeTerminal.confirmPaymentIntent();
  // disconnect reader
  await StripeTerminal.disconnectReader();
});

Listen device update

The device will if necessary automatically start updating itself. It is important to handle them as needed so as not to disrupt business operations.

(async ()=> {
  StripeTerminal.addListener(TerminalEventsEnum.ReportAvailableUpdate, async ({ update }) => {
    if (window.confirm("Will you update the device?")) {
      await StripeTerminal.installAvailableUpdate();
    }
  });
  StripeTerminal.addListener(TerminalEventsEnum.StartInstallingUpdate, async ({ update }) => {
    console.log(update);
    if (window.confirm("Will you interrupt the update?")) {
      StripeTerminal.cancelInstallUpdate();
    }
  });
  StripeTerminal.addListener(TerminalEventsEnum.ReaderSoftwareUpdateProgress, async ({ progress }) => {
    // be able to use this value to create a progress bar.
  });
  StripeTerminal.addListener(TerminalEventsEnum.FinishInstallingUpdate, async ({ update }) => {
    console.log(update);
  });
});

Get terminal processing information

For devices without leader screen, processing information must be retrieved and displayed on the mobile device. Get it with a listener.

/**
 * Listen battery level. If the battery level is low, you can notify the user to charge the device.
 */
StripeTerminal.addListener(TerminalEventsEnum.BatteryLevel, async ({ level, charging, status }) => {
  console.log(level, charging, status);
});

/**
 * Listen reader event. You can get the reader's status and display it on the mobile device.
 */
StripeTerminal.addListener(TerminalEventsEnum.ReaderEvent, async ({ event }) => {
  console.log(event);
});

/**
 * Listen display message. You can get the message to be displayed on the mobile device.
 */
StripeTerminal.addListener(TerminalEventsEnum.RequestDisplayMessage, async ({ messageType, message }) => {
  console.log(messageType, message);
});

/**
 * Listen reader input. You can get the message what can be used for payment.
 */
StripeTerminal.addListener(TerminalEventsEnum.RequestReaderInput, async ({ options, message }) => {
  console.log(options, message);
});

More details on the leader screen

The contents of the payment can be shown on the display. This requires a leader screen on the device. This should be run before collectPaymentMethod.

await StripeTerminal.setReaderDisplay({
  currency: 'usd',
  tax: 0,
  total: 1000,
  lineItems: [{
    displayName: 'winecode',
    quantity: 2,
    amount: 500
  }] as CartLineItem[],
})

// Of course, erasure is also possible.
await StripeTerminal.clearReaderDisplay();

Simulate reader status changes for testing

To implement updates, etc., we are facilitating an API to change the state of the simulator. This should be done before discoverReaders.

await StripeTerminal.setSimulatorConfiguration({ update: SimulateReaderUpdate.UpdateAvailable })

API

• initialize(...)
• discoverReaders(...)
• setConnectionToken(...)
• setSimulatorConfiguration(...)
• connectReader(...)
• getConnectedReader()
• disconnectReader()
• cancelDiscoverReaders()
• collectPaymentMethod(...)
• cancelCollectPaymentMethod()
• confirmPaymentIntent()
• installAvailableUpdate()
• cancelInstallUpdate()
• setReaderDisplay(...)
• clearReaderDisplay()
• rebootReader()
• cancelReaderReconnection()
• addListener(TerminalEventsEnum.Loaded, ...)
• addListener(TerminalEventsEnum.RequestedConnectionToken, ...)
• addListener(TerminalEventsEnum.DiscoveredReaders, ...)
• addListener(TerminalEventsEnum.ConnectedReader, ...)
• addListener(TerminalEventsEnum.DisconnectedReader, ...)
• addListener(TerminalEventsEnum.ConnectionStatusChange, ...)
• addListener(TerminalEventsEnum.UnexpectedReaderDisconnect, ...)
• addListener(TerminalEventsEnum.ConfirmedPaymentIntent, ...)
• addListener(TerminalEventsEnum.CollectedPaymentIntent, ...)
• addListener(TerminalEventsEnum.Canceled, ...)
• addListener(TerminalEventsEnum.Failed, ...)
• addListener(TerminalEventsEnum.ReportAvailableUpdate, ...)
• addListener(TerminalEventsEnum.StartInstallingUpdate, ...)
• addListener(TerminalEventsEnum.ReaderSoftwareUpdateProgress, ...)
• addListener(TerminalEventsEnum.FinishInstallingUpdate, ...)
• addListener(TerminalEventsEnum.BatteryLevel, ...)
• addListener(TerminalEventsEnum.ReaderEvent, ...)
• addListener(TerminalEventsEnum.RequestDisplayMessage, ...)
• addListener(TerminalEventsEnum.RequestReaderInput, ...)
• addListener(TerminalEventsEnum.PaymentStatusChange, ...)
• addListener(TerminalEventsEnum.ReaderReconnectStarted, ...)
• addListener(TerminalEventsEnum.ReaderReconnectSucceeded, ...)
• addListener(TerminalEventsEnum.ReaderReconnectFailed, ...)
• Interfaces
• Type Aliases
• Enums

initialize(...)

initialize(options: { tokenProviderEndpoint?: string; isTest: boolean; }) => Promise<void>

discoverReaders(...)

discoverReaders(options: { type: TerminalConnectTypes; locationId?: string; }) => Promise<{ readers: ReaderInterface[]; }>

Returns: Promise<{ readers: ReaderInterface[]; }>

setConnectionToken(...)

setConnectionToken(options: { token: string; }) => Promise<void>

setSimulatorConfiguration(...)

setSimulatorConfiguration(options: { update?: SimulateReaderUpdate; simulatedCard?: SimulatedCardType; simulatedTipAmount?: number; }) => Promise<void>

Stripe docs reference

connectReader(...)

connectReader(options: { reader: ReaderInterface; autoReconnectOnUnexpectedDisconnect?: boolean; merchantDisplayName?: string; onBehalfOf?: string; }) => Promise<void>

getConnectedReader()

getConnectedReader() => Promise<{ reader: ReaderInterface | null; }>

Returns: Promise<{ reader: ReaderInterface | null; }>

disconnectReader()

disconnectReader() => Promise<void>

cancelDiscoverReaders()

cancelDiscoverReaders() => Promise<void>

collectPaymentMethod(...)

collectPaymentMethod(options: { paymentIntent: string; }) => Promise<void>

cancelCollectPaymentMethod()

cancelCollectPaymentMethod() => Promise<void>

confirmPaymentIntent()

confirmPaymentIntent() => Promise<void>

installAvailableUpdate()

installAvailableUpdate() => Promise<void>

cancelInstallUpdate()

cancelInstallUpdate() => Promise<void>

setReaderDisplay(...)

setReaderDisplay(options: Cart) => Promise<void>

clearReaderDisplay()

clearReaderDisplay() => Promise<void>

rebootReader()

rebootReader() => Promise<void>

cancelReaderReconnection()

cancelReaderReconnection() => Promise<void>

addListener(TerminalEventsEnum.Loaded, ...)

addListener(eventName: TerminalEventsEnum.Loaded, listenerFunc: () => void) => Promise<PluginListenerHandle>

Returns: Promise<PluginListenerHandle>

addListener(TerminalEventsEnum.RequestedConnectionToken, ...)

addListener(eventName: TerminalEventsEnum.RequestedConnectionToken, listenerFunc: () => void) => Promise<PluginListenerHandle>

Returns: Promise<PluginListenerHandle>

addListener(TerminalEventsEnum.DiscoveredReaders, ...)

addListener(eventName: TerminalEventsEnum.DiscoveredReaders, listenerFunc: ({ readers }: { readers: ReaderInterface[]; }) => void) => Promise<PluginListenerHandle>

Returns: Promise<PluginListenerHandle>

addListener(TerminalEventsEnum.ConnectedReader, ...)

addListener(eventName: TerminalEventsEnum.ConnectedReader, listenerFunc: () => void) => Promise<PluginListenerHandle>

Returns: Promise<PluginListenerHandle>

addListener(TerminalEventsEnum.DisconnectedReader, ...)

addListener(eventName: TerminalEventsEnum.DisconnectedReader, listenerFunc: ({ reason }: { reason?: DisconnectReason | undefined; }) => void) => Promise<PluginListenerHandle>

Emitted when the reader is disconnected, either in response to disconnectReader() or some connection error.

For all reader types, this is emitted in response to disconnectReader() without a reason property.

For Bluetooth and USB readers, this is emitted with a reason property when the reader disconnects.

Note: For Bluetooth and USB readers, when you call disconnectReader(), this event will be emitted twice: one without a reason in acknowledgement of your call, and again with a reason when the reader finishes disconnecting.

Returns: Promise<PluginListenerHandle>

addListener(TerminalEventsEnum.ConnectionStatusChange, ...)

addListener(eventName: TerminalEventsEnum.ConnectionStatusChange, listenerFunc: ({ status }: { status: ConnectionStatus; }) => void) => Promise<PluginListenerHandle>

Emitted when the Terminal's connection status changed.

Note: You should not use this method to detect when a reader unexpectedly disconnects from your app, as it cannot be used to accurately distinguish between expected and unexpected disconnect events.

To detect unexpected disconnects (e.g. to automatically notify your user), you should instead use the UnexpectedReaderDisconnect event.

Stripe docs reference

Returns: Promise<PluginListenerHandle>

addListener(TerminalEventsEnum.UnexpectedReaderDisconnect, ...)

addListener(eventName: TerminalEventsEnum.UnexpectedReaderDisconnect, listenerFunc: ({ reader }: { reader: ReaderInterface; }) => void) => Promise<PluginListenerHandle>

The Terminal disconnected unexpectedly from the reader.

In your implementation of this method, you may want to notify your user that the reader disconnected. You may also call discoverReaders() to begin scanning for readers, and attempt to automatically reconnect to the disconnected reader. Be sure to either set a timeout or make it possible to cancel calls to discoverReaders()

When connected to a Bluetooth or USB reader, you can get more information about the disconnect by implementing the DisconnectedReader event.

Stripe docs reference

Returns: Promise<PluginListenerHandle>

addListener(TerminalEventsEnum.ConfirmedPaymentIntent, ...)

addListener(eventName: TerminalEventsEnum.ConfirmedPaymentIntent, listenerFunc: () => void) => Promise<PluginListenerHandle>

Returns: Promise<PluginListenerHandle>

addListener(TerminalEventsEnum.CollectedPaymentIntent, ...)

addListener(eventName: TerminalEventsEnum.CollectedPaymentIntent, listenerFunc: () => void) => Promise<PluginListenerHandle>

Returns: Promise<PluginListenerHandle>

addListener(TerminalEventsEnum.Canceled, ...)

addListener(eventName: TerminalEventsEnum.Canceled, listenerFunc: () => void) => Promise<PluginListenerHandle>

Emitted when cancelCollectPaymentMethod() is called and succeeds. The Promise returned by cancelCollectPaymentMethod() will also be resolved.

Returns: Promise<PluginListenerHandle>

addListener(TerminalEventsEnum.Failed, ...)

addListener(eventName: TerminalEventsEnum.Failed, listenerFunc: () => void) => Promise<PluginListenerHandle>

Emitted when either collectPaymentMethod() or confirmPaymentIntent() fails. The Promise returned by the relevant call will also be rejected.

Returns: Promise<PluginListenerHandle>

addListener(TerminalEventsEnum.ReportAvailableUpdate, ...)

addListener(eventName: TerminalEventsEnum.ReportAvailableUpdate, listenerFunc: ({ update, }: { update: ReaderSoftwareUpdateInterface; }) => void) => Promise<PluginListenerHandle>

Emitted when a software update is available for the connected reader.

Returns: Promise<PluginListenerHandle>

addListener(TerminalEventsEnum.StartInstallingUpdate, ...)

addListener(eventName: TerminalEventsEnum.StartInstallingUpdate, listenerFunc: ({ update, }: { update: ReaderSoftwareUpdateInterface; }) => void) => Promise<PluginListenerHandle>

Only applicable to Bluetooth and USB readers.

Emitted when the connected reader begins installing a software update. If a mandatory software update is available when a reader first connects, that update is automatically installed. The update will be installed before ConnectedReader is emitted and before the Promise returned by connectReader() resolves. In this case, you will receive this sequence of events:

1. StartInstallingUpdate
2. ReaderSoftwareUpdateProgress (repeatedly)
3. FinishInstallingUpdates
4. ConnectedReader
5. connectReader() Promise resolves

Your app should show UI to the user indiciating that a software update is being installed to explain why connecting is taking longer than usual.

Stripe docs reference

Returns: Promise<PluginListenerHandle>

addListener(TerminalEventsEnum.ReaderSoftwareUpdateProgress, ...)

addListener(eventName: TerminalEventsEnum.ReaderSoftwareUpdateProgress, listenerFunc: ({ progress }: { progress: number; }) => void) => Promise<PluginListenerHandle>

Only applicable to Bluetooth and USB readers.

Emitted periodically while reader software is updating to inform of the installation progress. progress is a float between 0 and 1.

Stripe docs reference

Returns: Promise<PluginListenerHandle>

addListener(TerminalEventsEnum.FinishInstallingUpdate, ...)

addListener(eventName: TerminalEventsEnum.FinishInstallingUpdate, listenerFunc: (args: { update: ReaderSoftwareUpdateInterface; } | { error: string; }) => void) => Promise<PluginListenerHandle>

Only applicable to Bluetooth and USB readers.

Stripe docs reference

Returns: Promise<PluginListenerHandle>

addListener(TerminalEventsEnum.BatteryLevel, ...)

addListener(eventName: TerminalEventsEnum.BatteryLevel, listenerFunc: ({ level, charging, status, }: { level: number; charging: boolean; status: BatteryStatus; }) => void) => Promise<PluginListenerHandle>

Only applicable to Bluetooth and USB readers.

Emitted upon connection and every 10 minutes.

Stripe docs reference

Returns: Promise<PluginListenerHandle>

addListener(TerminalEventsEnum.ReaderEvent, ...)

addListener(eventName: TerminalEventsEnum.ReaderEvent, listenerFunc: ({ event }: { event: ReaderEvent; }) => void) => Promise<PluginListenerHandle>

Only applicable to Bluetooth and USB readers.

Stripe docs reference

Returns: Promise<PluginListenerHandle>

addListener(TerminalEventsEnum.RequestDisplayMessage, ...)

addListener(eventName: TerminalEventsEnum.RequestDisplayMessage, listenerFunc: ({ messageType, message, }: { messageType: ReaderDisplayMessage; message: string; }) => void) => Promise<PluginListenerHandle>

Only applicable to Bluetooth and USB readers.

Emitted when the Terminal requests that a message be displayed in your app.

Stripe docs reference

Returns: Promise<PluginListenerHandle>

addListener(TerminalEventsEnum.RequestReaderInput, ...)

addListener(eventName: TerminalEventsEnum.RequestReaderInput, listenerFunc: ({ options, message, }: { options: ReaderInputOption[]; message: string; }) => void) => Promise<PluginListenerHandle>

Only applicable to Bluetooth and USB readers.

Emitted when the reader begins waiting for input. Your app should prompt the customer to present a source using one of the given input options. If the reader emits a message, the RequestDisplayMessage event will be emitted.

Stripe docs reference

Returns: Promise<PluginListenerHandle>

addListener(TerminalEventsEnum.PaymentStatusChange, ...)

addListener(eventName: TerminalEventsEnum.PaymentStatusChange, listenerFunc: ({ status }: { status: PaymentStatus; }) => void) => Promise<PluginListenerHandle>

Stripe docs reference

Returns: Promise<PluginListenerHandle>

addListener(TerminalEventsEnum.ReaderReconnectStarted, ...)

addListener(eventName: TerminalEventsEnum.ReaderReconnectStarted, listenerFunc: ({ reader, reason, }: { reader: ReaderInterface; reason: string; }) => void) => Promise<PluginListenerHandle>

Returns: Promise<PluginListenerHandle>

addListener(TerminalEventsEnum.ReaderReconnectSucceeded, ...)

addListener(eventName: TerminalEventsEnum.ReaderReconnectSucceeded, listenerFunc: ({ reader }: { reader: ReaderInterface; }) => void) => Promise<PluginListenerHandle>

Returns: Promise<PluginListenerHandle>

addListener(TerminalEventsEnum.ReaderReconnectFailed, ...)

addListener(eventName: TerminalEventsEnum.ReaderReconnectFailed, listenerFunc: ({ reader }: { reader: ReaderInterface; }) => void) => Promise<PluginListenerHandle>

Returns: Promise<PluginListenerHandle>

Interfaces

PluginListenerHandle

Type Aliases

ReaderInterface

{ / The unique serial number is primary identifier inner plugin. / serialNumber: string; label: string; batteryLevel: number; batteryStatus: BatteryStatus; simulated: boolean; id: number; availableUpdate: ReaderSoftwareUpdateInterface; locationId: string; ipAddress: string; status: NetworkStatus; location: LocationInterface; locationStatus: LocationStatus; deviceType: DeviceType; deviceSoftwareVersion: string | null; / iOS Only properties. These properties are not available on Android. / isCharging: number; / Android Only properties. These properties are not available on iOS. / baseUrl: string; bootloaderVersion: string; configVersion: string; emvKeyProfileId: string; firmwareVersion: string; hardwareVersion: string; macKeyProfileId: string; pinKeyProfileId: string; trackKeyProfileId: string; settingsVersion: string; pinKeysetId: string; / @deprecated This property has been deprecated and should use the serialNumber property. / index?: number; }

ReaderSoftwareUpdateInterface

{ deviceSoftwareVersion: string; estimatedUpdateTime: UpdateTimeEstimate; requiredAt: number; }

LocationInterface

{ id: string; displayName: string; address: { city: string; country: string; postalCode: string; line1: string; line2: string; state: string; }; ipAddress: string; }

DeviceType

Stripe.Terminal.Reader.DeviceType

Cart

{ currency: string; tax: number; total: number; lineItems: CartLineItem[]; }

CartLineItem

{ displayName: string; quantity: number; amount: number; }

Enums

BatteryStatus

UpdateTimeEstimate

NetworkStatus

LocationStatus

DeviceType

TerminalConnectTypes

SimulateReaderUpdate

SimulatedCardType

TerminalEventsEnum

DisconnectReason

ConnectionStatus

ReaderEvent

ReaderDisplayMessage

ReaderInputOption

PaymentStatus