Laravel PUT/PATCH请求返回302并重定向至前端URL问题排查

问题场景 #

Laravel 端配置 #

api.php 路由：

Route::group(['prefix' => 'admin'], function() {
    Route::group(['prefix' => 'images'], function() {
        Route::put('/{image}', [\App\Http\Controllers\ImagesController::class, 'update']);
    });
});

控制器 Update 方法：

public function update(Image $image, ImageData $data) {
    $image->update([
        'title' => $data->title,
        'source' => $data->source
    ]);
    return response('', 200);
}

Nuxt 端请求代码 #

封装的请求函数：

export const useApiFetch = async <T>(request, opts?) => {
    const config = useRuntimeConfig()
    return useFetch<T>(request, {baseURL: config.public.apiBase, ...opts})
}

组件内请求逻辑：

const finishEditing = async () => {
    await useApiFetch(`admin/images/${image.id}`, {
        method: 'PUT',
        data: props.image
    })
    store.editingTitle = false
    store.editingSource = false
}

问题原因 #

PUT/PATCH 请求返回 302 重定向的核心原因是 Laravel 的 CSRF 验证失败，触发了默认重定向逻辑：

1. 即使路由定义在 api.php，如果请求携带了 Laravel 的 Session Cookie（比如用户此前通过 Web 端登录过），Laravel 会将该请求识别为 Web 会话请求，自动启用 VerifyCsrfToken 中间件校验。
2. Nuxt 发送的 PUT 请求未携带 CSRF 令牌，导致校验失败，Laravel 返回 302 重定向到应用首页（即你的前端地址 localhost:3000）。

解决方案 #

方案1：排除API路由的CSRF校验 #

在 Laravel 的 app/Http/Middleware/VerifyCsrfToken.php 中，将目标API路由添加到 $except 数组，跳过CSRF验证：

protected $except = [
    'admin/images/*', // 或更宽泛的 'admin/*'
];

方案2：在请求中携带CSRF令牌 #

如果API依赖Session会话（比如使用Web登录态），需在Nuxt请求中携带CSRF令牌：

1. 在Laravel入口页输出CSRF令牌：

<meta name="csrf-token" content="{{ csrf_token() }}">

2. 在Nuxt请求函数中添加对应请求头：

export const useApiFetch = async <T>(request, opts?) => {
    const config = useRuntimeConfig()
    const csrfToken = document.querySelector('meta[name="csrf-token"]')?.content
    return useFetch<T>(request, {
        baseURL: config.public.apiBase,
        headers: {
            'X-XSRF-TOKEN': csrfToken,
            ...opts?.headers
        },
        ...opts
    })
}

方案3：确保API路由使用无状态中间件 #

检查 app/Providers/RouteServiceProvider.php，确认 api.php 路由使用 api 中间件组（默认配置），该组不包含VerifyCsrfToken和StartSession中间件，避免触发会话相关校验：

public function boot()
{
    $this->routes(function () {
        Route::middleware('api')
            ->prefix('api')
            ->group(base_path('routes/api.php'));

        // ...其他路由配置
    });
}

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