Introducing our brand new Rules Engine —
Read the docs
LogoLogo
Core APIOther APIsChangelog
How-tos
How-tos
  • Introduction
  • Product discovery
    • Product listing page
    • Product page
  • Placing orders
    • Shopping cart
      • Creating a shopping cart
      • Adding products to cart
      • Updating cart quantities
      • Removing products from cart
      • Displaying the cart summary
    • Checkout
      • Adding the customer
      • Adding a billing address
      • Adding a shipping address
      • Selecting a shipping method
      • Selecting a payment method
      • Adding a payment source
      • Adding a gift card or coupon
      • Placing the order
    • Subscriptions
      • Configuring a subscription model
      • Selecting the source order
      • Generating the subscriptions
      • Updating the subscriptions
    • Payments
      • Adyen
        • Adding the payment source
        • Sending back the payment details
        • Configuring the notification webhooks
        • Reusing the payment source
      • Axerve
        • Adding the payment source
        • Updating the payment intent
      • Braintree
        • Adding the payment source
        • Sending back the payment method nonce
        • Accepting local payments
        • Reusing the payment source
      • Checkout.com
        • Adding the payment source
        • Getting the payment details
        • Refreshing pending transactions
        • Reusing the payment source
      • Klarna
        • Adding the payment source
        • Sending back the authorization token
        • Reusing the payment source
      • PayPal
        • Adding the payment source
        • Preparing the payment for execution
      • Stripe
        • Adding the payment source
        • Refreshing the payment source
        • Reusing the payment source
      • Manual payments
        • Adding a wire transfer payment source
      • External payments
        • Adding the payment source
        • Reusing the payment source
    • Auto-capture
      • Enabling the auto-capture
      • Limiting the auto-capture amount
  • inventory
    • Inventory strategies
      • No split
      • Split shipments
      • Split by line items
      • Ship from first available (or primary)
      • Ship from primary
  • FAQ
    • Environments and initial setup
    • Authentication and access tokens
On this page
  • Problem
  • Solution
  1. Placing orders
  2. Checkout

Adding a payment source

How to add a payment source to the order

PreviousSelecting a payment methodNextAdding a gift card or coupon

Last updated 2 years ago

Problem

You have a pending order with a selected payment method and you want to give your customer the possibility to select a payment source — e.g. a credit card — to be used to pay for the order.

Solution

Generally speaking, the first step in any implementation of the flow is the creation of the payment source object and its association with the order. To do that, you need to know the payment source endpoint. If you don't, you need to retrieve the payment_source_type attribute value from the payment method associated with the order first.

1. Getting the payment source type

To get the payment source type, send a GET request to the /api/orders/:id endpoint, including the associated payment method, and read its payment_source_type attribute value from the response.

2. Creating the payment source object

To create the payment source object and associate it with the order, you need to send a POST request to an endpoint that is different for each payment source. That means you need to dynamically build the request URL based on the payment_source_type attribute value of the selected payment — i.e./api/:payment_source_type — and fill the request payload with the specific attributes required by each payment gateway and the relationship with the order.

The structure of the payment source object you receive in the response will differ based on the specific payment source type, because each payment gateway or service has a different integration pattern. As a consequence, the subsequent payment flow will be dependent on the specific payment source that is associated with the order.

Please refer to the payments guide for detailed information and examples, according to the payment gateway you're using.

Depending on the — defined by the payment method associated with the order — you need to follow a slightly different flow.

Make sure to set the payment as the last step of your checkout implementation to avoid possible issues due to payment source nullification (e.g. , , , ).

Payments
Klarna
Axerve
payment source type
A sample payment source selection
PayPal
Stripe