如何在Nuxt 3的Nitro中设置Cookie？代理Laravel接口遇401

1. 在Route Rules中直接转发Cookie #

默认Nitro代理不会自动传递请求Cookie到目标服务器，你可以通过headers配置手动转发：

export default defineNuxtConfig({
  nitro: {
    routeRules: {
      '/api/**': {
        proxy: 'https://dev.project.com/api/**',
        headers: {
          // 从当前请求中获取Cookie并转发给目标服务器
          Cookie: event => event.req.headers.cookie || ''
        }
      },
    },
  }
});

2. 调整Laravel的Cookie跨域配置 #

如果前端域名与dev.project.com不同，需确保Laravel设置的Cookie允许跨域访问：
打开Laravel项目的config/session.php，修改以下配置：

// 设置为你的根域名，确保前端域名能访问Cookie
'domain' => '.project.com',
// 生产环境建议开启Secure
'secure' => env('SESSION_SECURE_COOKIE', true),
// 根据跨域场景选择Lax或None（HTTPS下用None需配合Secure）
'same_site' => 'lax',

3. 使用自定义Nitro中间件实现灵活代理 #

如果Route Rules配置不够灵活，可以创建自定义服务器中间件精细控制代理逻辑：

在server/middleware/proxyApi.ts中编写中间件：

export default defineEventHandler(async (event) => {
  // 拼接目标API地址
  const targetUrl = 'https://dev.project.com' + event.node.req.url;
  
  // 转发请求头，包含Cookie和正确的Host
  const headers = {
    ...event.node.req.headers,
    host: 'dev.project.com'
  };

  // 发送代理请求，确保携带Cookie
  return await $fetch(targetUrl, {
    method: event.node.req.method,
    headers,
    body: event.node.req.method !== 'GET' ? await readBody(event) : undefined,
    credentials: 'include'
  });
});

然后在nuxt.config.js中注册这个中间件：

export default defineNuxtConfig({
  serverMiddleware: [
    { path: '/api/**', handler: '~/server/middleware/proxyApi.ts' }
  ]
});

4. Laravel Sanctum认证场景额外配置 #

如果Laravel API使用auth:sanctum中间件，除了Cookie还需传递X-XSRF-TOKEN头：
在Nuxt中创建插件（plugins/sanctum.ts）全局配置请求头：

export default defineNuxtPlugin(() => {
  const xsrfToken = useCookie('XSRF-TOKEN').value || '';
  useFetch().defaults.headers.common['X-XSRF-TOKEN'] = xsrfToken;
});

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