Как обрабатывать роли / разрешения в SPA (Laravel + Vue)

Я слышал много шума о СПА, поэтому подумал, давайте попробуем, и начал работать над СПА-проектом с Laravel + Vue.

Я начал с создания CRUD с помощью axios и vue-router. Все шло отлично, пока мне не потребовалось авторизовать пользователей и принимать решения на основе их ролей. Я понял, что теперь, когда у меня нет преимущества рендеринга на стороне сервера (директивы лезвия), мне придется работать на стороне vue, чтобы управлять ролями / разрешениями и т. Д. Но я не знаю, как я могу подойти к этому. .. Каковы лучшие практики ... Есть ли какие-то подводные камни, о которых следует знать ... и т. Д. И т. Д.

Итак, я начал свое исследование и то, что я собрал из здесь, там и здесь, что я пришлось бы хранить данные в объекте JS или localStorage, чтобы выполнить что-то вроде этого:

<p v-if="Laravel.user.role == 'admin'"> Confidential Data </p>

<p v-else> Unimportant Information </p>

Но что, если пользователь, который на самом деле не администратор, а модератор, выполнит это Laravel.user.role.push('admin') в консоли? Разве эти конфиденциальные данные не будут переданы ему?

Также localStorage доступен следующим образом: localStorage.getItem('user.role')

Итак, что является / являются безопасным / стандартным / наиболее распространенным способом (-ами) решения подобных ситуаций?