如何在Nuxt 3中移除或修改响应头X-Powered-By: Nuxt

问题说明 #

升级到Nuxt3正式版后，通过服务器中间件移除或覆盖默认X-Powered-By: Nuxt响应头的尝试均失败，原有的旧版中间件写法已被弃用，新写法无法生效：

无效的新中间件代码 #

export default defineEventHandler((event) => {
  event.node.res.removeHeader('x-powered-by') // 无法移除目标响应头
  event.node.res.setHeader('x-powered-by', 'Something Else') // 无法覆盖响应头内容
})

已弃用的旧方法代码 #

import type { IncomingMessage, ServerResponse } from 'http'

export default async (req: IncomingMessage, res: ServerResponse) => {
  res.setHeader('x-powered-by', 'Something Else')
}

可行解决方案 #

Nuxt3底层的Nitro引擎会在响应发送流程的后期自动添加X-Powered-By: Nuxt头，普通中间件的执行时机早于这个步骤，导致修改被覆盖。可以通过以下两种方式解决：

方式1：通过Nitro钩子拦截响应 #

在server/middleware目录下创建中间件文件，监听render:response钩子（该钩子在响应准备发送前触发）来修改响应头：

export default defineEventHandler((event) => {
  event.context.nitroApp.hooks.hook('render:response', (response) => {
    // 移除默认响应头
    delete response.headers['x-powered-by']
    // 设置自定义响应头内容
    response.headers['x-powered-by'] = 'Your Custom Value'
  })
})

方式2：直接修改Nuxt配置 #

在nuxt.config.ts中配置Nitro的响应头选项，这是更简洁的全局设置方式：

export default defineNuxtConfig({
  nitro: {
    headers: {
      'x-powered-by': 'Your Custom Value'
    }
  }
})

如果需要完全移除该响应头，将值设为false即可：

export default defineNuxtConfig({
  nitro: {
    headers: {
      'x-powered-by': false
    }
  }
})

内容的提问来源于stack exchange，提问作者sporadic-urchin