Best approach for loading remote permissions

[philippeluickx]

Hi! Using vuex and vue-router, together with vue-authenticate and vue-authorize.

I have a permission scheme, for which the data comes from the backend. I assume this is a pretty common scenario. I do load the permission data upon login in the vuex store, but what would be the best approach on a more high level? Once the user is authenticated, he could just refresh the page and still have the authentication token in place, but not the permissions.

I see these options:

• load the permission data also in cache, together with the tokens
• on a global, app-level, check if the user is authenticated and if yes, load the permissions before doing anything else. So before routing.

I feel like the second approach would be the correct one, but not sure how to accomplish this? What hook can be used to fetch remote data before the permissions are being read on vue-router config?

Thanks!

---

edit: Some more thoughts into it: caching would still not be a complete solution. If permissions change at some point, then the user would have to logout and login again before having the correct permissions in the frontend. The second approach at this point seems the only acceptable one? So load the permissions, but only once when the (global) app starts. On navigation, it would not be loaded again but on a refresh it would.