firebaseを用いたログイン認証機能実装において、firebaseConfigの情報をクライアント側で隠蔽する方法を教えてください。

Question

前提・実現したいこと

ログイン認証機能をfirebaseを用いて実装しています。
ローカルでは問題なく機能しています。
しかし、この認証機能はフロントエンドに実装したため、firebaseConfigの情報を環境変数で隠蔽することができません。
firebaseConfigの情報をgithubやクライアントのソースコードに晒すことなく機能させる方法を教えていただきたいです。

発生している問題・エラーメッセージ

実際にデプロイをしたelastic beanstalk環境にアクセスすると以下のエラーが出ます。
http://multidocker-env.vwnrixavuv.ap-northeast-1.elasticbeanstalk.com/

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

該当のソースコード

//レポジトリ構成
article
  ├ client
  ├   └ src
  │      └ firebase.ts
  ├ api
  ├ nginx
  └ docker-compose.yml

firebaseConfigを以下のように環境変数で設定しています。

//firebase.ts
import * as firebase from 'firebase';
import 'firebase/auth';

const firebaseConfig = {
  apiKey: process.env.REACT_APP_FIREBASE_API_KEY,
  authDomain: process.env.REACT_APP_FIREBASE_AUTH_DOMAIN,
  databaseURL: process.env.REACT_APP_FIREBASE_DATABASE_URL,
  projectId: process.env.REACT_APP_FIREBASE_PROJECT_ID,
  storageBucket: '',
  messagingSenderId: process.env.REACT_APP_FIREBASE_MESSAGING_SENDER_ID,
  appId: process.env.REACT_APP_FIREBASE_APP_ID,
};

firebase.initializeApp(firebaseConfig);

export default firebase;

docker-compose.ymlは以下のように設定しました。

//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には以下のように環境変数を設定しました。

ソースコード全容は以下のgithubにあります:
https://github.com/jpskgc/article

補足情報（FW/ツールのバージョンなど）

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

Answer 1

それは例外的に晒して良いものです。
また晒さないと動作させることができません。

http://testpy.hatenablog.com/entry/2016/09/18/093000

https://qiita.com/odistagon/items/e9c14ed157200b36eaa5

そして、フロントエンドには環境変数という仕組み自体がないので使えません。