MERN栈下客户端中止请求时终止Node.js后端处理的方案咨询

全局中间件实现请求取消监听 #

首先创建一个全局Express中间件，为每个请求附加AbortController，并监听请求的close和aborted事件，一旦触发就中止后续任务：

app.use((req, res, next) => {
  const abortController = new AbortController();
  req.abortController = abortController;
  req.signal = abortController.signal;

  const cleanup = () => {
    abortController.abort();
    // 移除监听避免内存泄漏
    req.off('close', cleanup);
    req.off('aborted', cleanup);
  };

  // 监听连接关闭（如浏览器关闭标签）和主动中止事件
  req.on('close', cleanup);
  req.on('aborted', cleanup);

  next();
});

适配Mongoose查询的取消 #

Mongoose从v6.0开始支持AbortSignal，只需在查询或游标中传入signal参数，请求中止时会自动终止数据库操作：

async function getLargeDataset(req, res) {
  try {
    // 使用游标分块获取数据，传入中止信号
    const cursor = await YourModel.find({}).cursor({ signal: req.signal });
    
    // 流式返回数据，每处理一块就检查信号状态
    for await (const doc of cursor) {
      if (req.signal.aborted) break;
      res.write(JSON.stringify(doc) + '\n');
    }
    res.end();
  } catch (err) {
    // 捕获中止错误，无需返回错误响应给已断开的客户端
    if (err.name === 'AbortError') {
      console.log('请求已中止，数据库查询已取消');
      return;
    }
    res.status(500).json({ error: err.message });
  }
}

通用异步任务的取消处理 #

对于自定义的长时间运行任务（如数据分块处理），可以通过监听signal的abort事件，或在任务步骤中检查信号状态来终止操作：

async function processLargeData(req, res) {
  try {
    const rawData = await fetchRawDataFromDB(); // 初始数据获取

    // 注册中止回调，清理资源
    req.signal.addEventListener('abort', () => {
      console.log('任务中止，清理临时资源');
      // 这里可以添加临时文件删除、数据库连接释放等逻辑
    });

    // 分块处理，每步检查信号是否已中止
    for (const chunk of rawData.splitIntoChunks()) {
      if (req.signal.aborted) throw new Error('请求已中止');
      await processSingleChunk(chunk);
      res.write(`块 ${chunk.id} 处理完成\n`);
    }

    res.end('所有数据处理完成');
  } catch (err) {
    if (err.message === '请求已中止' || err.name === 'AbortError') {
      return;
    }
    res.status(500).json({ error: err.message });
  }
}

前端配合发起可中止请求 #

前端使用AbortController发起请求，并在用户导航离开、刷新页面时主动中止请求：

const abortController = new AbortController();
const { signal } = abortController;

// 页面卸载时中止请求
window.addEventListener('beforeunload', () => {
  abortController.abort();
});

// 发起流式请求
fetch('/api/process-large-data', { signal })
  .then(res => {
    const reader = res.body.getReader();
    return new ReadableStream({
      start(controller) {
        function push() {
          reader.read().then(({ done, value }) => {
            if (done) {
              controller.close();
              return;
            }
            controller.enqueue(value);
            push();
          }).catch(err => {
            if (err.name !== 'AbortError') console.error(err);
          });
        }
        push();
      }
    });
  })
  .then(stream => new Response(stream))
  .then(res => res.text())
  .then(data => console.log(data))
  .catch(err => {
    if (err.name === 'AbortError') console.log('请求已主动取消');
  });

关键注意事项 #

• 确保Mongoose版本≥6.0，才能支持AbortSignal参数；
• 对于非Mongoose的异步操作，必须手动检查signal.aborted状态或监听abort事件，否则无法中止；
• 捕获AbortError后无需向客户端返回响应，因为连接已经断开；
• 移除事件监听避免内存泄漏，尤其是在长时间运行的服务器中。

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