Laravel Sanctum与Vue权限问题：前端已登录但后端返回未授权

核心问题1：前端Authorization头设置错误 #

你后端登录接口返回的是纯字符串格式的Token（因为直接return $user->createToken("token")->plainTextToken;），但前端代码里却尝试读取response.data.token——这里response.data本身就是Token字符串，根本没有token属性，导致你设置的Authorization头实际是Bearer undefined，直接破坏了后续请求的身份认证逻辑。

修复前端代码： #

把登录逻辑里的这行：

axios.defaults.headers.common['Authorization'] = `Bearer ${response.data.token}`;

改成：

axios.defaults.headers.common['Authorization'] = `Bearer ${response.data}`;

核心问题2：后端判断登录状态的路由未添加Sanctum中间件 #

你用来返回auth/guest的后端逻辑，所在的路由没有加上auth:sanctum中间件。Sanctum的用户认证是通过中间件触发的，只有经过这个中间件的请求，$request->user('sanctum')才能正确识别登录用户。

修复后端路由： #

假设判断登录状态的路由是/api/check-auth，需要给它加上中间件：

Route::middleware('auth:sanctum')->get('/api/check-auth', function (Request $request) {
    if ($request->user('sanctum')) {
        return "auth";
    } else {
        return "guest";
    } 
});

额外优化：后端登录接口返回格式统一 #

你后端登录接口里，return $user->createToken("token")->plainTextToken;之后的JSON返回代码永远不会执行，建议统一返回JSON格式，方便前端处理：

public function loginn(Request $request){
    $request->validate([
       'email' => 'required',
       'password' => 'required',
    ]);

    $user = User::where('email', $request->email)->first();
    if (! $user || ! Hash::check($request->password, $user->password)) {
        throw ValidationException::withMessages([
            'email' => ['The provided credentials are incorrect.'],
        ]);
    }
    $token = $user->createToken("token")->plainTextToken;
    return response()->json([
        'token' => $token,
        'type' => 'bearer',
        'expires_in' => auth()->factory()->getTTL() * 60
    ]);
}

这样前端就可以正常用response.data.token获取Token，和你原本的代码逻辑匹配，避免格式混淆。

验证步骤 #

1. 修复后端登录接口的返回逻辑，确保返回带token字段的JSON
2. 调整前端代码匹配后端返回格式（用纯字符串返回就取response.data，用JSON返回就取response.data.token）
3. 给判断登录状态的路由加上auth:sanctum中间件
4. 重新登录，检查请求头是否正确携带Bearer 你的Token
5. 再次调用判断接口，应该返回auth

内容的提问来源于stack exchange，提问作者aliana