Nodejs中同浏览器访问express的相同route会被阻塞是为什么?

Node.js 中同浏览器访问 Express 的相同 route 会被阻塞的原因

问题背景

在开发一个提供抓取服务的 API 项目时，使用了 Express 框架。在测试过程中发现，在同一个浏览器的多个标签页访问同一个路由（route）时，请求会被阻塞。而在不同浏览器或通过多线程脚本访问时，则不会出现这种情况。

原因分析

这个问题的核心在于浏览器的行为和 Express 框架如何处理并发请求。具体来说：

1. 浏览器行为：

   • 当同一个浏览器的不同标签页（Tab）向同一个服务器发起请求时，这些请求可能会被浏览器进行一定的管理。
   • 浏览器通常会对来自同一站点的请求进行排队，以避免过多的并发请求导致服务器负载过高。

2. Express 处理机制：

   • Express 是基于 Node.js 构建的，Node.js 默认是非阻塞、事件驱动的架构。
   • 但是，当 Express 接收到请求时，它会根据请求的具体情况来决定如何处理这些请求。例如，如果请求中包含某些特定的头部信息（如 Cookie），可能会导致 Express 对这些请求进行顺序处理。

示例代码

为了更好地理解这一现象，我们可以通过以下简单的示例代码来模拟这种场景：

const express = require('express');
const app = express();
const port = 3000;

app.get('/test', (req, res) => {
    console.log(`Handling request: ${new Date().toISOString()}`);
    setTimeout(() => {
        res.send(`Response at ${new Date().toISOString()}`);
    }, 5000); // 模拟长时间处理
});

app.listen(port, () => {
    console.log(`Server running at http://localhost:${port}/`);
});

在这个示例中，当我们访问 /test 路由时，服务器会模拟一个耗时 5 秒的处理过程。如果我们同时在同一个浏览器的多个标签页中访问该路由，请求可能会被阻塞，直到上一个请求完成。

解决方案

要解决这个问题，可以尝试以下几种方法：

1. 使用不同的浏览器或无痕模式：这样可以避免浏览器对同一站点的请求进行排队。
2. 设置不同的 Cookie 或其他头部信息：这可能会改变请求的处理方式，从而避免阻塞。
3. 修改 Express 的中间件配置：例如，可以添加自定义的中间件来处理并发请求。

通过以上分析和示例代码，我们可以更好地理解为什么在同一个浏览器中访问相同的路由会导致请求被阻塞，并且知道如何解决这个问题。