SvelteKit生产环境下带附件的POST请求异常缓慢问题排查

一、优先排查并优化反向代理连接配置 #

你的环境中存在前后端反向代理，这是引发请求阻塞的核心嫌疑点。以Nginx为例，调整以下关键配置：

• 启用后端长连接复用：在upstream块中添加keepalive 32;，同时在对应location的proxy配置里补充：

  proxy_http_version 1.1;
  proxy_set_header Connection "";
  

  让Nginx与后端Django保持长连接，避免频繁创建连接的开销。
• 调整前端到代理的连接参数：设置client_max_body_size 10M;（预留足够文件上传余量），同时调大keepalive_timeout 65;和keepalive_requests 100;，防止连接过早被关闭或耗尽。

二、前端请求策略优化 #

1. 控制并发请求数（替代完全串行） #

当前串行发送请求的逻辑，可能因未释放的旧连接占用连接池，导致后续请求阻塞。改成限制并发数（如同时发送2-3个请求），既不触发浏览器并发限制，又能提升效率：

async function requestAsyncTask() {
    const concurrencyLimit = 2;
    let activeRequests = 0;
    let index = 0;

    async function processNext() {
        if (index >= forms.length) return;
        const formItem = forms[index];
        index++;
        activeRequests++;

        formItem.stage.status = 'pending';
        const form = new FormData();
        form.append('file', formItem.file[0]);

        try {
            const response = await fetch(formItem.query, {
                method: "POST",
                body: form
            });
            formItem.stage.status = response.ok ? 'success' : 'error';
        } catch (err) {
            formItem.stage.status = 'error';
        } finally {
            activeRequests--;
            processNext();
        }
    }

    // 启动初始并发请求
    for (let i = 0; i < concurrencyLimit; i++) {
        processNext();
    }

    // 等待所有请求完成
    while (activeRequests > 0 || index < forms.length) {
        await new Promise(resolve => setTimeout(resolve, 100));
    }
    ableToClose = true;
}

onMount(() => {
    requestAsyncTask();
});

2. 强制浏览器不复用旧连接（临时排查/应急解决） #

虽然无法手动设置Connection头，但可以给每个请求URL添加随机查询参数，让浏览器识别为新请求路径，避免复用可能卡住的持久连接：

// 在fetch时追加随机时间戳参数
const response = await fetch(`${forms[i].query}?t=${Date.now()}`, {
    method: "POST",
    body: form
});

三、后端Django与WSGI服务器配置调整 #

• 调整WSGI服务器参数：如果使用Gunicorn，设置--workers 4 --timeout 120，确保有足够worker处理请求，避免请求排队；如果是UWSGI，调大processes和harakiri_timeout参数。
• 修改Django上传限制：在settings.py中设置：

  DATA_UPLOAD_MAX_MEMORY_SIZE = 10485760  # 10MB
  FILE_UPLOAD_MAX_MEMORY_SIZE = 10485760
  

  确保文件上传不会因内存限制被阻塞。
• 排查中间件：临时禁用非必要的日志、权限验证类中间件，确认是否有耗时逻辑阻塞请求。

四、Docker网络排查 #

因为应用是Docker化部署，检查以下网络配置：

• 尝试将容器网络模式从桥接改为host模式（仅限局域网环境），排除Docker网络桥接带来的额外延迟。
• 在前端容器内执行curl命令测试后端上传接口，确认延迟是否来自浏览器层面：

  curl -X POST -F "file=@test.xlsx" http://backend-url/upload
  

五、浏览器层面验证 #

• 打开Firefox的about:networking或Chrome的chrome://net-internals，查看当前连接状态，确认是否有大量idle或stalled状态的连接占用连接池。
• 单独测试单个文件上传，如果单个文件无延迟，说明问题集中在批量上传的连接复用或并发策略上。

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