Heroku在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 GET https://goore-todos.herokuapp.com/undefined/api/all 404（未找到）

该视图为空。

通过邮递员对https://goore-todos.herokuapp.com/api/的请求按预期进行。

Answer 1

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

如果您的前端和后端在同一域上运行，则没有理由尝试将API网址作为变量传递，因为您只能使用相对网址。

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