如何移除Nuxt中createError响应的stack字段？

我在Nuxt中编写了用于数据验证的服务器API，代码如下：

export default defineEventHandler(async (event) => {
  const body = await readBody(event);

  const result = schema.safeParse(body);

  if (result.success === false) {
    const error = result.error;

    const customError = createError({
      statusCode: 412,
      statusMessage: `${error.errors[0].path} ${error.errors[0].message}`,
    });
    throw customError;
  }

  return { ok: true };
});

当输入不合法时，createError返回的响应会包含stack字段，示例响应：

{
    "url": "/api/car/listings",
    "statusCode": 412,
    "statusMessage": "make Required",
    "message": "make Required",
    "stack": "<pre><span class=\"stack internal\">at createError (/H:/nuxt/cartrader/node_modules/h3/dist/index.mjs:48:15)</span>\n<span class=\"stack\">at /H:/nuxt/cartrader/.nuxt/dev/index.mjs:794:25</span>\n<span class=\"stack internal\">at process.processTicksAndRejections (node:internal/process/task_queues:95:5)</span>\n<span class=\"stack internal\">at async Object.handler (/H:/nuxt/cartrader/node_modules/h3/dist/index.mjs:723:19)</span>\n<span class=\"stack internal\">at async Server.toNodeHandle (/H:/nuxt/cartrader/node_modules/h3/dist/index.mjs:798:7)</span></pre>"
}

尝试通过delete customError.stack删除时，仅清空了字段内容但字段仍存在：

{
    "url": "/api/car/listings",
    "statusCode": 412,
    "statusMessage": "make Required",
    "message": "make Required",
    "stack": "<pre></pre>"
}

解决方案 #

方法1：全局错误处理中间件 #

创建server/middleware/remove-stack.ts文件，通过全局中间件拦截错误并修改响应：

export default defineEventHandler((event) => {
  onError((error) => {
    // 彻底删除错误对象的stack属性
    delete (error as any).stack;
    // 自定义返回的响应内容
    event.res.setHeader('Content-Type', 'application/json');
    event.res.end(JSON.stringify({
      url: error.url,
      statusCode: error.statusCode,
      statusMessage: error.statusMessage,
      message: error.message
    }));
  });
});

方法2：配置Nitro全局错误处理 #

在nuxt.config.ts中通过Nitro配置直接处理错误响应，从根层面移除stack字段：

export default defineNuxtConfig({
  nitro: {
    server: {
      onError: (error, event) => {
        delete (error as any).stack;
        return new Response(JSON.stringify({
          statusCode: error.statusCode,
          statusMessage: error.statusMessage,
          message: error.message,
          url: event.node.req.url
        }), {
          status: error.statusCode,
          headers: { 'Content-Type': 'application/json' }
        });
      }
    }
  }
});

方法3：直接返回自定义错误响应 #

不使用throw createError，直接构建并返回错误响应，完全控制输出内容：

export default defineEventHandler(async (event) => {
  const body = await readBody(event);

  const result = schema.safeParse(body);

  if (result.success === false) {
    const error = result.error;
    const errorMsg = `${error.errors[0].path} ${error.errors[0].message}`;
    setResponseStatus(event, 412);
    return {
      statusCode: 412,
      statusMessage: errorMsg,
      message: errorMsg,
      url: event.node.req.url
    };
  }

  return { ok: true };
});

方法4：覆盖错误序列化逻辑 #

自定义h3的错误序列化函数，只保留需要的字段：
创建server/utils/error-serializer.ts：

export default defineEventHandler((event) => {
  event.context.serializeError = (error) => {
    return {
      statusCode: error.statusCode,
      statusMessage: error.statusMessage,
      message: error.message,
      url: error.url
    };
  };
});

然后在nuxt.config.ts中注册该中间件：

export default defineNuxtConfig({
  serverMiddleware: [
    '~/server/utils/error-serializer.ts'
  ]
});

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