前端web页面请求后端服务时,接口出现50s初始连接超时

问题描述:

前端web页面请求后端服务时,接口一直出现50s超时,有时某些接口偶尔会出现50s超时,超时时间都是初始连接阶段,如下图,后端也看不到任何报错。单独用apifox去调接口,接口又都好着了,只要把前端服务重启下就好了,但过一段时间,问题又出现了,又得重启前端服务。

问题定位:

由于前端是vue+nginx部署,检查nginx配置,发现问题了,如图:

下面是nginx配置:

  1. 发现未配置 proxy_connect_timeout(连接超时)、proxy_send_timeout(发送超时),Nginx 默认的连接超时就是50 秒,完美对应你截图里的 50 秒超时!
  2. 同时,你没配置 Connection: close,Nginx 默认复用长连接,一旦后端服务重启 / 网络波动,就会产生死连接,新请求被阻塞在连接池,直到 50 秒超时。

修复后,如下所示:

按照下面修改后,问题解决!

相关推荐
jiayong232 小时前
0基础学习VUE3 第 3 课:任务页怎么把列表、筛选、表单、弹窗串起来
前端·javascript·学习
蜡台2 小时前
Monorepo 架构管理多个子项目实现
前端·javascript·vue.js·pnpm·monorepo
guojb8242 小时前
从0开始设计一个树和扁平数组的双向同步方案
前端·数据结构·vue.js
前端小趴菜052 小时前
Vue项目,前端如何来做登录密码加密传输?
前端·javascript·vue.js
tangdou3690986552 小时前
图文并茂安装Claude Code 以及配置 Coding Plan 教程
前端·人工智能·后端
arvin_xiaoting2 小时前
OpenClaw学习总结_II_频道系统_4:Slack集成详解
前端·学习·自动化·llm·ai agent·飞书机器人·openclaw
CHU7290352 小时前
让知识传递更顺畅:在线教学课堂APP的功能设计
前端·人工智能·小程序
周淳APP2 小时前
【React Hook全家桶】大致过一遍React Hooks
前端·javascript·react.js·前端框架·react hooks