我需要做的不仅仅是在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上已经有一些很好的答案/解决方案可以解决同样的问题。