Hydrogen / Oxygen - cartUrl is undefined in the URL. Displays just fine on localhost.

Topic summary

A developer encountered an issue where cartId appeared as undefined in URLs when deploying a custom Hydrogen checkout flow to Oxygen, despite working correctly on localhost.

Root Cause:
The problem stemmed from URL parameter casing. The developer defined a route parameter as cId (camelCase), but Oxygen automatically converts route parameters to lowercase.

Solution:

  • Access the parameter as params.cid instead of params.cId
  • Avoid using camelCase for route parameters in Oxygen deployments

Key Takeaway:
Oxygen normalizes URL parameters to lowercase, which differs from localhost behavior. Developers should use lowercase parameter names consistently to ensure compatibility across environments.

Summarized with AI on November 19. AI used: claude-sonnet-4-5-20250929.

Hi, I am using Hydrogen and creating my own checkout flow. On the cart page, I grab the cartId and assemble a new URL called /check-out//consignee. This works just fine on localhost. But when I deploy to Oxygen, the cartId becomes undefined. Please see attached screenshots. Are Shopify IDs such as cartIds, customerIds, etc redacted on Oxygen URLs? This is how I assemble the URL:

export const action: ActionFunction = async ({
  request,
  context,
  params: {lang, cId},
}) => {

...
   return redirect(
        lang
          ? `${lang}/check-out/${cId}/consignee`
          : `/check-out/${cId}/consignee`,
        {
          headers: {
            'Set-Cookie': await context.session.commit(),
          },
        },
      );
}

Any help appreciated! Thank you!

Ok solved it. Just realized that the cId param I defined becomes lowercase on Oxygen. So by accessing it as params.cid instead of params.cId, it works! Lesson learned, don’t camelCase your params.

1 Like