技术经验分享:axios的全局配置baseUrl

简介: 技术经验分享:axios的全局配置baseUrl

"

在发出请求之前,可以做一些配置信息,这样可以带来一些额外的好处。

1、设置超时时间:请求发出去之后,如果隔了多少时间后台没有响应,前端认为已经出错了,超时了。

2、baseURL:向后台发请求的时候我们可以提前设置一下后台基准的请求地址,这样后面再发请求的时候,只需要写后面的路径就可以了。

// 创建axios实例

const service = axios.create({

// baseURL: '',

baseURL: '/api',

timeout: 5000000

})

//代码效果参考: https://v.youku.com/v_show/id_XNjQwNjg0ODkyMA==.html

如果baseURL值为那么就会拼接js中的路径,如果是/area/findAreasByPCity,则会访问

如果baseURL值为/api,则在proxytable中代码如下:

proxyTable: {

'/api': {

target:

changeOrigin://代码效果参考:https://v.youku.com/v_show/id_XNjQwNjg0ODk1Mg==.html

true

}

},

如果是/area/findAreasByPCity,从而访问

3、设置请求头

4、配置axios请求头中的content-type为指定类型

axios.defaults.headers.post【'Content-Type'】 = 'application/x-www-form-urlencoded';

感谢您的阅读,如果您觉得阅读本文对您有帮助,请点一下“推荐”按钮。本文欢迎各位转载,但是转载文章之后必须在文章页面中给出作者和原文连接。


"
image.png
相关文章
|
3月前
|
移动开发 JavaScript 前端开发
"解锁axios GET请求新姿势!揭秘如何将数组参数华丽变身,让你的HTTP请求在云端翩翩起舞,挑战技术极限!"
【8月更文挑战第20天】二维码在移动应用中无处不在。本文详述了在UniApp H5项目中实现二维码生成与扫描的方法。通过对比插件`uni-app-qrcode`和库`qrcode-generator`生成二维码,以及使用插件和HTML5 API进行扫描,帮助开发者挑选最佳方案。无论是即插即用的插件还是灵活的JavaScript实现,都能满足不同需求。
38 0
|
5月前
|
JSON 前端开发 JavaScript
技术经验分享:Axios的基本介绍
技术经验分享:Axios的基本介绍
39 0
|
5月前
|
JSON 前端开发 JavaScript
技术经验分享:Axios的基本介绍
技术经验分享:Axios的基本介绍
35 0
|
5月前
|
JSON JavaScript API
Vue2和Vue3axios的如何使用,Vue3全局配置axios,axios全局配置
Vue2和Vue3axios的如何使用,Vue3全局配置axios,axios全局配置
|
6月前
axios封装和配置
axios封装和配置
70 0
|
6月前
Vue3 配置代理和使用全局axios请求数据
Vue3 配置代理和使用全局axios请求数据
675 1
|
6月前
【Axios】配置默认值及拦截器代码逐行详解
【Axios】配置默认值及拦截器代码逐行详解
79 0
|
6月前
|
移动开发 JavaScript 前端开发
ElementUI实现登录注册啊,axios全局配置,CORS跨域
ElementUI实现登录注册啊,axios全局配置,CORS跨域
69 0
|
11月前
|
数据处理
Axios 默认配置 简化URL 简化代码 多台服务器接口配置
Axios 默认配置 简化URL 简化代码 多台服务器接口配置
|
11月前
|
JavaScript
Axios简单使用与配置安装-Vue
Axios简单使用与配置安装-Vue

热门文章

最新文章

  • 1
    若依修改,若依如何发送请求---王清江07,axios的请求在request.js文件中,若依发送GET请求,必须用param
    127
  • 2
    axios发送post请求,如何接受和返回一个axios的字段,解决bug的方法,困难的事情先从简单做起,先从发送一个axios的post请求做起,解决方法查别人的资料,查看F12看network就行
    42
  • 3
    文本,前后端数据交互,简单请求,如何去给data数据赋值,在mounted()里赋值,利用axios发送的请求,res就是数据集,就是后端的数据,this.users = res.data.data
    46
  • 4
    Request failed with status code 400,使用axios.post要发送参数,认真比对原项目,看看有没有忘记什么?
    87
  • 5
    vue3 在 watchEffect 里中断未完成的 axios 请求(只保留最后一次请求的方法---连续点击查询按钮的优化)
    122
  • 6
    前后端数据交互.js文件的axios的写法,想要往后端发送数据,页面注入API,await的意思是同步等待服务器数据,并返回,axios注入在其他页面,其他页面调用的时候,同步作用
    44
  • 7
    前后端数据交互,API风格组合式API和选项式API,setup是一个标识,组合式编写的意思,使定义count.value的值自增的写法,组合式API使用axios的写法,ref定义响应数据写法
    29
  • 8
    网页设计,若依项目修改(It must be done)02------axios封装后发get请求,axios请求的位置在呢?
    47
  • 9
    前后端数据交互之axios的路径怎样找?axios的路径是那个,是你打开Tomcat之后,出现的路径+你项目写的接口路径
    35
  • 10
    数据交互,前后端数据请求,axios请求,对象结构的使用,E6的使用,结构赋值是什么?函数形参的obj如何,函数形参的obj就改成对象结构接收传入的数据对象
    26
  • 下一篇
    无影云桌面