frontendに配信するコードに機密情報を含めない
ブラウザに配信するコードは全て丸見えである
.envに機密情報を書いた場合、それをclientで使っているなら、コード上のどこかに埋め込まれているということ
例えば、Chrome dev toolでSourceパネルを開き
「全てのファイル内を検索」とかで絞り込むことができる
https://gyazo.com/d4fbc4367a45633648e2582f9ab55025
https://gyazo.com/ea7eb974fc9b271ff32bdeaade17c650
(一応画像のlcokしてる)
key名は人間のために命名されているので推測しやすいmrsekut.icon
値側も部分一致できてしまうので、ハッシュでも適当にやれば当たる確率が高い
フロントエンドのコードからの情報漏洩を防ぐための工夫 - BASEプロダクトチームブログ
想定している状況がかなり限定的だなmrsekut.icon
「本番環境で見た時に、開発環境の情報を残したくない」というもの
機密情報の話ではないmrsekut.icon
開発環境のURLを残したくない、というもの
それに代わる本番環境のものは公開されていても問題ない、という前提がある
例えば、「2. 環境毎にビルドで使用する定数を入れ替える」の方法では
devでbuildすると以下のようなコードが生成され
code:ts
fetch('https://dev.example.com');
prodでbuildすると以下のようなコードが生成されるようにする
code:ts
fetch('https://prod.example.com');
3つの方法が説明されているが、いずれもidなどの機密情報に対しては使えないmrsekut.icon