Vue前端开发-axios默认配置和响应结构

配置对象可以在发送请求和实例化axios对象时进行配置,也可以通过 defaults 对象,设置默认的配置值,该配置值的优先级高于模块库的默认值,将会作用于每一个请求,除非在请求时,通过config对象进行变更,设置默认配置的格式如下代码所示:

csharp 复制代码
axios.defaults.baseURL="http://rttop.cn/api";
axios.defaults.timeout=2000;

创建一个axios实例后,也可以修改设置的默认配置,如下代码所示:

csharp 复制代码
// 初始设置默认值
axios.defaults.timeout=2000;
// 创建一个axios实例对象
const request = axios.create({
    baseURL: "http://rttop.cn/api"
})
// 修改默认配置属性
request.defaults.timeout=3000;

除了设置和修改默认配置之外,发送一次请求后,无论成功与失败,都将会返回响应的数据,并通过then或catch函数来获取,通常情况下,一个请求的响应数据对象中,包含的数据结构信息如下列代码所示:

csharp 复制代码
{
  data: {},
  status: 200,
  statusText: 'OK',
  headers: {},
  config: {},
  request: {}
}

上述响应数据结构的属性值说明如下:

  • data: 由服务端返回的响应数据,源于服务端的数据设计。

  • status: 来源于服务端响应http请求的状态码,如200表示请求正常。

  • statusText: 来源于服务端响应http请求的状态信息,如OK表示请求正常。

  • headers: 返回服务端响应的头部信息。

  • config: 返回发送axios请求时的配置信息。

  • request: 返回生成请求响应的对象,浏览器为 XMLHttpRequest 实例。

相关推荐
哟哟耶耶1 分钟前
css-设置元素的溢出行为为可见overflow: visible;
前端·css
sunly_4 分钟前
CSS:跑马灯
前端·css
2301_8187320612 分钟前
用layui表单,前端页面的样式正常显示,但是表格内无数据显示(数据库连接和获取数据无问题)——已经解决
java·前端·javascript·前端框架·layui·intellij idea
yqcoder13 分钟前
npm link 作用
前端·npm·node.js
林涧泣18 分钟前
【Uniapp-Vue3】页面和路由API-navigateTo及页面栈getCurrentPages
前端·vue.js·uni-app
Komorebi゛20 分钟前
【uniapp】获取上传视频的md5,适用于APP和H5
前端·javascript·uni-app
林涧泣26 分钟前
【Uniapp-Vue3】动态设置页面导航条的样式
前端·javascript·uni-app
杰九43 分钟前
【全栈】SprintBoot+vue3迷你商城(10)
开发语言·前端·javascript·vue.js·spring boot
Hopebearer_1 小时前
入门 Canvas:Web 绘图的强大工具
前端·javascript·es6·canva可画
ILUUSION_S1 小时前
Vue平台开发三——项目管理页面
javascript·vue.js