如何使用 vue 项目在 laravel 中添加权限控制？答案

【问题标题】：how to add permission control in laravel with vue project?如何使用 vue 项目在 laravel 中添加权限控制？
【发布时间】：2018-01-02 14:20:35
【问题描述】：

我正在将 vue js 添加到我当前的 laravel 应用程序中，这样我就可以使它成为 SPA，这意味着 laravel 仅充当后端，其余部分由 vue js 控制，从渲染视图到路由。

我当前的 laravel 应用程序使用 kodeine laravel-acl 来控制我的用户可以简单地执行哪个页面和哪个操作

把这个放在路由中：

Route::get('admin', [
        'as'           => 'admins.admin.index',           
        'uses'         => 'UserController@index',
        'middleware'   => ['auth', 'acl'],
        'can'          => 'view.admin_view']);

如果我这样做只是为了在用户没有权限的情况下隐藏某些操作

@permission('view.admin_view')
   //some link or button          
@endpermission

所有这些权限都存储在mysql数据库中，每个用户都有不同的权限。

但是如果我把它做成 vue js SPA 怎么办？因为所有路由都是通过 vue js 控制的？

【问题讨论】：

标签： laravel vue.js vuejs2

【解决方案1】：

要简单的权限检测逻辑，您可以使用 CASL - https://github.com/stalniy/casl

媒体上的文档和文章中有很多有趣的东西，解释了如何与 Vue 和其他流行框架集成！

【讨论】：

如何将它集成到 laravel-mysql 中？我发现只有 mongoDB 的集成
要与 laravel 和 MySQL 集成，您需要将 CASL 移植到 PHP。它是用 JavaScript 编写的
@LaurensiusTony 您还可以在策略和门中添加其他属性，以便能够定义条件。如果没有条件，它应该很容易使用。我计划很快发表一篇关于此的文章

【解决方案2】：

您可以通过 routeConfig 中的beforeEnter() 在前往某个路线之前进行检查。样品在这里：

const router = new VueRouter({
  routes: [
    {
      path: '/foo',
      component: Foo,
      beforeEnter: (to, from, next) => {
        // ... Do your checkings here
      }
    }
  ]
})

【讨论】：