Reactjs 如何在客户端隐藏firebaseConfig信息

我正在通过

firebase

设置身份验证功能
它在我当地的docker环境中运行良好。
但其

firebaseConfig

位于客户端。
我想将

firebaseConfig

信息隐藏为环境变量。

这是书堆

・client: react/axios
・api: golang/gin
・web server: nginx
・db: mysql
・container: docker
・ci-tool: travis
・deploy: aws elastic beanstalk

以下是存储库结构

article
  ├ client
  ├   └ src
  │      └ firebase.ts
  ├ api
  ├ nginx
  └ docker-compose.yml

我在

firebaseConfig

中设置了

process.env

//firebase.ts
从“firebase”导入*作为firebase；
导入“firebase/auth”；
常量firebaseConfig={
apiKey:process.env.REACT\u APP\u FIREBASE\u API\u KEY，
authDomain:process.env.REACT\u APP\u FIREBASE\u AUTH\u DOMAIN，
databaseURL:process.env.REACT\u APP\u FIREBASE\u DATABASE\u URL，
projectId:process.env.REACT\u APP\u FIREBASE\u PROJECT\u ID，
storageBucket:“”，
messagingSenderId:process.env.REACT\u APP\u FIREBASE\u messageing\u SENDER\u ID，
appId:process.env.REACT\u APP\u FIREBASE\u APP\u ID，
};
firebase.initializeApp（firebaseConfig）；
导出默认firebase；

这在当地环境中效果很好。
但在生产环境（elastic beanstalk）中，我不知道如何设置这些环境变量，因为它们位于客户端

完整的源代码在这里：

生产URL位于此处：

我希望firebase身份验证可以在生产环境中工作（elastic beanstalk）。
但实际情况并非如此。

Zr {code: "auth/invalid-api-key", message: "Your API key is invalid, please check you have copied it correctly."}
code: "auth/invalid-api-key"
message: "Your API key is invalid, please check you have copied it correctly."
__proto__: Error

****更新****
我在docker compose.yml和elastic beanstalk中设置了环境变量 但仍然发生同样的错误

//docker-compose.yml
  client:
    build:
      dockerfile: Dockerfile.dev
      context: ./client
    volumes:
      - /app/node_modules
      - ./client:/app
    environment:
      - REACT_APP_FIREBASE_API_KEY=${REACT_APP_FIREBASE_API_KEY}
      - REACT_APP_FIREBASE_AUTH_DOMAIN=${REACT_APP_FIREBASE_AUTH_DOMAIN}
      - REACT_APP_FIREBASE_DATABASE_URL=${REACT_APP_FIREBASE_DATABASE_URL}
      - REACT_APP_FIREBASE_PROJECT_ID=${REACT_APP_FIREBASE_PROJECT_ID}
      - REACT_APP_FIREBASE_MESSAGING_SENDER_ID=${REACT_APP_FIREBASE_MESSAGING_SENDER_ID}
      - REACT_APP_FIREBASE_APP_ID=${REACT_APP_FIREBASE_APP_ID}

以下是

elastic beanstalk

环境变量设置：

---

没有公开firebaseConfig的问题。
我看一看流动的文章。
所以问题解决了。

---

您不能在

docker compose.yml

中添加

ENV

？我不想向公众公开

firebaseConfig

信息。如果它们列在

docker compose.yml

上，它们将显示在github上。只添加

ARG

名称，而在

compose

中不添加值，然后在docker up命令中传递值

REACT\u APP\u FIREBASE\u APP\u ID=TEST&&docker ompose up

它可能在本地环境中工作正常，但我说的是弹性豆茎环境。我现在通过设置

docker compose.yml

和

elastic beanstalk

环境变量来尝试它。但是仍然发生了相同的错误。在Elastic Beanstalk控制台中定义的所有环境变量都传递给容器。所以这应该是可行的