Replies: 4 comments
-
I am also facing the same issue if i go directly to the any of the the children route the loader goes without token. |
Beta Was this translation helpful? Give feedback.
-
Can you provide a reproduction of the issue for debugging? This feels like it's a setup or |
Beta Was this translation helpful? Give feedback.
-
I am also getting the same issue in my react app where i cannot see Auth token in request headers if i access a route using full path which have a loader there fetching data from the api. Seems like it is something to do with route navigations because if we use relative paths, there are basically navigations happening using useNavigate() but when a path is accessed directly, a navigation doesn't occur really so the data is actually loaded first and then the axios interceptor gets set, that's what i observed while debugging the code. Any more findings here by you guys ? |
Beta Was this translation helpful? Give feedback.
-
I met exactly the same issue, after hours of searching, found no solution, so I have to make a workaround, it is not perfect, but in case someone need it, so I share it below: the idea is to show a loading when first 401 happens, and re-render router loader after the interceptor ready. first I wrap the Axios Settings in a component:
then in
to make it work, we cannot have only global error element, because global error element in my case is outside of the App context, which cannot resume after the first 401, so I have to use smaller errorElement, and in the errorElement I add a spinner, so it looks like it's loading:
and then in my child route:
it worked when refresh the page, it's not right to show loading when it's an error, further thing might be mark the error as temporary in the loader, and in the loading errorElement, check if it's temporary, yes show loading, no show error. hope this helps, also hope the maintainer can suggest a proper solution. |
Beta Was this translation helpful? Give feedback.
-
Hi! I have a router that looks like this:
And this is the relevant loader for this question
I also have an axios interceptor to send the token in every request in my global context
Where this is getToken();
When I go to /iteration/:id it automatically goes to iteration/:id/roles (I want this behavior) and the loader iterationLoader works perfectly and the token is sent in the headers. However, if I am in iteration/:id/roles and I refresh the page (or if I go to iteration/:id/roles directly without going through the parent route), the token is never sent and I get a 401 error. This doesn't happen for a get request that I have inside the children route (roles) with a useEffect (the token is sent and the data is displayed on refresh). This is really annoying since I want users to be able to refresh the page in the children routes without the data from the parent loader being refetched without the token being sent. Has anyone run into something similar? Am I doing anything wrong? Where do you usually define the loaders and how do you send the token? Thank you!
Beta Was this translation helpful? Give feedback.
All reactions