Middleware & App Router for Location-Based Access Control in Next.js with Flask Backend
Unanswered
Sarabi dog posted this in #help-forum
Sarabi dogOP
Hi everyone,
I'm working on a project where the backend is written in Flask (Python) and the frontend uses Next.js (App Router). Here’s the setup and the requirement:
Backend Setup:
The Flask backend requires users to allow location permission on a specific page.
Once the location is allowed, an API endpoint (/set_location) stores the location in the session file and redirects the user to the main page.
Frontend Requirement:
In Next.js, we want to enforce a middleware-based access control mechanism for the chat page.
Behavior:
If a user tries to access the chat page directly without a location in the session, the middleware should check the session and redirect the user to the terms of service page for location permission.
If the user has a location in the session, they should be allowed to access the chat page.
This redirection logic must run before the page is rendered, preventing unauthorized access.
Challenges:
With the Next.js App Router, the older getServerSideProps approach is not supported.
Middleware seems to be the appropriate place for this logic, but it costs since we are planing to use vercel.
i need a better solution to replace middleware if possible...
I'm working on a project where the backend is written in Flask (Python) and the frontend uses Next.js (App Router). Here’s the setup and the requirement:
Backend Setup:
The Flask backend requires users to allow location permission on a specific page.
Once the location is allowed, an API endpoint (/set_location) stores the location in the session file and redirects the user to the main page.
Frontend Requirement:
In Next.js, we want to enforce a middleware-based access control mechanism for the chat page.
Behavior:
If a user tries to access the chat page directly without a location in the session, the middleware should check the session and redirect the user to the terms of service page for location permission.
If the user has a location in the session, they should be allowed to access the chat page.
This redirection logic must run before the page is rendered, preventing unauthorized access.
Challenges:
With the Next.js App Router, the older getServerSideProps approach is not supported.
Middleware seems to be the appropriate place for this logic, but it costs since we are planing to use vercel.
i need a better solution to replace middleware if possible...
12 Replies
Couldn't you just check the session in an RSC when accessing the chat page?
Sarabi dogOP
mmh what if when a user directly navigates to main page which requires locaion data, Next.js will still need to check the session (via an API call to Flask, such as /api/home) to ensure that they are redirected if user_location is not in the session.
No Middleware Needed in Next.js: As Flask already has the logic to check the session, Next.js just needs to call the backend to confirm the session state and handle redirection.
No Middleware Needed in Next.js: As Flask already has the logic to check the session, Next.js just needs to call the backend to confirm the session state and handle redirection.
which one should be the better approach
Middleware approach would not be recommended here. If you're already storing auth info of your user inside a cookie, then that might be a better approach. If you store the session info along with the location, you shouldn't need to call the backend multiple times for that.
Sarabi dogOP
I am not utilizing cookies; instead, I am storing geolocation data in a session file within the Flask session. This data is being saved through the /set_location API endpoints.
what my frontend dev said is: If a user tries to access the chat page directly without a location in the session, the middleware should check the session and redirect the user to the terms of service page for location permission.
but somehow i dont agree on that
but somehow i dont agree on that
How about using SWR? You can fetch the session once use it as a hook to check.
Or cache the fetch results instead so you won't be making multiple requests
Sarabi dogOP
mmh the thing is that using SWR directly in Next.js will require an extra step to ensure that the Flask session data is accessible from your Next.js frontend. Since Flask session data is stored on the server , you need to retrieve that data by sending requests to your Flask API from your Next.js frontend.
Got it. How about just caching the fetch data then only check on pages you need it checked through RSC?
That would be better than just always checking in the middleware
Sarabi dogOP
Within an hour, the front-end dev will arrive to discuss matters with us. he understands better than me
at the end i work as a backend engineer
at the end i work as a backend engineer