フロントエンド側でアクセスキーなどの外部に公開できない情報を保持しておく方法はありますか？

Question

現在、Dockerを使用してフロントエンド(HTML/CSS/JS) と サーバーサイド(Flask)を
コンテナを分けて開発しています。

フロントエンド側のコンテナの方で、APIのアクセスキーなどを保持しておきたいのですが、
外部から見えない・変更されないように保持 する方法はあるのでしょうか。

フロントエンドのコンテナの方には、HTML・CSS・JS・DockerFile などしかありません。

下のサイトだと、環境依存の値は切り替えられますが、外部からも見えてしまいます。
JavaScriptのソース内で環境依存の値を切り替える

---

素人ながらに考えたのは以下の３つですが、実現可能かはまだ分かっていません。
0. 暗号化してJSで復号？（でもJSで復号するなら結局公開しているのと変わらない？）

1. 設定ファイルを読み込み？
2. AWSなどに保存しておいてJSでアクセスキーを取得してからAjaxなどの処理を行う？

---

一般的にはこうするなどのご意見・アドバイスなどでも構いません。
お時間ある方で、知識をお持ちの方いらっしゃいましたらご助力頂けますと幸いです。

Answer 1

一般的にはこうする

キーもサーバサイドに置いて、「外部APIを呼び出すAPI」をサーバサイドで提供する。

（APIキーを秘密にしなければならないようなAPIでは、CORSも非対応でフロントから直接呼べない場合も多いです）