Vue SPA 中的角色和权限

Question

我有两个独立的项目。一个是用于 RESTful API 的 Laravel，另一个是 Vue SPA。

如果前端也由 Laravel 处理，那么处理角色和权限很容易，因为我们可以使用 Spatie Permission 提供的 can() 和 hasRole() 方法。

但是，我们无法直接从后端访问 Vue SPA 中的此值。

有什么办法可以控制 Vue SPA 中的权限吗？

谢谢

Answer 1

是的，您可以在成功登录后将用户的数据以及他的角色和权限发送给客户端，并创建一个名为 Can 的 Vue 组件，例如，如果用户有这样做的角色或权限。

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

Can 组件访问用户数据（包括他的角色和权限）并检查用户是否有能力查看底层内容。