calling GET apis inside app/api folder from nested pages client components /app/category/page.tsx | Next.js | Page 1

ancient lodge Mar 12, 2024, 10:55 AM

#

im calling fetch(/api/search?q=pink) from a client component using useeffect, when done from a root page all is fine, but when same component is in a page which is a dynamic route inside category folder, nextjs auto prefixes the api url with category/api/search. Please help me remove this "category/" and just gave "api/search".

amber hollowBOT Mar 12, 2024, 10:55 AM

#

Post created!

🔎 This post has been indexed in our web forum and will be seen by search engines so other users can find it outside Discord

🕵️ Your user profile is private by default and won't be visible to users outside Discord, if you want to be visible in the web forum you can add the "Public Profile" role in id:customize

✅ You can mark a message as the answer for your post with Right click -> Apps -> Mark Solution
(if you don't see the option, try refreshing Discord with Ctrl + R)

ancient lodge Mar 12, 2024, 11:05 AM

#

ok. i just had to add "/" at the beginning. found answer in stackoverflow(https://stackoverflow.com/questions/72951894/how-to-dynamically-fetch-api-route-from-component-in-page-folder)

Stack Overflow

How to dynamically fetch api route from component in page folder?

i have a reusable contact form that works perfectly when used in the index.js file.
However when i use it from a component in the page folder i am having a 404 not found error message because it uses

#calling GET apis inside app/api folder from nested pages client components /app/category/page.tsx