-2

I have two separate projects. One is Laravel for RESTful API and the other is Vue SPA.

If the frontend is also handled by Laravel, then handling role and permissions is easy since we can use the can() and hasRole() method Spatie Permission provided.

However, we can't access this value in Vue SPA directly from the backend.

Is there any way I can control the permission in Vue SPA?

Thanks

zue zue
  • 11
  • 2

1 Answers1

0

Yes, you can send to the client, after a successful login, the user' data plus his roles and permissions, and create a Vue component named Can, for example, that only show something if the user has the role or permission to do so.

<can permission="post.delete">
  <v-btn>Delete record</v-btn>
<can>

The Can component access the user data (which includes his roles and permissions) and check if the user has the ability to see the underlying content.

Lucas Silva
  • 1,361
  • 1
  • 13
  • 18
  • How do I control synchronization with laravel backend. I mean what if admin changes some permissions of authenticated user before the user logout ?? Thanks for your help. – zue zue Apr 23 '21 at 04:07
  • 1
    You can use websockets (broadcast) or an approach called stale-while-revalidate to keep the user data in sync. For Vue.js there is libray called [vswr](https://github.com/Kong/swrv) that can help you achieve that. – Lucas Silva Apr 23 '21 at 05:00