I am working on a Calorie Tracker page where I fetch nutritional information using the Edamam API. I have encountered an issue with the
404 resource not found error when trying to access the nutrition.js function file stored in
.netlify/functions path of my source git repo.
Here’s an overview of my setup:
Frontend: I have a frontend script that handles user input and makes a fetch request to the backend for retrieving nutritional data. This is the fetch request :
fetch('/.netlify/functions/nutrition?meal=' + meal).
Backend: I have a Netlify Function (nutrition.js) that acts as the server-side code. It performs an API call to the Edamam API using the provided meal parameter.
The Problem: When I click on the track button to fetch the nutritional data, I receive this error : Failed to load resource: the server responded with a status of 404 () (in the console). Upon inspection, I noticed that the problem is in the fetch request which is trying to access the nutrition.js file relative to the live website URL. For Example:
My Attempted Solution: To fix this issue, I tried using the absolute Git path for the nutrition.js file, but it still didn’t resolve the problem.
As a beginner I am clueless on how to solve this issue . Please provide me with some fix for this issue