如何获取axios的baseUrl
在使用axios进行http请求时，我们经常会设置一个baseUrl，用于指定请求的基本URL。这个baseUrl可以是一个绝对路径，也可以是一个相对路径。
方法一：在每个请求中手动设置
最简单的方法是在每个请求中手动设置baseUrl。我们可以使用axios提供的config参数，在每个请求中添加baseUrl。
import axios from 'axios';
const instance = axios.create({
baseURL: ' // 设置baseUrl
});
instance.get('/users') // 发送请求
.then((response) => {
console.log(response.data);
})
.catch((error) => {
console.error(error);
});
使用这种方法，每个请求都需要手动设置baseUrl，这样在多个请求中重复设置baseUrl可能会导致代码冗余。
方法二：全局设置baseUrl
为了避免在每个请求中手动设置baseUrl，我们可以在axios的全局配置中设置baseUrl。这样，每个请求都会自动使用这个baseUrl。
import axios from 'axios';
axios.defaults.baseURL = ' // 设置baseUrl
axios.get('/users') // 发送请求
.then((response) => {
console.log(response.data);
})
.catch((error) => {
console.error(error);
});
使用这种方法，我们只需要在应用的初始化阶段设置一次baseUrl，后续的请求都会自动使用这个baseUrl。
方法三：根据环境设置baseUrl
有时，我们可能需要根据不同的环境设置不同的baseUrl，比如开发环境和生产环境使用不同的服务器地址。这时，我们可以根据环境变量来动态设置baseUrl。
import axios from 'axios';
const baseURL = process.env.NODE_ENV === 'production' ? ' : '
const instance = axios.create({
baseURL: baseURL, // 根据环境变量设置baseUrl
});
instance.get('/users') // 发送请求
.then((response) => {
console.log(response.data);
})
.catch((error) => {
console.error(error);
});
使用这种方法，我们可以根据不同的环境变量设置不同的baseUrl，方便在开发和生产环境中切换。
总结
以上是获取axios的baseUrl的几种方法。根据实际需求，我们可以选择适合自己的方法来设置baseUrl。如果只有少量请求需要设置baseUrl，可以使用方法一；如果所有请求都需要设置baseUrl，可以使用方法二；如果需要根据环境动态设置baseUrl，可以使用方法三。
综上所述，获取axios的baseUrl可以通过手动设置、全局设置或根据环境设置来实现。根据具体需求选择合适的方法来设置baseUrl可以提高代码的可维护性和灵活性。
pie
title 获取axios的baseUrl
"方法一：手动设置" : 30
"方法二：全局设置" : 40
"方法三：根据环境设置" : 30
classDiagram
class axios {
- baseURL: string
+ get(url: string): Promise<any>
+ post(url: string, data: any): Promise<any>
+ put(url: string, data: any): Promise<any>
+ delete(url: string): Promise<any>
}
以上是使用axios获取baseUrl的方法和相关代码示例，希望对你有帮助！
