为了在其他容器中使用它们，我是否需要做更多的事情而不是在docker-compose文件中添加env变量？

Question

我在docker-compose.yaml中定义了后端服务容器的URL。

environment:
  PORT: 80
  VUE_APP_BACKEND_URL: "mm_backend:8080"

当容器旋转起来时，我检查了前端容器并可以验证是否正确设置了env变量，如下所示。

但是，当我尝试使用前端服务连接到后端（检索数据）时，它告诉我VUE_APP_BACKEND_URL在“网络”标签中未定义。

此环境变量的实现和用法在我的vue.js代码中

getOwners(){
    fetch(`${process.env.VUE_APP_BACKEND_URL}/owners`, defaultOptions)
      .then((response) => {
        return response.json();
      })
      .then((data) => {
        data.forEach((element) => {
          var entry = {
            value: element.id,
            text: `${element.display_name} (${element.name})`
          }
          this.owners.push(entry)
        })
      })

感谢您的协助。

Answer 1

这将不起作用，因为process.env.someKey在浏览器中不可用。换句话说，如果您想将 任何 env变量传递到前端应用程序中，则docker-compose将无济于事。最简单的方法是在代码本身中的一个位置定义backendUrl并使用它进行api调用。如果您不满意这样做，那么在StackOverflow上已经有一些针对此问题的良好答案/解决方案。