Nuxt.js / Sanctum : $auth.user still empty

Question

Little question: my authentication with Sanctum has issues... My login fonction:

const response = await axios.get(`${process.env.apiUrl}/sanctum/csrf-cookie`)
console.log(response)

const res = await this.$auth.loginWith('laravelSanctum', {
  data: {
    email: this.userLogin.login.email,
    password: this.userLogin.login.password,
  }
})

console.log(res);
console.log(this.$auth)
this.$router.push('/mon-compte/mon-espace');

In local:

• The first consoleLog is ok, API CSRF Cookie is OK.
• The second consoleLog is ok too, API Login is OK.
• The third consoleLog is ok, $auth.user contain all informations returned by API Login.

3 APIs are called : csrf-cookie / login / user.

I'm connected.

But in Staging (prod dev):

• The first consoleLog is ok, API CSRF Cookie is OK.
• The second consoleLog is ok too, API Login is OK.
• The third consoleLog is not ok, $auth.user is empty.

Only 2 APIs are called: csrf-cookie / login.

I don't understand...

My nuxt.config.js:

auth: {
    strategies: {
      'laravelSanctum': {
        provider: 'laravel/sanctum',
        url: process.env.apiUrl,
        endpoints:{
          login: {
            url: '/api/login',
            method: 'post',
            propertyName: 'access_token'
          },
          user: {
            url: '/api/user',
            method: 'get',
            propertyName: false
          },
          logout: {
            url: '/api/logout',
            method: 'post'
          },
        },
        register: {
          url: '/api/register',
          method: 'post'
        }
      }
    },
    redirect: {
      login: '/mon-compte/login',
      logout: '/mon-compte/login',
      home: '/mon-compte/mon-espace',
      register: '/mon-compte/register'
    }
  },

And on Laravel, api.php:

Route::apiResource('user', UserController::class);
Route::post('/login', [AuthController::class, 'login']);
Route::post('/logout', [AuthController::class, 'logout']);
Route::post('/register', [AuthController::class, 'register']);
Route::post('/me', [AuthController::class, 'me']);

And my authController:

public function register(Request $request)
    {
        $validateData = $request->validate([
            'name' => 'required|string|max:255',
            'email' => 'required|string|email|max:255|unique:users',
            'password' => 'required|string|min:8'
        ]);

        $user = User::create([
            'email' => $validateData['email'],
            'name' => $validateData['name'],
            'type' => 'user',
            'password' => bcrypt($validateData['password'])
        ]);

        $token = $user->createToken('auth_token')->plainTextToken;

        return response()->json([
            'access_token' => $token,
            'token_type' => 'Bearer'
        ]);
    }


    public function login(Request $request)
    {
        if (!Auth::attempt($request->only('email', 'password'))) {
            return response()->json([
             'message' => 'Login information is invalid.'
           ], 401);
        }

        $user = User::where('email', $request['email'])->firstOrFail();
        $token = $user->createToken('authToken')->plainTextToken;

        return response()->json([
            'access_token' => $token,
            'token_type' => 'Bearer',
            'user' => $user
        ]);
    }

    public function me(Request $request)
    {
        return response()->json(['data' => $request->user(), "result" => true]);
    }

    public function logout(Request $request){
        Auth::logout();
        auth()->guard('sanctum')->logout();
        //auth('sanctum')->logout();

        $request->session()->invalidate();
        $request->session()->regenerateToken();

        return response()->json(['message' => 'Client successfully signed out']);
    }

Any ideas? What i'm doing wrong?

Thanks a lot!

Answer 1

I believe you don't have a user endpoint to fetch the user after login, because nuxt-auth will do an api request to the endpoint you set in your nuxt.config.js which fethes the logged in user.

And for CSRF token you don't need to make the request the nuxt-auth will take care of that.

public function me(Request $request)
{
    return response()->json(['data' => $request->user(), "result" => true]);
}