Skip to main content

​
Why use a checkout session?

With checkout sessions generated dynamically instead of just using a product payment link, you are able to pass a request_id to the session. This allows you to track the payment status and the user that made the payment in your system in a more organized way, and gives you the flexibility to track that payment with any ID you choose instead of relying on Creem IDs.

​
Create a checkout session

You can create a checkout session with a product ID
You can find a product ID by going to the products tab and clicking on the product options and selecting “Copy ID”.
Additionally, you can pass a request_id to the session to track the payment in your system. You will also need the API key to authenticate the request.
Building on Next.js? Use the @creem_io/nextjs adaptor as your primary path. It creates the checkout route and component for you while still letting you call the REST API directly when needed.
Install the package: 
npm install @creem_io/nextjs
Then create a checkout session: 
// app/checkout/route.ts
import { Checkout } from "@creem_io/nextjs";

export const GET = Checkout({
  apiKey: process.env.CREEM_API_KEY!,
  testMode: process.env.NODE_ENV !== "production",
  defaultSuccessUrl: "/success",
});
The above request will return a checkout session object with a checkout_url that you can use to redirect the user to the payment page. Any payments made with this checkout session will have the request_id you provided on the Redirect URL, as well as the webhook event.

​
Metadata

The request_id is only returned in the checkout.completed webhook (which is very useful for one-time payments), but it’s not sent with every new subscription transaction. To make things easier, we also allow you to pass metadata in a checkoutSession with or without the request_id. This metadata will be saved in the Subscription object and returned with every subsequent webhook. 
import { CreemCheckout } from "@creem_io/nextjs";

<CreemCheckout
  productId="prod_your-product-id"
  referenceId="user_123"
  metadata={{
    userId: "my_internal_customer_id",
    any_key: "any_value",
  }}
>
  <button>Buy Now</button>
</CreemCheckout>;

​
Success URL

You can pass a custom success_url for each checkout_session, which will override the success_url set on the product. This allows you to dynamically redirect users to custom pages after each payment (useful for directing users to their specific account resources after payment). 
// app/checkout/route.ts
export const GET = Checkout({
  apiKey: process.env.CREEM_API_KEY!,
  defaultSuccessUrl: "/dashboard",
});

​
Customer Email

You can pass a customer.email directly in the checkout session. This email will be pre-filled for the user on the checkout session page and cannot be changed. This is useful if you want to ensure that the user completes the payment using the email they registered on your platform. 
<CreemCheckout
  productId="prod_your-product-id"
  customer={{ email: user.email }}
>
  <button>Check out</button>
</CreemCheckout>

​
Discount Codes

You can pass a discount_code directly in the checkout session. This discount code will be pre-filled for the user on the checkout session page. 
<CreemCheckout
  productId="prod_your-product-id"
  discountCode="BF200XX"
>
  <button>Redeem offer</button>
</CreemCheckout>

​
Seat Based Billing

You can pass a units amount directly in the checkout session. The product price will be used as the base price for one seat/unit of the product and the checkout session will reflect the (base price x units) to be charged. 
<CreemCheckout productId="prod_your-product-id" units={seatCount}>
  <button>Add {seatCount} seats</button>
</CreemCheckout>