Vue - Vue CLI - API 变量

Question

在Vue实例中，根据当前域名位置设置api的url有什么最佳方式？在Angular中，我会使用类似于Angular Environment的东西。但是我在Vue或Axios中没有遇到类似的工具。

在这种情况下，我的设置依赖于多个环境（本地，开发，预发布，生产），所有这些都基于不同的域名关系。 localhost = '/api-call'

dev.domain.com = 'devapi.domain.com' prod.domain.com = 'prodapi.domain.com'

任何帮助都将是难以置信的！

- Brock

Answer 1

经常情况下，我会将其存储在配置文件中并在axios中设置变量，但您也可以在前端测试浏览器URL并相应地设置axios。创建axios实例时，您将把baseURL属性设置为您的主站点URL。

var instance = axios.create({
      baseURL: 'https://' + window.location.host + '/api/',
      timeout: 1000,
      headers: {'X-Custom-Header': 'foobar'}
});

- Miguel Coder

---

我猜你在使用Laravel，因为你提到了axios，但如果你使用环境变量，那么你可以在你的blade模板中直接调用它。env('你的变量名称') - Miguel Coder