I recently have a use case where i need to implement a dashboard app using next js with an external laravel api server. The server has a token based authentication (single token not access or refresh tokens). So I took this approach:
- user logs in using server actions gets the token and stores the token in http only cookie using cookies from next/headers
- then the token from the cookies is used to fetch data in all the server components throughout the whole app
- I also tried to fetch data in client components by passing the token from server to client and making fetch request (I gues i shouldn't fetch the data using token in client rather than use proxy api routes or use server actions)
I have following questions:
- Is this the right, secure or recommended way of doing things because there are not much resources of next js with external api
- What about client state right now i save the user data in non http only cookie and pass that from server to client should i keep doing that or set up state using zustand etc. if so how and where should i set the state.
- how to manage token expiry what if the token of the server is expired i kept the expiry same but its still possible that the token expires on server and mine is still intact
here is the deployed link: https://next-external-api-frontend.vercel.app
here is the repo: https://github.com/saimarshadsaim31/next-external-api-frontend