Как добавить роли и разрешения в Laravel Fortify Inertia vue?

#laravel #inertiajs #laravel-fortify

#laravel #inertiajs #laravel-укрепление

Вопрос:

в моем проекте используется laravel fortify, инерция с vue. я должен добавить разрешения на основе ролей (точно так же, как пакет разрешений spatie). я все еще новичок в fortify и inertia. но у меня есть опыт работы с пакетом spatie. я застрял на том, как добавлять роли и разрешения для укрепления. в настоящее время я планирую создать структуру таблицы, подобную spatie package(роли, разрешения, role_has_permissions и т. Д.). существует ли пакет для каждой сборки или лучший способ реализации ролей и разрешений? и использовать «@can» в файлах vue? Спасибо.

Редактировать

привет, ребята, это я сейчас сделал (я использую это сейчас). он работает, но все еще нуждается в некоторых улучшениях (любое лучшее решение, которое я действительно ценю)

1) установлен и настроен как обычно spatie / laravel-разрешение

2) добавлены предопределенные разрешения и роли для таблиц с помощью seeder

  1. созданная функция в пользовательской модели для получения списка массивов разрешений
     // user model function
    public function getPermissionArray()
     {
         return $this->getAllPermissions()->mapWithKeys(function($pr){
             return [$pr['name'] => true];
         });
    
     }
     
  2. и добавил эту функцию в промежуточное программное обеспечение по инерции
 //AppHttpMiddlewareHandleInertiaRequests
public function share(Request $request)
{
     return array_merge(parent::share($request), [
          'auth'=>['user' => $request->user() ?   $request->user()->only('id', 'name', 'email') : null,
                    'can' =>$request->user() ? $request->user()->getPermissionArray() : []
                ],
        ]);
}
 

теперь $page.props.auth.can можно получить глобальный доступ

  1. добавлена проверка разрешений в файле vue
    <div class="row">
              <div class="col-sm-12 col-md-6" v-if="$page.props.auth.can['user_create']">
                <inertia-link
                  class="btn btn-primary"
                  :href="$route('admin.user.create')"
                  >Create New
                </inertia-link>
              </div>
   </div>
 

Комментарии:

1. Я думаю, что в этой документации может быть подсказка для вас inertiajs.com/authorization

2. вау, спасибо. значит, можно использовать тот же пакет spattie и внедрить его функцию в эту функцию «can»?

3. Я никогда не использую пакет spattie для авторизации, авторизации laravel мне вполне достаточно.

4. я пытался использовать промежуточное ПО inertia. выглядит работающим. но не знаю, насколько это надежно с точки зрения производительности. (я добавил это выше)

Ответ №1:

Я решил проблему, как показано ниже, сначала я отправляю массив разрешений в пользовательский интерфейс.

в пользовательской модели

 <?php
    // user model function
    public function getPermissionArray()
     {
         return $this->getAllPermissions()->mapWithKeys(function($pr){
             return [$pr['name'] => true];
         });
    
     }
 

в промежуточном программном обеспечении общего доступа inertia

 <?php
//AppHttpMiddlewareHandleInertiaRequests
public function share(Request $request)
{
     return array_merge(parent::share($request), [
          'auth'=>['user' => $request->user() ?   $request->user()->only('id', 'name', 'email') : null,
                    'can' =>$request->user() ? $request->user()->getPermissionArray() : []
                ],
        ]);
}
 

в js-файле приложения я добавил глобальную функцию для проверки наличия у пользователя одного или нескольких разрешений

 import Vue from 'vue'


Vue.mixin({
  methods: {
    hasAnyPermission: function (permissions) {

      var allPermissions = this.$page.props.auth.can;
      var hasPermission = false;
      permissions.forEach(function(item){
        if(allPermissions[item]) hasPermission = true;     
      });
      return hasPermission;
    },
  },
})
 

в компонентах vue :

 <script>
       
   export default {
       data() {
            return {};
       },
      mounted: function () {},
      methods: {},
   };
</script>
        
<template>
      <div>  
          <li v-if="hasAnyPermission(['testiml_view', 'testiml_edit', 'testiml_create'])">
              <inertia-link
                :href="$route('admin.testimonial.index')"
                class="side-nav-link-a-ref"
              >
                <i class="fas fa-feather"></i>
                <span>Testimonial</span>
              </inertia-link>
            </li>
</div>
</template>
 

Ответ №2:

в share методе промежуточного программного обеспечения Inertia: HandleInertiaRequest.php я передал разрешения и массив ролей в Vue, используя:

         $permissions = $user->getAllPermissions()->pluck('name');
        $roles = $user->roles()->pluck('name');
        return array_merge(parent::share($request), [
            'auth.user' => fn() => $request->user() ?
                $request->user()->only('id', 'name', 'email', 'roles')
                : null,
            'auth.user.permissions' => $permissions,
            'auth.user.roles' => $roles
        ]);