0

I am writing a Nuxt site which will allow users to be members of a team. Each member will have a role (Member, Manager, Owner etc.) which I can return from the data source for each member (or user) as I am writing the backend here too.

How do I go about restricting access to certain pages based on the user's role within that team?

I'm guessing the first step is to try and write a custom middleware that I can use for the pages I want to restrict:-

export default function ({ $auth, redirect }) {
  // do the check here
}

but I'm not sure what the best way to get at the user's role for that specific page's team from there.

I've seen people recommending to use the scope key of nuxt-auth but that doesn't look too good for team-specific roles like this so now I'm a bit lost.

Any ideas?

kissu
  • 40,416
  • 14
  • 65
  • 133
bodger
  • 1,112
  • 6
  • 24
  • Not really, sorry. You said "it depends of the way you want to implement it" which doesn't really help. I still don't know how to cross-reference the list of user roles/teams with the specific page that they are trying to access. – bodger Jul 09 '21 at 13:04
  • Try to be more specific as of exactly you're trying to achieve here. – kissu Jul 09 '21 at 13:05
  • I am trying to find a way for the middleware to work out whether the logged in user has permission to see a particular (team-specific) page. Whether the user is allowed or not should be determined from the user's role within the team whose page they are trying to access. So, if a user with admin permissions for Team A tries to look at a page which belongs to Team B, they won't be able to see it - but a user with viewer permissions for Team B *will* be able to see it. – bodger Jul 09 '21 at 17:13

1 Answers1

0

Not sure about nuxt/auth since it could add more complexity to the whole thing. If you do not use it for authentication elsewhere, better not to use it IMO. Meanwhile, if you do use it, you may maybe give it a try. Could make things faster.

At the end, what you're trying to achieve is to see if:

  • current authenticated user (fetched from vuex) do have a specific privilege number
  • let's say: admin >> 40, manager >> 30, employee >> 20, client >> 10 and guest >> 0
  • if the user is on a page, he should not be, redirect the user
  • you could check the value of the logged in user and show him specific blocks of the webpage depending on the amount (the number) of this privilege
  • linking an object to the logged in user with something like { admin: false, blog: true } may be a more flexible idea in the long term if you want some granularity (this one will not really be into the middleware but more in the template tho).
kissu
  • 40,416
  • 14
  • 65
  • 133
  • How does this solve the problem of needing to have different roles for each team that the user is a member of? So, for instance, when they're visiting the (restricted) page for Team X, the middleware should check that the user has admin permission for Team X (not just "admin" or "manager" generally). – bodger Jul 06 '21 at 08:20
  • @bodger yeah, it depends of the way you want to implement it! At the end, it's the same principle: checking if the connected user is checking enough boxes or not to have the right to see the page. – kissu Jul 06 '21 at 20:04