Best Approach for Access Control in Middleware Based on User Features

[suzu884]

I am using Next.js App Router for my front-end. I have an API endpoint that returns an array of features the user has access to, e.g., ['organization', 'assignments', 'grades']. Each feature corresponds to a route like /organization, /assignments, /grades, etc.

I need to configure the middleware to grant or deny access to these routes based on the user's features array.

Just to give more context, authentication is handled with access and refresh tokens that I am storing in cookies. For each API call, the cookies are included in the header.

Question

What's the best way to get the user's features array in the middleware?

Possible Solution

I could call the API endpoint in the middleware, but this would add overhead for each page render.

Any advice or alternative approaches would be greatly appreciated.