vue的axios配置超时时间;单个接口配置响应时间

11 篇文章 0 订阅

vue项目中axios请求统一配置了超时时间,单独接口请求时重设超时时间
根据官网推荐:axios中文文档

1.配置的优先顺序

配置会以一个优先顺序进行合并。这个顺序是:在 lib/defaults.js 找到的库的默认值,然后是实例的 defaults 属性,最后是请求的 config 参数。后者将优先于前者。
这里是一个例子:

// 使用由库提供的配置的默认值来创建实例
// 此时超时配置的默认值是 `0`
var instance = axios.create();

// 覆写库的超时默认值
// 现在,在超时前,所有请求都会等待 2.5 秒
instance.defaults.tineout = 2500;

// 为已知需要花费很长时间的请求覆写超时设置
instance.get('/longRequest’,{
	tineout:5000
});

2.统一配置默认超时时间:

export function newTaskAdd(data) {
  return request({
    url: '/api/taskPlan/add',
    method: 'post',
    data
  })
}

3.重设超时时间的接口请求:

export function newTaskAdd(data) {
  return request({
    url: '/api/taskPlan/add',
    method: 'post',
    timeout: 60 * 60 * 1000,
    data
  })
}

  • 10
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
Vue项目中使用Axios进行网络请求是非常常见的配置。下面是一个简单的Vue Axios配置的示例: 1. 首先,你需要在项目中安装Axios。可以使用npm或者yarn命令进行安装: ``` npm install axios ``` 或者 ``` yarn add axios ``` 2. 在Vue项目中创建一个单独的文件,例如`api.js`,用于封装Axios配置和请求方法。 ```javascript import axios from 'axios'; // 创建一个axios实例 const instance = axios.create({ baseURL: 'http://api.example.com', // 设置请求的基础URL timeout: 5000, // 设置请求超时时间 }); // 请求拦截器 instance.interceptors.request.use( (config) => { // 在发送请求之前做一些处理,例如添加请求头等 return config; }, (error) => { // 处理请求错误 return Promise.reject(error); } ); // 响应拦截器 instance.interceptors.response.use( (response) => { // 对响应数据进行处理,例如解析数据等 return response.data; }, (error) => { // 处理响应错误 return Promise.reject(error); } ); // 封装请求方法 export default { get(url, params) { return instance.get(url, { params }); }, post(url, data) { return instance.post(url, data); }, // 其他请求方法,例如put、delete等 }; ``` 3. 在需要使用Axios进行网络请求的组件中,引入`api.js`文件,并调用封装好的请求方法。 ```javascript import api from './api.js'; export default { methods: { fetchData() { api.get('/data') .then((response) => { // 处理请求成功的数据 }) .catch((error) => { // 处理请求失败的错误 }); }, }, }; ``` 这样,你就可以在Vue项目中使用Axios进行网络请求了。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值