Next.js (app router) re-triggers fetch call in SSR page after router.push in client-side action...
Unanswered
West African Crocodile posted this in #help-forum
West African CrocodileOP
I'm trying to understand an issue we're encountering in our Next.js app (app router).
We have an SSR page that first validates a JWT token by calling a verify-token endpoint. If the token is valid, we render a form (use-client directive) on this page. The form uses a client-side action to validate the user input. After successful validation, it triggers a server-side action, which communicates with an API to register the user.
The issue we're seeing is that after a successful form submission, the token validation API is called again. Since we're doing client-side navigation after the form submission with router.push, we should jump straight to the new route? I'm not sure why the current route is being re-triggered before?
The form uses formData and the action attribute, hence no onSubmit handler with state and to my understanding then there should not be any re-render on form submission.
We have an SSR page that first validates a JWT token by calling a verify-token endpoint. If the token is valid, we render a form (use-client directive) on this page. The form uses a client-side action to validate the user input. After successful validation, it triggers a server-side action, which communicates with an API to register the user.
The issue we're seeing is that after a successful form submission, the token validation API is called again. Since we're doing client-side navigation after the form submission with router.push, we should jump straight to the new route? I'm not sure why the current route is being re-triggered before?
The form uses formData and the action attribute, hence no onSubmit handler with state and to my understanding then there should not be any re-render on form submission.
5 Replies
West African CrocodileOP
try out event.preventDefault in the form submit part, since forms will refresh the page normally when you submit it
West African CrocodileOP
@Arinji It's a form action not a onSubmit handler with state