1. 创建 config.js 文件
首先我们在public文件下建立一个js文件,就叫config.js吧,内容为
window.g = {
AXIOS_TIMEOUT: 10000,
ApiUrl: 'http://10.65.14.98:52333/api' // 配置服务器地址,
}
2. 引用 config.js 文件
接下来我们只需要在public文件夹下的index.html这个入口文件里引入该文件(注意路径就ok)
<script type="text/javascript"src="/public/config.js"></script>
3. 使用 config.js 中的值
可以在封装 axios 的代码中,设置 baseUrl 时,直接使用 config.js 中配置的值。代码如下:
注意看第三行
import axios from 'axios'
var baseURLStr = window.g.ApiUrl
console.log(baseURLStr) //baseURLStr 这个可以打印出你的地址,就代表成功了
export function request(config) {
// 1.创建axios的实例
const instance = axios.create({
baseURL: baseURLStr,//api的base
timeout: 200000
})
// 2.axios的拦截器
// 2.1.请求拦截的作用
instance.interceptors.request.use(config => {
method:'GET'
return config
}, err => {
console.log(err);
})
// 2.2.响应拦截
instance.interceptors.response.use(res => {
return res.data
}, err => {
console.log(err);
})
// 3.发送真正的网络请求
return instance(config)
最后在打包成功之后,config,js文件不会被打包,依然存在public文件夹下,如果需要修改只需要用记事本打开文件修改地址就OK了,而且该方法也不会影响开发模式。
原文链接:https://blog.csdn.net/m0_46684624/article/details/109739521