SPA and view permissions

How would someone model the API permissions that would be suitable for a SPA? I don’t want to send all the available user permissions on login because there will be hundreds of them and would prefer the access comes from the server rather than putting access logic in frontend. You could say there’s 3 types of permissions - view, generic and resource specific:

  • view - can the user access a view, like can he access users list view (users:view.index etc.)
  • generic - can the user access an api endpoint e.g. users list (users:index etc.)
  • resource specific - actions the user can make on a specific resource like edit specific user etc.

API endpoints check generic permissions if they are accessible and attach resource specific permissions via meta to resources if requested, but view and generic permissions is what I struggle with at the moment. Like view permissions specify if a menu entry is visible and if the page is accessible; generic in addition to endpoint access, could sometimes influence if a button like “Invite user” or “Create user” is visible on the page, but I’m having a difficult time understanding how should I check it? For example when you open an list (table) page, the only thing I can think of is first fetch view permissions and only then, depending on response, retrieve the user list or show access denied page? Anyone dealt with this and has some tips or insights?

First of all I want say that this forum is for JSON:API specific topics and your question is not so related to the protocol.

But anyway, you doing right that implementing access limiter on backend.
As well you right that you need somehow fetch available user permissions from API.

I am fetching all the permissions on user login. Yes, payload of login becomes bigger but anyway login action is expected to take long time, so I don’t see a problem. You can also decrease number of fetched permissions, by making your access limiter more related to business logic than to specific resources.

In case if you want to fetch permissions right before showing page/UI element, you will have to add at least 1 request per page/component. No matter how you will implement it, it will expand page loading time, but in case permissions is very dynamic ( can be changed in time user are surfing the website ) you prefer this solution.