Nuxt.js SSR模式下@nuxtjs/axios报Cannot set headers错误求助

根据你的描述和错误栈信息，这个问题的核心是服务器已经向客户端发送响应（Headers已发送）后，代码仍尝试修改响应Headers（此处为设置Cookie），触发点来自Nuxt Auth模块的Token同步逻辑。结合你的场景，给出以下针对性解决思路：

一、先修正axios请求代码的明显错误 #

你的请求处理代码中存在变量未定义的问题，这可能导致异常流程触发后续的Auth模块错误：

// 原错误代码中，Promise.reject里的res未定义，因为then回调解构的是{ status, data }
return this.$axios[method](url, data, config).then(function({ status, data }) {
    if (status > 199 && status < 300) {
        return data;
    }
    // 修正：用当前的data和status替代未定义的res
    return Promise.reject(
        new Error(data.error || "Api request failed", status)
    );
});

这个错误在开发环境可能被忽略，但生产环境的严格错误处理会触发Auth模块的异常分支，导致后续的Cookie设置时机错误。

二、调整Nuxt Auth模块的自动行为 #

错误栈显示问题出在runtime_Token.sync和setCookie，说明Auth模块在响应发送后仍在尝试同步Token到Cookie。你可以通过修改nuxt.config.js中的Auth配置，避免自动操作在响应发送后执行：

// nuxt.config.js
export default {
  auth: {
    strategies: {
      local: {
        token: {
          global: false, // 关闭全局自动携带Token，改为手动在需要的接口设置
        },
        autoFetchUser: false // 关闭自动获取用户信息，避免异步操作在页面响应后执行
      }
    },
    // 可选：如果不需要服务器端同步Cookie，可调整存储方式
    // storage: 'localStorage'
  }
}

关闭autoFetchUser能避免Auth模块在页面渲染完成后触发异步的用户信息请求，进而避免后续的Cookie设置操作。

三、检查特定页面的异步逻辑 #

仅3个页面触发错误，说明这些页面的asyncData或fetch存在特殊逻辑：

• 确保页面中所有Auth相关操作（如$auth.check()）和API请求都被await，避免页面渲染完成（响应已发送）后还有未完成的异步任务：

async asyncData({ $axios, $auth }) {
  // 先确保Auth检查完成，再执行API请求
  await $auth.check()
  const pageData = await $axios.get('/api/target-data')
  return { pageData }
}

• 避免在asyncData/fetch之外的钩子（如mounted）中触发需要服务器端设置Cookie的Auth操作，因为mounted仅在客户端执行，不会影响SSR，但如果服务器端有残留的异步任务仍会触发错误。

四、排查服务器端上下文污染问题 #

重启服务器后能正常打开一次，之后持续报错，说明服务器端的Auth状态可能没有被正确隔离。Nuxt默认会隔离每个请求的上下文，但如果你的代码中有全局共享的状态（如自定义的Auth缓存），会导致后续请求复用错误的上下文。

检查是否有自定义的全局状态管理代码，确保每个请求的Auth状态都是独立的，避免跨请求污染。

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