Axios中能否避免硬编码HTTPS协议？

当然可以！你完全不需要在每个Axios请求里硬写HTTPS协议，有几种实用的方式能实现你想要的效果：

1. 配置Axios实例的baseURL（最推荐） #

创建一个预先配置好的Axios实例，把HTTPS协议和域名统一设置为baseURL，之后所有请求只需要写接口路径部分就行：

// 初始化带baseURL的Axios实例
const apiClient = axios.create({
  baseURL: 'https://example.com'
});

// 发起请求时只需要写相对路径
apiClient.post('/api/user', { firstName: 'Fred', lastName: 'Flintstone' });

这种方式的好处是统一管理API域名和协议，后续要修改的话只需要改一处，非常适合项目中大量API请求的场景。

2. 使用相对路径（同域场景） #

如果你的前端页面本身就是通过HTTPS访问，并且API和前端部署在同一个域名下，直接用带斜杠开头的相对路径即可——Axios会自动继承当前页面的协议和域名：

// 假设当前页面地址是 https://example.com/home
axios.post('/api/user', { firstName: 'Fred', lastName: 'Flintstone' });

这时候实际发起的请求就是https://example.com/api/user，完全不用手动写协议和域名。

⚠️ 注意：如果直接写example.com/api/user（不带开头的斜杠），Axios会把它当成当前页面路径的子路径，比如当前页面是https://your-app.com/dashboard，请求会变成https://your-app.com/example.com/api/user，这显然不是你想要的结果，所以一定要记得加斜杠。

3. 动态适配协议（多环境场景） #

如果需要根据开发/生产环境切换协议（比如开发用HTTP，生产用HTTPS），可以通过环境变量动态拼接baseURL：

// 根据环境变量选择协议
const protocol = process.env.NODE_ENV === 'production' ? 'https' : 'http';
const apiClient = axios.create({
  baseURL: `${protocol}://example.com`
});

// 发起请求
apiClient.post('/api/user', { firstName: 'Fred', lastName: 'Flintstone' });

这种方式能灵活适配不同环境的协议要求，避免硬编码带来的维护麻烦。

内容的提问来源于stack exchange，提问作者loalexzzzz