Payments

For platforms that do not have an integrated payment processor, our drop-in component can handle collecting payment information. There are 2 types of configurations you can enable to handle payments. Both of these options will keep your platform out of PCI-scope related issues as card data will not move through your systems.

Tokenizing Payment Methods

The recommended approach to using payments in our drop-in component is to simply use our library to tokenize the customers payment method. The following is an example of configuration to accept payment methods in the drop-in component. For tokenizing payment methods, you need to utilize the tokenizePaymentMethod action.

const config = {
  payments: {
    enabled: true
  },
  ...
}

It's important to note that in general, all calls to our purchase API should be made by your platform's backend services. The following is an example sequence diagram that follows this pattern. The exception to this pattern is creating short-lived customer client tokens. The process for creating and using short-lived client tokens is described here.

Purchase Button

Adding the purchase button will allow you to completely encompass the purchase flow into the drop-in component, but would be disconnected from your platform's standard payment workflow.

const config = {
  payments: {
    enabled: true,
    button: true
  },
  ...
}