金鑰與 API key：金鑰外洩陷阱

金鑰是任何能授予訪問許可權的東西：API（Application Programming Interface，應用程式程式設計介面）key、資料庫密碼、支付服務商令牌、簽名金鑰。vibe coding 裡最常見——也最昂貴——的錯誤，就是洩露其中之一。

有兩個陷阱不斷地坑住人：

• 客戶端程式碼裡的金鑰。 你前端裡的任何東西（在瀏覽器裡執行的那段 JavaScript）都是公開的。使用者可以開啟開發者工具直接讀到它。AI 在被要求從 React 元件裡呼叫一個 API 時，會樂呵呵地把你的金鑰直接粘在那兒——於是現在任何訪問你網站的人都能把它複製走、把你的賬單刷爆。金鑰應該待在伺服器上，永遠不要出現在會發送到瀏覽器的程式碼裡。
• 倉庫裡的金鑰。 硬編碼在檔案裡的金鑰會被提交進 git。就算你之後刪掉它，它也會永遠留在 git 歷史裡，而機器人會在你 push 後幾分鐘內就掃描公開倉庫，找的正是這種東西。

金鑰正確的歸宿是環境變數（environment variable）——一個在執行時提供給應用的值，完全不寫進程式碼裡：

// VULNERABLE: key 在原始碼裡，會被提交進 git
const stripe = new Stripe("sk_live_51H8xQ2eZvK...");

// SAFE: key 從環境中讀取，從不寫在程式碼裡
const stripe = new Stripe(process.env.STRIPE_SECRET_KEY);

金鑰只有一個安全的家——在伺服器端，從環境裡讀取。瀏覽器是公共場所：任何被送到那裡的東西，任何開啟開發者工具的人都能讀到。

            ┌──────────────────────────────────────────┐
            │  .env  (gitignore忽略・永不提交)          │
            │  STRIPE_SECRET_KEY=sk_live_...            │
            └───────────────────┬──────────────────────┘
                                 │ 執行時注入        
                                ▼
   ┌──────────────────────┐          ┌──────────────────────┐
   │   SERVER             │          │   BROWSER (客戶端)    │
   │   process.env.KEY ✓  │   ✗──────│   任何人都可讀        │
   │   在此呼叫Stripe     │  絕不    │   dev tools · "view   │
   │                      │  傳送    │   source" · network   │
   └──────────────────────┘  到此    └──────────────────────┘
        安全: 保持私密                   公開: = 洩露    

在你寫下第一個金鑰之前，就把 .env（以及 .env.local 等等）加進你的 .gitignore。如果某個金鑰確實進了你的程式碼或歷史，就把它當成已經燒掉了：輪換它（生成一個新的並吊銷舊的）——刪掉那一行是不夠的，因為舊金鑰依然有效，而且依然在外面流傳著。