cheesedie Posts - Answer Overflow

cheesedie

•Created by cheesedie on 3/11/2025 in #questions

Request url has trailing slash before query params depending on params order

Encountered a very strange issue, I am not sure if it is related to axios or something else so I'll try to find help here. I am using a custom useQuery wrapper and custom axios instance for fetching data:

  const listUsers = usePaginatedQuery({
    queryKey: ['users'],
    queryFn: async (params) =>
      (
        await api.get<Page<UserData>>('/users', {
          params: {
            page: params.page,
            per_page: params.per_page,
          },
        })
      ).data,
  });

  const listUsers = usePaginatedQuery({
    queryKey: ['users'],
    queryFn: async (params) =>
      (
        await api.get<Page<UserData>>('/users', {
          params: {
            page: params.page,
            per_page: params.per_page,
          },
        })
      ).data,
  });

I encountered a strange bug where the request URL for this request will look like as follows: http://localhost:5050/users/?page=1&per_page=10 It adds a slash before the query params, which is a problem for me. However, if I switch the order of page: params.page and per_page: params.per_page, or just remove the per_page params, the trailing slash will then not appear. I do not understand why the order of params is causing this, is there an explanation, is it a bug in axios library or could it be related to something else? I am using Nextjs 15. I have also a middleware setup, but it is a very basic auth token validation middleware so I don't think this changes anything.

2 replies

Gaming

Programming