Next.js Discord

Discord Forum

Data Fetching from Nested Route

Unanswered
Azawakh posted this in #help-forum
Open in Discord
Avatar
AzawakhOP
I'm using react-query to fetch data from a nested route and node-fetch is using the local path opposed to my absolute base. I know that switching to axios is an option, and I also know that I can explicitly add the https:// scheme (via a NEXT_PUBLIC_BASE_URL). However, I'm sure there is an easier/better way that I can't think of...

Example component path: https://localhost:3000/users/123

Console log: https://localhost/users/api/users/update = 404

  const {
    isFetching,
    data: updatedUser,
    isError,
  } = useQuery({
    queryFn: async () => {
      const res = await fetch('/api/users/update', {
        method: 'POST',
        body: JSON.stringify({
          newUserData,
        }),
      });

      if (!res.ok) {
        throw new Error('API Error');
      }

      const data = await res.json();
      return data;
    },
    queryKey: ['search-query'],
  });

1 Reply

Avatar
not-milo.tsx
You could use window.location.origin and prepend it to your relative fetch url