Axios 默认配置 简化URL 简化代码 多台服务器接口配置

简介: Axios 默认配置 简化URL 简化代码 多台服务器接口配置

main.js配置

import Axios from 'axios'
Axios.defaults.method = 'GET'//设置默认的请求类型
Axios.defaults.baseURL = 'https://apis.jxcxin.cn/api'//设置接口地址
Axios.defaults.params = { token: 'abc' } //每次请求都带上这个参数
Axios.defaults.timeout = 5000 //请求的超时时间
Vue.prototype.$axios = Axios

简化接口地址

配置了baseURL 直接写路径即可

this.$axios.get('/title',//直接写路径即可
          {
            params: {
              id: 10
            }
          }).then(res => {
            console.log(res)
         })

多台服务器配置

如果存在多台服务器,有多个接口使用 Axios.defaults.baseURL 就直接写死了,这个时候可以二次封装要一下,

例如:登录,或数据处理不是同一个服务器上的

import Axios from 'axios'
Vue.prototype.$axiosServ1 = Axios.create({
  baseURL: 'www.BAIDU.com'
})
Vue.prototype.$axiosServ2 = Axios.create({
  baseURL: 'www.avc.com'
})
this.$axiosServ1.get('www.baidu.com').then(res => {
          console.log(res)
        })//服务器1
  this.$axiosServ2.get('www.baidu.com').then(res => {
          console.log(res)
        })//服务器2
相关文章
|
3月前
|
JavaScript 前端开发 开发者
vue中使用axios请求post接口,请求会发送两次
vue中使用axios请求post接口,请求会发送两次
|
2月前
|
JavaScript
axios中的那些天才代码!看完我实力大涨!
【10月更文挑战第13天】axios中的那些天才代码!看完我实力大涨!
31 1
|
3月前
axios全局做节流,解决多次点击导致多次请求接口
本文介绍了如何在Axios请求中实现全局节流,以防止用户快速多次点击导致重复发送相同请求的问题。
84 2
|
3月前
|
JavaScript 前端开发
vue配合axios连接express搭建的node服务器接口_简单案例
文章介绍了如何使用Express框架搭建一个简单的Node服务器,并使用Vue结合Axios进行前端开发和接口调用,同时讨论了开发过程中遇到的跨域问题及其解决方案。
66 0
vue配合axios连接express搭建的node服务器接口_简单案例
|
2月前
|
JavaScript API 开发工具
vue尚品汇商城项目-day02【11.对axios二次封装+12.接口统一管理】
vue尚品汇商城项目-day02【11.对axios二次封装+12.接口统一管理】
36 0
|
4月前
|
XML Android开发 UED
"掌握安卓开发新境界:深度解析AndroidManifest.xml中的Intent-filter配置,让你的App轻松响应scheme_url,开启无限交互可能!"
【8月更文挑战第2天】在安卓开发中,scheme_url 通过在`AndroidManifest.xml`中配置`Intent-filter`,使应用能响应特定URL启动或执行操作。基本配置下,应用可通过定义特定URL模式的`Intent-filter`响应相应链接。
119 12
|
4月前
|
Shell Android开发
安卓scheme_url调端:在AndroidManifest.xml 中如何配置 Intent-filter?
为了使Android应用响应vivo和oppo浏览器的Deep Link或自定义scheme调用,需在`AndroidManifest.xml`中配置`intent-filter`。定义启动的Activity及其支持的scheme和host,并确保Activity可由外部应用启动。示例展示了如何配置HTTP/HTTPS及自定义scheme,以及如何通过浏览器和adb命令进行测试,确保配置正确无误。
|
4月前
|
前端开发 API
【API管理 APIM】APIM中如何配置使用URL路径的方式传递参数(如由test.htm?name=xxx 变为test\xxx)
【API管理 APIM】APIM中如何配置使用URL路径的方式传递参数(如由test.htm?name=xxx 变为test\xxx)
|
5月前
|
JavaScript API
前后端数据交互.js文件的axios的写法,想要往后端发送数据,页面注入API,await的意思是同步等待服务器数据,并返回,axios注入在其他页面,其他页面调用的时候,同步作用
前后端数据交互.js文件的axios的写法,想要往后端发送数据,页面注入API,await的意思是同步等待服务器数据,并返回,axios注入在其他页面,其他页面调用的时候,同步作用
|
3天前
|
弹性计算 运维 安全
阿里云轻量应用服务器与ECS的区别及选择指南
轻量应用服务器和云服务器ECS(Elastic Compute Service)是两款颇受欢迎的产品。本文将对这两者进行详细的对比,帮助用户更好地理解它们之间的区别,并根据自身需求做出明智的选择。