# Flows by payment type

Each payment method must follow a specific payment flow to ensure a seamless payment process. The payment flows and corresponding payment methods outlined below follow Digital River's recommended best practices.

## Standard payment flow

Use the following flow for standard payments: [Apple Pay](https://docs.digitalriver.com/commerce-api/payments/supported-payment-methods/apple-pay), [credit cards](https://docs.digitalriver.com/commerce-api/payments/supported-payment-methods/credit-cards), and [Google Pay](https://docs.digitalriver.com/commerce-api/payments/supported-payment-methods/google-pay).&#x20;

1. [Create the shopper token](https://docs.digitalriver.com/commerce-api/shopper-apis/shopper-basics/common-use-cases/creating-a-customer).
2. [Apply the shopper and their billing address to a cart](https://www.digitalriver.com/docs/commerce-shopper-api/#tag/Apply-Shopper/paths/~1v1~1shoppers~1me~1carts~1active~1apply-shopper/post).&#x20;
3. [Create a source using DigitalRiver.js](https://docs.digitalriver.com/commerce-api/payments-solutions/digitalriver.js/payment-methods/konbini#step-2-create-a-konbini-source-using-digitalriver.js). The source `state` is `chargeable`.
4. [Attach the source to the cart](#attaching-multiple-payment-sources-to-the-cart).
5. [Submit the cart](https://docs.digitalriver.com/commerce-api/shopper-apis/cart/submitting-a-cart).

## Delayed payment flow

### Submit a Konbini payment flow

Use the following flow for delayed payments, such as [Konbini](https://docs.digitalriver.com/commerce-api/payments/supported-payment-methods/konbini).&#x20;

1. Get the store details.
2. [Create a source using DigitalRiver.js](https://docs.digitalriver.com/commerce-api/payments-solutions/digitalriver.js/payment-methods/konbini#step-2-create-a-konbini-source-using-digitalriver.js). The source `state` is `pending_funds`.
3. The customer transfers the funds to the Konbini payment provider.
4. The source `state` changes to `chargeable` when the funds are received.
5. [Submit the cart](https://docs.digitalriver.com/commerce-api/shopper-apis/cart/submitting-a-cart).

### Submit a Boleto payment flow

To use [Boleto ](https://docs.digitalriver.com/commerce-api/payments/supported-payment-methods/boleto)as a payment method:&#x20;

1. [Create a cart](https://docs.digitalriver.com/commerce-api/shopper-apis/cart/creating-or-updating-a-cart).
2. Optional. Set the locale and currency.\
   \
   `curl --location --request GET 'https://{host}/v1/shoppers/me.json? locale=pt_BR&currency=BRL' --header 'Content-Type: application/json'--header 'authorization: bearer ***\`
3. Optional. Set the cart address to the `BR` address.
4. [Attach the tax ID to the cart](https://docs.digitalriver.com/commerce-api/shopper-apis/cart/configuring-taxes/managing-tax-identifiers#attaching-a-tax-identifier-to-a-cart). The action inserts the tax ID into the payment session.
5. [Create a source using DigitalRiver.js](https://docs.digitalriver.com/commerce-api/payments-solutions/digitalriver.js/payment-methods/wire-transfer#step-2-create-a-wire-transfer-source-using-digitalriver.js) with a payment session ID. Note that the tax ID is required when creating the Boleto source. The payment session ID provides the tax ID.
6. [Attach the source to the cart](#attaching-multiple-payment-sources-to-the-cart).
7. [Submit the cart](https://docs.digitalriver.com/commerce-api/shopper-apis/cart/submitting-a-cart).

### Submit a Wire Transfer payment flow

Use the following flow for delayed payments, such as [Wire Transfer](https://docs.digitalriver.com/commerce-api/payments/supported-payment-methods/wire-transfer).&#x20;

1. [Create the shopper token](https://docs.digitalriver.com/commerce-api/shopper-apis/shopper-basics/common-use-cases/creating-a-customer).
2. [Apply the shopper and their billing address to a cart](https://app.gitbook.com/s/X2fWaY1Kp5sXA1fmOL7z/cart/apply-a-shopper-to-a-cart#v1-shoppers-me-carts-active-apply-shopper).&#x20;
3. [Create a source using DigitalRiver.js](https://docs.digitalriver.com/commerce-api/payments-solutions/digitalriver.js/payment-methods/wire-transfer#step-2-create-a-wire-transfer-source-using-digitalriver.js). The source `state` is `chargeable`.
4. [Attach the source to the cart](https://docs.digitalriver.com/commerce-api/payments/building-your-workflows/flows-by-payment-type).
5. [Submit the cart](https://docs.digitalriver.com/commerce-api/shopper-apis/cart/submitting-a-cart).
6. The shopper receives the payment details and completes the payment. After the shopper finalizes the payment, the updated order status will appear in [Global Commerce](https://gc.digitalriver.com/gc/ent/home.do).

## Redirect then submit (RTS) payment flow

Use the following flow for RTS payment methods, such as [PayPal](https://docs.digitalriver.com/commerce-api/payments/supported-payment-methods/paypal), [PayPal Billing Agreement](https://docs.digitalriver.com/commerce-api/payments/supported-payment-methods/paypal-billing-agreement), [PayPal Credit](https://docs.digitalriver.com/commerce-api/payments/supported-payment-methods/paypal-credit), [PayPal Pay in 3](https://docs.digitalriver.com/commerce-api/payments/supported-payment-methods/paypal-pay-in-3), [PayPal Pay in 4](https://docs.digitalriver.com/commerce-api/payments/supported-payment-methods/paypal-pay-in-4), and  [PayPal RatenZahlung (Installment Payment)](https://docs.digitalriver.com/commerce-api/payments/supported-payment-methods/paypal-ratenzahlung-installment-payment)

1. [Create the shopper token](https://docs.digitalriver.com/commerce-api/shopper-apis/shopper-basics/common-use-cases/creating-a-customer).
2. [Apply the shopper and their billing address to a cart](https://app.gitbook.com/s/X2fWaY1Kp5sXA1fmOL7z/cart/apply-a-shopper-to-a-cart#v1-shoppers-me-carts-active-apply-shopper).&#x20;
3. [Create a source using DigitalRiver.js](https://docs.digitalriver.com/commerce-api/resources/reference/digitalriver-object#creating-sources). The source `state` is `pending_redirect`.
4. [Complete the redirect authorization](https://docs.digitalriver.com/commerce-api/shopper-apis/cart/redirecting-to-a-digital-river-hosted-cart).
5. [Attach the source to the cart](https://docs.digitalriver.com/commerce-api/payments/building-your-workflows/flows-by-payment-type). The session `state` is `requires_confirmation`.
6. [Submit the cart](https://docs.digitalriver.com/commerce-api/shopper-apis/cart/submitting-a-cart).

## Submit then redirect (STR) payment flow

If you're using [Drop-in payments](https://docs.digitalriver.com/commerce-api/payments/payments-solutions/drop-in) and customers opt to fund a transaction with a [payment method](https://docs.digitalriver.com/commerce-api/payments/supported-payment-methods), such as [Bancontact](https://docs.digitalriver.com/commerce-api/payments/supported-payment-methods/bancontact), [Klarna](https://docs.digitalriver.com/commerce-api/payments/supported-payment-methods/klarna), and [SEPA Direct Debit](https://docs.digitalriver.com/commerce-api/payments/supported-payment-methods/sepa-direct-debit), whose resulting [source ](https://app.gitbook.com/s/drE2RCYBuoRpd2TC2sx2/payment-source/source-management#sources-id)has a [`flow` ](https://docs.digitalriver.com/commerce-api/sources#authentication-flow)of `redirect` must be redirected to the payment provider, where they either approve or cancel the funds transfer.

You should [submit the cart](https://app.gitbook.com/s/X2fWaY1Kp5sXA1fmOL7z/cart/submit-a-cart) before making payment to ensure customers avoid situations where they might send payment, but the Digital River order remains incomplete.

{% hint style="info" %}
The table in the [Supported payment methods](https://docs.digitalriver.com/commerce-api/payments/supported-payment-methods) section provides a full list of payment methods that require an [STR flow](#submit-then-redirect-str).
{% endhint %}

### How to implement an STR flow <a href="#how-to-implement-a-submit-then-redirect-flow" id="how-to-implement-a-submit-then-redirect-flow"></a>

In the [`createDropin()`](https://docs.digitalriver.com/commerce-api/resources/reference/digitalriver-object#creating-an-instance-of-drop-in) method's [configuration object](https://docs.digitalriver.com/commerce-api/payments-solutions/drop-in/drop-in-integration-guide#configuring-payment-methods-within-drop-in-payments), set the [`redirect` ](https://docs.digitalriver.com/commerce-api/payments-solutions/drop-in/drop-in-integration-guide#dropinviadigitalriver.js-disablingredirectswithindropin-1)object's `disableAutomaticRedirects` to `true`. Assign the `returnURL` to be your completion step, such as the order confirmation page. `cancelURL` should return the customer to the cart or store workflow

If customers select a redirect payment method, the `data` returned by [`onSuccess` ](https://docs.digitalriver.com/commerce-api/payments-solutions/drop-in/drop-in-integration-guide#onsuccess)contains a [source ](https://docs.digitalriver.com/commerce-api/payments/sources)whose [`state`](https://docs.digitalriver.com/commerce-api/sources#source-state) is `pending_redirect`. When you receive this event, retrieve the `source.id` from the `data`.

```javascript
let digitalRiver = new DigitalRiver("Your public API key", {
    "locale": "en-GB"
});
                        
let configuration = {
    "sessionId": "fe50c56f-88a4-4961-8142-7d4784b87264",
    "options": {
        "flow": "checkout",
        "redirect": {
            "disableAutomaticRedirects": true,
            "returnUrl": "https://mywebsite.com/paymentCallBack.html",
            "cancelUrl": "https://mywebsite.com/paymentCallBack.html"
        },
        ...
    }, 
    onSuccess: function(data) {
       //send sourceId to your backend
       var sourceId = data.source.id;
    }, 
    ...
}
                                    
let dropin = digitalriverpayments.createDropin(configuration);
dropin.mount("drop-in");
```

Next, pass this identifier in a server-side [attach source to an order or cart](https://docs.digitalriver.com/commerce-api/sources#attaching-a-payment-method-to-an-order-or-cart).

```javascript
curl --location --request POST 'https://api.digitalriver.com//v1/shoppers/me/carts/active/apply-payment-method' \
--header 'Content-Type: application/json' \
--header 'Authorization: Bearer 'Your access token' \
...
--data-raw '{
  "paymentMethod": {
    "sourceId": "e7ba0595-059c-460c-bad8-2812123b9313"
  }
}
```

This operation moves the source into "pending redirect" state, the order state to "Source pending redirect", and provides you with the `redirectUrl` to present to the customer:

{% tabs %}
{% tab title="POST /shoppers/me/carts/active/apply-payment-method" %}

```javascript
{
    "clientId": "gc",
    "channelId": "drdod15",
    "liveMode": false,
    "id": "5ce08114-143b-4bf6-ae0e-6fc501ee0c24",
    "clientSecret": "5ce08114-143b-4bf6-ae0e-6fc501ee0c24_a468b08e-2c47-4531-82af-d48d80ff6dcc",
    "type": "alipayCn",
    "reusable": false,
    "owner": {
        "firstName": "Donglei",
        "lastName": "Ye",
        "email": "j2r23ux28qj@temporary-mail.net",
        "phoneNumber": "13063725095",
        "address": {
            "line1": "Wei Bai Chang",
            "city": "ShunDe District)",
            "state": "Guangdong",
            "country": "CN",
            "postalCode": "528322"    
        }
    },
    "amount": "10.00",
    "currency": "CNY",
    "state": "pending_redirect",
    "creationIp": "10.81.3.92",
    "createdTime": "2020-02-26T02:48:11.508Z",
    "updatedTime": "2020-02-26T02:48:11.508Z",
    "flow": "redirect",
    "redirect": {
        "redirectUrl": "https://api.digitalriverws.com:443/payments/redirects/51314834-9bf9-483f-b3a7-4b36a14d3f5c?apiKey=pk_hc_e03ee62c0d964bb3ac75595b1203d13c",
        "returnUrl": "returnUrl.com"
    },
    "alipayCn+": {}
}
```

{% endtab %}
{% endtabs %}

At this point, retrieve the [cart](https://www.digitalriver.com/docs/commerce-api-reference/#tag/Carts/paths/~1v1~1shoppers~1me~1carts~1active/get) data you need—such as `currency`, `orderTotal`, `subTotal`, `tax`, `billingAddress`, `shippingAddress`,`payment.sources[]`, and relevant  `lineItems` —to build a review page.

If customers click your submit order button after reviewing the transaction's details, send a [submit cart request](https://app.gitbook.com/s/X2fWaY1Kp5sXA1fmOL7z/cart/submit-a-cart#v1-shoppers-me-carts-active-submit-cart).

{% tabs %}
{% tab title="POST /shoppers/me/carts/active/sumbit-cart" %}

```javascript
{
    "cart": {
    "termsOfSalesAcceptance": "true"
    }
}
```

{% endtab %}
{% endtabs %}

If you get a `201 Created` response, then redirect the customer to the `redirectUrl`, where they can either approve or cancel payment. Once the customer completes either of these actions, they're redirected to the URL you assigned to `cancelUrl` or `returnUrl`.

When the `returnUrl` loads, call a function that initiates a server-side request, and send the resume[ cart](https://docs.digitalriver.com/commerce-api/shopper-apis/cart/resuming-cart-submission) call. You do not need to perform this call if the customer goes to your `cancelUrl`.

```
curl --location -g --request POST ' https://api.digitalriver.com/v1/shoppers/me/carts/active/resume-cart' \
--header 'Authorization: Basic {{access_token}}' \
...
```

If you get a `200 OK` repsonse, verify the [order's state](https://app.gitbook.com/s/oUderMtztdH7OKDXmYbI/commerce-api-reference-guide/glossary#order-state) is `Submitted` and `paymentSession` status is `complete`. You can render the order confirmation page to the customer.

{% tabs %}
{% tab title="Order" %}

```
{
    "resumeCart": {
        "order": {
            ...
            "orderState": "Submitted",
     ...
        "paymentSession": {
            "id": "6a92bfac-072b-4e2c-8066-9bd2e4ab4fa0",
            "clientSecret": "6a92bfac-072b-4e2c-8066-9bd2e4ab4fa0_21ed1510-c504-47ae-a345-f7d5d17a1944",
            "status": "complete"
        }
    }
}
```

{% endtab %}
{% endtabs %}

If you receive a 409 response with the error "Requisition is not present or not in Source Pending Redirect state", this indicates something went wrong. You must recreate the cart and return customers to the payment collection stage.&#x20;

### STR payment flow

Use the STR payment flow for [Afterpay](https://docs.digitalriver.com/commerce-api/payments/supported-payment-methods/afterpay), [Alipay (domestic)](https://docs.digitalriver.com/commerce-api/payments/supported-payment-methods/alipay-domestic), [Alipay+ (cross-border)](https://docs.digitalriver.com/commerce-api/payments/supported-payment-methods/alipay+-cross-border), [Amazon Pay Express Checkout](https://docs.digitalriver.com/commerce-api/supported-payment-methods/amazon-pay#amazon-pay-express-checkout-flow), [Bancontact](https://docs.digitalriver.com/commerce-api/payments/supported-payment-methods/bancontact), [BLIK](https://docs.digitalriver.com/commerce-api/payments/supported-payment-methods/blik), [CCAvenue](https://docs.digitalriver.com/commerce-api/payments/supported-payment-methods/ccavenue), [Clearpay](https://docs.digitalriver.com/commerce-api/payments/supported-payment-methods/clearpay), [iDEAL](https://docs.digitalriver.com/commerce-api/payments/supported-payment-methods/ideal), [Klarna Financing](https://docs.digitalriver.com/commerce-api/payments/supported-payment-methods/klarna), [Klarna Pay in 3](https://docs.digitalriver.com/commerce-api/payments/supported-payment-methods/klarna), [Klarna Pay in 4](https://docs.digitalriver.com/commerce-api/payments/supported-payment-methods/klarna), [Klarna Pay in 30 days](https://docs.digitalriver.com/commerce-api/payments/supported-payment-methods/klarna), [Online Banking (FPX)](https://docs.digitalriver.com/commerce-api/payments/supported-payment-methods/fpx-online-banking), [Online Banking (IBP)](https://docs.digitalriver.com/commerce-api/payments/supported-payment-methods/online-banking-ibp), [Online Banking (Korea Bank Transfer)](https://docs.digitalriver.com/commerce-api/payments/supported-payment-methods/korea-bank-transfer-online-banking), [PayCo](https://docs.digitalriver.com/commerce-api/payments/supported-payment-methods/payco), [SEPA Direct Debit](https://docs.digitalriver.com/commerce-api/payments/supported-payment-methods/sepa-direct-debit), and [Trustly](https://docs.digitalriver.com/commerce-api/payments/supported-payment-methods/trustly).&#x20;

1. [Create the shopper token](https://docs.digitalriver.com/commerce-api/shopper-apis/shopper-basics/common-use-cases/creating-a-customer).
2. [Apply the shopper and their billing address to a cart](https://app.gitbook.com/s/X2fWaY1Kp5sXA1fmOL7z/cart/apply-a-shopper-to-a-cart#v1-shoppers-me-carts-active-apply-shopper).&#x20;
3. [Create a source using DigitalRiver.js with a session identifier (paymentSessionId)](https://docs.digitalriver.com/commerce-api/payments-solutions/digitalriver.js/payment-methods/configuring-trustly#step-2-create-a-trustly-source-using-digitalriver.js). The source state is `pending_redirect`.
4. [Attach the source to the cart](#attaching-multiple-payment-sources-to-the-cart). The session `state` is `requires_confirmation`.
5. [Submit the cart](https://docs.digitalriver.com/commerce-api/shopper-apis/cart/submitting-a-cart). The session `state` is `pending_redirect`.
6. [Resume cart](https://app.gitbook.com/s/X2fWaY1Kp5sXA1fmOL7z/cart/resume-cart#v1-shoppers-me-carts-active-resume-cart) to complete post-order processing.

### STR sequence diagram

The Submit then Redirect (STR) sequence diagram illustrates the interactions between the client, server, and external payment provider during the [STR payment flow](#str-payment-flow). It includes key steps such as applying the shopper to a cart, handling session states, and completing the redirect authorization, ultimately leading to successful payment processing. The scope of the following diagram is limited to the operations in this flow.

{% file src="<https://2721412755-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-LzlYMEYC0GeLSgnsft6%2Fuploads%2FvxCPZYBeXCbDZQa6N5yk%2FSubmit%20then%20Redirect%20for%20Commerce%20API.png?alt=media&token=789d2e7c-29c6-4bb4-a14c-a027c1e0f465>" %}
