Dedicated to the Hydrogen framework, headless commerce, and building custom storefronts using the Storefront API.
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}, ); }
Solved! Go to the solution
This is an accepted solution.
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.
This is an accepted solution.
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.
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!
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 😀