Heroku 添加 'undefined' 到 BASE_URL 环境变量

Question

正在尝试将 vuejs、express 应用程序部署到 heroku。该应用程序显示，但无法访问 api，因为 heroku 似乎在 base_url 中间添加了 'undefined'。一切都按预期在本地运行。

这是我的 heroku 配置变量： BASE_URL: https://goore-todos.herokuapp.com/

这里是Vuejs组件api请求：

fetchTodo () {
  let uri = process.env.BASE_URL + '/api/all';
  axios.get(uri).then((response) => {
    this.todos = response.data;
  });
},

如前所述，这在本地有效。

控制台显示以下错误： VM71:1 获取 https://goore-todos.herokuapp.com/undefined/api/all 404（未找到）

并且视图是空的。

通过 Postman 向 https://goore-todos.herokuapp.com/api/ 发出的请求按预期工作。

Answer 1

在这种情况下，process.env.BASE_URL 似乎未定义。由于未定义，您尝试访问的 url 被认为是相对的。这意味着它使用您当前的域并将路径附加到它。

如果您的前端和后端运行在同一个域中，则没有理由尝试将 API url 作为变量传递，因为您可以只使用相对 URLs.

如果您想通过环境变量访问 URL，使用前端应用程序会有点棘手。 Vue 应用运行在用户的浏览器上，而不是在您的服务器上，因此您无法直接访问它。

Heroku adding 'undefined' to BASE_URL environment variable