Search code examples
laravelsingle-page-applicationnuxt.jslaravel-sanctum

Laravel sanctum scope for nuxtjs frontend


So i'm trying to establish some kind of policy inbetween the frontend and backend, all works fine however i'm a little confused towards declaring a scope for my application users

ApiSessionController.php

public function login(Request $request)
{
    $email = $request->get('email');
    $password = $request->get('password');
    $user = User::where('email', $email)->first();
    $token = $user->createToken(
        'token',
        ['role' => $user->getRoleNames()->first()]
    );

    if (Auth::attempt(['email' => $email, 'password' => $password])) {
        return response()->json('', 204);
    } else {
        return response()->json('Invalid credentials', 403);
    }
}

I do realize that this code doesn't currently uses the token, however i see no change when i

return response()->json($token, 200);


Nuxt.js frontend default.vue

<v-btn v-if="this.$auth.hasScope('admin')">admin</v-btn>
<v-btn v-else>No admin</v-btn>

Now, i've read https://laravel.com/docs/7.x/sanctum many, many times - and

Route::middleware('auth:sanctum')->get('/user', function(Request $request) {
   return $request->user();
});

returns my user fine, however i have no idea how to create the scope in the backend, through a token (i assume?) and accessing that scope in the frontend nuxtjs.


Solution

  • Found a solution for now :) Explanation: Set a scope, when nuxtjs retrieves your user information from the laravel GET user call

    Route::middleware('auth:sanctum')->get('/user', function(Request $request) {
     $user = $request->user();
     $user['scope'] = $user->insertScopeMethod();
     return $user;
    });