外部APIの秘密キーを使って商品データを取得したいです。App Routerで秘密キーを安全に扱いやすい実装はどれですか？

解説

正解: Server ComponentまたはServer Action内で秘密キーを参照して取得処理を行う秘密キーはブラウザへ送ってはいけない情報なので、サーバー側で完結する処理に閉じ込める必要があります。App RouterではServer Component、Server Action、Route Handlerなどサーバー実行の場所で環境変数を参照し、外部APIへ安全にアクセスできます。補足: クライアントへ渡すのは取得済みの必要最小限のデータだけにします。ログやエラーメッセージに秘密キーが混ざらないようにも注意します。A. Server ComponentまたはServer Action内で秘密キーを参照して取得処理を行う: これが正解です。B. Client Componentで秘密キーをpropsとして受け取り、fetchに付ける: propsとして渡すとブラウザ側に露出する危険があります。C. 秘密キーをlocalStorageに保存し、各リクエストで読み出す: localStorageは利用者のブラウザから見えるため秘密情報の保存先ではありません。D. 秘密キーをmetadata.descriptionに埋め込んで共有する: HTMLに公開されるため非常に危険です。