Prebuilt Checkout
Gain a basic understanding of how to add a Prebuilt Checkout to your site
Prebuilt Checkout is a customizable checkout experience that allows you to connect an upstream commerce system with Digital River's local pricing, logistics, subscriptions, payment, fraud detection, tax exemption, and disclosure services.
The Prebuilt Checkout solution reduces the complexity of integrating with the Digital River APIs and our front-end libraries, thereby shortening your time to deployment.

During the early stages of an ecommerce transaction, customers land on your storefront, review products and build a cart. Unless you engage our local pricing service, Digital River is typically not involved in these early pre-checkout interactions. However, once customers initiate checkout, you'll need to start interacting with Prebuilt Checkout.
Add a click event listener to each checkout button on your site. Handle the event by defining a checkout-session request, passing that request data to your back-end server, and then securely sending a create checkout-session request.
Digital River returns a unique checkout-session identifier that you must pass, along with an optional configuration object, to the create modal method on your front-end.
To create a checkout-session, send your secret API key and request payload in a
POST /drop-in/checkout-sessions
.curl --location --request POST 'https://api.digitalriver.com/drop-in/checkout-sessions' \
--header 'Content-Type: application/json' \
--header 'Authorization: Bearer <secret API key>' \
...
--data-raw '{
"currency": "USD",
"customerType": "individual",
"taxInclusive": false,
"items": [
{
"skuId": "b535d75a-a6ee-4f63-be4d-c2e2537efec7",
"quantity": 1,
"price": 5
}
],
"shipFrom": {
"address": {
"line1": "10380 Bren Rd W",
"line2": "",
"city": "Minnetonka",
"postalCode": "55129",
"state": "MN",
"country": "US"
}
},
"options": {
"shippingMethods": [
{
"amount": 5,
"description": "standard",
"serviceLevel": "SG"
},
{
"amount": 15,
"description": "next day",
"serviceLevel": "ND"
}
],
"addresses": [
{
"address": {
"line1": "10380 Bren Rd W",
"line2": "line 2",
"city": "Minnetonka",
"postalCode": "55129",
"state": "MN",
"country": "US"
},
"name": "John Smith",
"phone": "952-111-1111",
"email": "[email protected]",
"organization": "Digital River",
"additionalAddressInfo": {
"neighborhood": "Centro",
"division": "å–¶æ¥éƒ¨",
"phoneticName": "ヤマダ ã‚¿ãƒ"
}
},
{
"address": {
"line1": "62 Trinity Crescent",
"line2": "",
"city": "WHITCHURCH",
"postalCode": "CF4 9ZB",
"country": "GB"
},
"name": "Anna Brawner",
"phone": "07854319925",
"email": "[email protected]",
"organization": "Digital River",
"additionalAddressInfo": {
"neighborhood": "Centro",
"division": "å–¶æ¥éƒ¨",
"phoneticName": "ヤマダ ã‚¿ãƒ"
}
}
]
}
}'
{
"id": "eb3b9cc3-d068-4300-9488-c88c0341b5db"
...
}
<script src="https://checkout.digitalriverws.com/v1/DigitalRiverCheckout.js"></script>
const drCheckout = new DigitalRiverCheckout('YOUR_PUBLIC_API_KEY');
​Build a configuration object and then pass it and the checkout session identifier to
createModal()
.document.getElementById('YOUR_CHECKOUT_BUTTON_ID').addEventListener('click', async (event) => {
// An example asynchronous function that creates the checkout session
const checkoutSessionId = await createCheckoutSession();
// Creates and opens the modal
drCheckout.createModal(checkoutSessionId, config);
});
Depending on how the checkout-session is configured, the modal then takes customers through various stages:
In this stage, customers are always required to provide their name, phone number, email and billing address.
Other required inputs, and available options, depend on whether the checkout involves:
If any
items[]
in the checkout-session represent physical products, the modal prompts customers for shipping information. Once validated, Digital River uses it to populate the checkout-session's billTo
. In checkouts that only contain digital products, the modal doesn’t ask for shipping details. Instead, it simply prompts customers for billing information.
Physical products
Digital only products
.png?alt=media&token=55479848-d3ea-488b-b305-ae102bef53dc)
.png?alt=media&token=d70e8ea3-edb3-4b4e-b9ba-4a68c6111b44)
If you send
customerId
in the create checkout-session request, customers are given the option to save their shipping and billing information for use in future checkouts. Additionally, if you pass options.addresses[]
, the modal presents these saved addresses for convenience purposes.Save address option
Saved addresses


If the checkout-session's
customerType
is business
, then customers must provide their company's name when entering both shipping and billing information.Shipping information
Billing information


If you activate the auto collect customer type feature, then customers are shown a checkbox that asks them whether they’d like to make the purchase on behalf of a business.

In transactions that contain physical products, the modal next prompts the user to make a shipping choice. For each
options.shippingMethods[]
in the checkout-session, customers are always shown its description
and amount
..png?alt=media&token=15332979-b10b-4456-9c62-36528f1537e3)
In guest checkouts, customers can enter a tax identifier but are not given the option to save the value to their account.
.png?alt=media&token=c0d45c9e-498c-41f0-9bd6-ff4450ecb2e5)
​Registered customers with applicable, saved tax identifiers can either select one of the values presented to them or enter a new one.
.png?alt=media&token=a1f42c3c-cdac-41a7-b5f0-84e4d5e73ec5)
Registered customers who have no stored, transaction-applicable tax identifiers can save a new value for use in future checkouts. If they select this option, Digital River saves the tax identifier to the customer’s record.
.png?alt=media&token=a44bfb03-02c8-42c9-a228-b7ae8f6b1ca9)
In countries that require tax identifiers, customers must enter a value before proceeding to the payment stage.
In the payment collection stage, the modal only displays payment methods that are appropriate to the transaction. Depending on how you configure the checkout-session and on your Dashboard settings, the modal can also:
Once customers provide payment, agree to the terms, and successfully submit the order,
onCheckoutComplete
is called. If you pass a
customerId
in the create checkout session request, we retrieve and display any transaction-applicable payment sources[]
that are saved to the referenced customer. 
The modal can ask customers whether they'd like to save a payment method for future purchases.
If the resource you reference doesn't exist in your account, then Digital River creates a new customer and assigns it the identifier you passed.
If the payment method selected by customers supports reusability, then the modal asks whether they'd like to save it for future purchases. If customers opt to do so, then, after Digital River creates the source, we save it to that customer.

For each displayed payment method, the modal presents users with the terms of sale and privacy policy of the designated selling entity.
If you save your own consents in Dashboard, then they are appended to Digital River's disclosures. Customers must accept all these terms and disclosures before they are allowed to complete the purchase.
To determine what disclosures customers accepted, you can configure a webhook to listen for the event with a
type
of checkout_session.order.created
.Digital River only disclosures
Combined disclosures
If you don't save customized consents in Dashboard, then the modal only displays Digital River's disclosures.

If you save consents in Dashboard, then the modal displays Digital River's disclosures, along with yours as well.

There are a variety of ways to configure the order confirmation stage. The following is an example of the default option.

Last modified 1mo ago