前端请求超时截断,axios timeout设置未生效情况记录

问题描述

前端请求超时截断,axios timeout设置未生效情况记录

timeout设置方式:

表现(前端超过5min报错500,直接访问接口超过5min能够正常响应):

问题原因

上面的配置设置时间为1000min,明显配置没有生效

解决方式

1、修改axios的默认配置,这里修改为10min

复制代码
axios.defaults.timeout = 10 * 60 * 1000;
const res: any = await axios.post(smarturl, req_body, {
    headers: {'Content-Type': 'application/json'},
});

2、重写axios方法,这里修改为10min

复制代码
const HTTP_AXIOS = axios.create();
HTTP_AXIOS ({
    method: 'post',
    url: smarturl,
    data: req_body,
    timeout: 10 * 60 * 1000,
}).then(reqres => {
    if (reqres) {
        //请求成功后返回的参数
        console.log('res', reqres);
    }
}).catch(error => {
    if (error.config.timeout == 3000) {
        message.error('请求超时,请检查网络')
    } else {
        console.log('timeout-error', error)
    }
})

生效效果:

默认配置不再是5min,超过5min请求未被截断

相关推荐
小雨青年1 分钟前
Cursor 项目实战:AI播客策划助手(四)—— 产品发布与交付收尾
前端·人工智能
晚霞的不甘17 分钟前
Flutter for OpenHarmony《淘淘购物》主页点击跳转功能详解:从 UI 响应到页面导航的完整实现
前端·flutter·ui·搜索引擎·前端框架·交互
cooldream200918 分钟前
前端技术架构详解:Vue 3 + TypeScript + Vite 在具身 AI 系统中的实践
前端·架构·typescript
迟_39 分钟前
CSS-实现图片靠右
前端·css
weixin_3954489143 分钟前
下位机&yolov11输出
java·服务器·前端
秋秋秋秋秋雨1 小时前
基于若依的vue3+springboot3基础架构项目,前端优化
前端
Dragon Wu1 小时前
Web前端 认证token的安全存储策略
前端·javascript·安全·react.js·前端框架
橙露1 小时前
各类 Shell 优劣势深度解析与实战选型指南
前端·chrome
广州华水科技1 小时前
单北斗GNSS在变形监测中的应用与发展探讨
前端
克里斯蒂亚诺更新1 小时前
vue2 单文件组件加入浏览器的title和ico的方法
前端·javascript·html