axios.defaults.baseURL的三种配置方法
简介
本文介绍我在项目中使用axios切换生产环境和开发环境接口地址的三种配置
1.常规设置
在只需要配置单个或有限明确的接口域名时可以直接设置,在生产环境和开发环境切换时需手动更改
axios.defaults.baseURL="http://192.168.1.1:5000";
2.动态获取请求地址
在线上地址不明确或者不想手动更改地址的时候可设置自动获取当前的域名进行请求,不好的地方在于跨域的话端口是写死的
let protocol = window.location.protocol; //协议
let host = window.location.host; //主机
let reg = /^localhost+/;
if(reg.test(host)) {
//若本地项目调试使用
axios.defaults.baseURL = 'http://192.168.1.1:5000';
} else {
//动态请求地址 协议 主机
axios.defaults.baseURL = protocol + "//" + host +":5000";
}
3.采用配置文件
应用于有多个不明确的部署环境,可在不重新打包的情况下更改接口地址,如下设置后只需在dist里面static下找到config.js更改值即可实现更换接口地址
3.1 先新建一个配置文件,在static文件夹下键一个config.js(方便记忆,参数名可自行更改)
window.gurl={
AXIOS_TIMEOUT:10000,
SERVICE_CONTEXT_PATH:'http://192.168.1.1:5000'
}
3.2 在index.html里面引入config.js
<script src="./static/config.js" type="text/javascript"></script>
3.3 main.js
axios.defaults.baseURL = window.gurl.SERVICE_CONTEXT_PATH;
分类:
JavaScript
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】凌霞软件回馈社区,博客园 & 1Panel & Halo 联合会员上线
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】博客园社区专享云产品让利特惠,阿里云新客6.5折上折
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· 浏览器原生「磁吸」效果!Anchor Positioning 锚点定位神器解析
· 没有源码,如何修改代码逻辑?
· 一个奇形怪状的面试题:Bean中的CHM要不要加volatile?
· [.NET]调用本地 Deepseek 模型
· 一个费力不讨好的项目,让我损失了近一半的绩效!
· PowerShell开发游戏 · 打蜜蜂
· 在鹅厂做java开发是什么体验
· 百万级群聊的设计实践
· WPF到Web的无缝过渡:英雄联盟客户端的OpenSilver迁移实战
· 永远不要相信用户的输入:从 SQL 注入攻防看输入验证的重要性