Hydrogen | 3rd party API calls not working on Oxygen

Retired Boards Appdev Custom Storefronts

Topic summary

A developer encountered an issue where third-party API calls in a Hydrogen cart.tsx action function worked locally but failed when deployed to Oxygen. The API fetch request wasn’t appearing in Chrome DevTools network logs.

Root Cause Identified:
The problem was the cache: 'no-cache' option in the fetch request. Oxygen threw an error indicating that the ‘cache’ field on ‘RequestInitializerDict’ is not implemented in their serverless environment.

Solution:
Removing the cache: 'no-cache' parameter resolved the issue.

Debugging Tip:
Console logs in Oxygen’s preview runtime logs proved extremely helpful for identifying the error, as network activity wasn’t visible in browser DevTools.

Technical Context:
Oxygen runs as a Serverless Function with limitations on certain Node.js/JavaScript features compared to standard environments. Developers should follow Oxygen’s documentation closely to avoid compatibility issues.

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

Hi,

I have a hydrogen website where I modified the cart.tsx action function to include a call to a 3rd party API when an item is added to the cart. This works perfectly on localhost but when I deployed my codebase to Oxygen, this API seems to not get called. I do not see any network logs on Chrome Dev Tools too. Does anyone know what is happening? My simple fetch code below. Thanks

export async function action({request, context}: ActionArgs) {
  const {session, storefront} = context;
  const headers = new Headers();
  ...
  switch (cartAction) {
    case CartAction.ADD_TO_CART:
        ...
        
        let jsonData: any;

        //make request to 3rd party API
        const response = await fetch(url, {
            method: 'POST',
            headers: {
            'Content-Type': 'application/json',
            },
            body: JSON.stringify(body),
            cache: 'no-cache',
            });

        jsonData = await response.json();
        //do something with this data
    }
  ...
  return json(
    {
      cart,
      errors,
      analytics: {
        cartId,
      },
    },
    {status, headers},
  );
}
2

I saw no problem yet with the code. However, you can try to debug by adding console.log and try to catch the error, for example:

try {
  const response = await fetch(url, {
    method: 'POST',
    headers: {
      'Content-Type': 'application/json',
    },
    body: JSON.stringify(body),
    cache: 'no-cache',
  });
  const jsonData = await response.json();
  console.log("Data from API:", jsonData);
} catch (error) {
  console.error("Error calling API:", error);
}

Also, it seems like returning

{status, headers}

is redundant.

3

So it turns out that Oxygen does not like

cache: 'no-cache'

It was throwing an error The ‘cache’ field on ‘RequestInitializerDict’ is not implemented." so i had to remove that.

Console Logs are extremely helpful especially in the preview runtime logs of Oxygen.

Thank you @Weaverse for your help!

1 Like
4

Well, I don’t know that yet, either.
Oxygen is Serverless Function, actually, and somehow, many Node/JS functions will be missing; follow their docs strictly, I think :grinning_face: