Laravel中使用Sanctum Token实现API鉴权请求问题求助

一、后端配置先确认 #

• 受保护路由必须使用 auth:sanctum 中间件，示例代码：

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

• 检查 .env 里的 SANCTUM_STATEFUL_DOMAINS，要包含前端的完整域名（比如 localhost:3000，生产环境填实际域名）
• 确保 config/cors.php 配置正确：
  • paths 包含所有需要跨域的API路径（比如 ['api/*', 'sanctum/csrf-cookie']）
  • allowed_origins 设为前端域名数组，测试阶段可临时用 ['*']（生产环境禁用）
  • supports_credentials 设为 true，这是跨域携带Token/Cookie的核心配置

二、前端携带Token的两种实操方式 #

方式1：Authorization Bearer 头（最通用） #

登录成功后把后端返回的Token存在会话存储，请求时自动加到请求头：

1. 登录成功后存Token：

   // 假设登录接口返回 { token: 'xxx' }
   sessionStorage.setItem('sanctum_token', response.data.token);
   

2. 封装axios请求实例，自动注入Token：

   import axios from 'axios';
   
   const apiClient = axios.create({
       baseURL: 'http://你的Laravel后端域名',
   });
   
   // 请求拦截器，自动添加Token到请求头
   apiClient.interceptors.request.use(config => {
       const token = sessionStorage.getItem('sanctum_token');
       if (token) {
           config.headers.Authorization = `Bearer ${token}`;
       }
       return config;
   });
   
   // 调用示例
   apiClient.get('/api/user')
       .then(res => console.log(res.data))
       .catch(err => console.error('鉴权失败:', err));
   

方式2：Cookie存储（更安全） #

如果后端使用Sanctum的SPA模式，或手动将Token存入HttpOnly Cookie，前端只需开启请求带凭证：

import axios from 'axios';

const apiClient = axios.create({
    baseURL: 'http://你的Laravel后端域名',
    withCredentials: true // 自动携带Cookie
});

// 直接请求受保护路由即可
apiClient.get('/api/user')
    .then(res => console.log(res.data));

三、踩坑排查清单 #

• 查看浏览器Network面板：确认请求头里是否存在 Authorization: Bearer xxx，或Cookie是否包含Sanctum相关字段
• 检查后端日志：storage/logs/laravel.log 会记录鉴权失败的具体原因（比如Token过期、无效）
• 验证Token有效性：后端可通过 auth()->user() 打印当前用户，或用 PersonalAccessToken::findToken($token) 直接校验Token
• 跨域问题排查：若前端报CORS错误，回头检查 config/cors.php 的 supports_credentials 和 allowed_origins 配置

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