Adding the payment source

How to add a payment source to an order


You have a pending order with a selected payment method that is associated with a payment integration. You want to give your customer the possibility to select one of the payment sources available from that gateway — e.g. a credit card — and use it to process the payment.


To add a payment source to an order, you have to create a payment source object and associate it with the order, as described in the Checkout guide.

pageAdding a payment source


1. Get the payment source type

The following request retrieves the attributes of the payment method associated with the order identified by the "qaMAhZkZvd" ID:

curl -g -X GET \
  '' \
  -H 'Authorization: Bearer your-access-token' \
  -H 'Accept: application/vnd.api+json'

2. Create the payment source and associate it with the order

The following request creates a payment object and associates it with the order identified by the "qaMAhZkZvd" ID:

curl -g -X POST \
  '' \
  -H 'Accept: application/vnd.api+json' \
  -H 'Authorization: Bearer your-access-token' \
  -H 'Content-Type: application/vnd.api+json' \
  -d '{
  "data": {
    "type": "checkout_com_payments",
    "attributes": {
      "payment_type": "token",
      "token": "tok_ubfj2q76miwundwlk72vxt2i7q"
    "relationships": {
      "order": {
        "data": {
          "type": "orders",
          "id": "qaMAhZkZvd"

Additional notes

Token generation payments require a token that represents the customer's encrypted payment data. The token is generated by client-side integration options such as Frames or Mobile SDKs.

Webhooks payments are asynchronous, which means the payment result it's notified by calling a webhook on Commerce Layer and updating the payment source data accordingly.

Webhooks creation and notification are managed by Commerce Layer and internally, you do not need any configuration on your side.

Preventing mismatched amount errors payments are asynchronous. You can authorize them using the _authorize trigger attribute of the order, or wait for Commerce Layer to do it automatically at the moment of the order placement (we strongly recommend following this latter workflow). Remember that in any case you need to collect the payment details to actually authorize the order. Until you do that the order status is still pending and so the order is still editable (i.e. the customer can add or remove items from the cart, changing its total amount). If this happens the order amount and the succeded authorization amount will differ, resulting in an error.

When implementing your checkout flow using please make sure the lapse of time between the order placement and authorization is as short as possible to prevent the order from being modified in the meantime.

Payment source nullification

If the payment method is associated with the order is changed previously created's payment sources are nullified and must be recreated. In this case, if the payment has already been authorized, the related authorization is voided and the order's payment status is set back from authorized to paid.

If a payment is authorized but the related order is not placed yet, the associated payment source cannot be changed. In some special cases (e.g. to give the user the possibility to change previously inserted credit card details) you may want to force the payment source nullification, even if the related payment is already authorized. To do that, you can leverage the _nullify_payment_source attribute of the order and manually trigger the payment source nullification, along with the related authorization void (if any) and payment status reset.

More to read

See our documentation if you need more information on how to retrieve an order, include associations, create or update a payment.

Last updated