SvelteKit开发模式下页面刷新无限Pending问题求助

• 排查服务器端请求阻塞

  • 重点检查该路由对应的+page.server.js/ts、+layout.server.js/ts文件，确认所有异步操作（数据库查询、外部API调用等）都能正常resolve/reject，有没有await了一个永远挂起的Promise。
  • 给异步操作加超时包装，强制触发错误来定位卡点：

    const withTimeout = (promise, timeoutMs = 5000) => {
      return Promise.race([
        promise,
        new Promise((_, reject) => setTimeout(() => reject(new Error('请求超时')), timeoutMs))
      ]);
    };
    // 替换你的异步调用：
    const data = await withTimeout(fetchCriticalData());
    

  • 在服务器端打印活跃请求/句柄，用Node.js内置方法排查未释放资源：

    console.log('活跃请求:', process._getActiveRequests());
    console.log('活跃句柄:', process._getActiveHandles());
    

• 清除浏览器端异常会话/缓存

  • 重启服务器后旧会话仍卡，说明浏览器持有异常状态。打开DevTools勾选「Disable cache」，或直接清空站点的LocalStorage、SessionStorage和Cookie后再测试刷新。
  • 可临时在服务器端关闭keep-alive配置，验证是否因持久连接未释放导致问题。

• 逐步简化路由代码定位问题

  • 先注释掉该路由所有异步数据获取、复杂逻辑，只返回静态HTML，看是否还会出现pending。如果正常，再逐步恢复代码块，定位到触发问题的具体逻辑。
  • 检查路由动态参数的解析逻辑，确认刷新时参数格式正确，没有导致服务器端无限循环处理。

• 排除外部干扰

  • 用浏览器隐私模式打开页面，排除AdBlock、代理工具等插件对请求的干扰。
  • 在DevTools Network面板查看pending请求的Initiator字段，确认请求发起者，排查是否存在循环调用、重复发起请求的情况。

• 针对SvelteKit开发服务器的检查

  • 确认该路由的ssr/csr配置（比如export const ssr = false）是否导致渲染逻辑冲突，尝试临时修改配置测试。
  • 启动开发服务器时加--no-hmr参数禁用热重载，验证修改后端文件时是否还会触发问题，排除热重载机制的异常。

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