語言 › Node.js

將 Node.js 應用程式部署到 Vercel

將具有加密 .env.vault 檔案的 Node.js 應用程式部署到 Vercel。

在此指南中尋找完整的 GitHub 程式碼範例。

初始設定

建立 index.js 檔案（如果尚未建立）。

index.js

const PORT = process.env.PORT || 3000
const http = require('http')
const server = http.createServer((req, res) => {
  res.statusCode = 200
  res.setHeader('Content-Type', 'text/plain')
  res.end(`Hello ${process.env.HELLO}`)
})

server.listen(PORT, () => {
  console.log(`Server running on port:${PORT}/`)
})

新增 vercel.json 檔案。

vercel.json

{
  "version": 2,
  "builds": [
    {
      "src": "index.js",
      "use": "@vercel/node"
    }
  ],
  "routes": [
    {
      "src": "/(.*)",
      "dest": "index.js"
    }
  ]
}

新增 .vercelignore 檔案。

.vercelignore

.env*
!.env.vault

將其提交到程式碼並部署到 Vercel。

npx vercel@latest deploy --prod

部署後，您的應用程式將顯示 'Hello undefined'，因為它還沒有辦法存取環境變數。接下來我們來做這件事。

yourapp.vercel.app

安裝 dotenv

安裝 dotenv。

npm install dotenv --save # Requires dotenv >= 16.1.0

在專案的根目錄中建立一個 .env 檔案。

.env

# .env
HELLO="World"

盡可能在您的應用程式中提早匯入並設定 dotenv。

index.js

// index.js
require('dotenv').config()
console.log(process.env) // remove this after you've confirmed it is working

const PORT = process.env.PORT || 3000
const http = require('http')
...

嘗試在本機執行它。

node index.js
{
  ...
  HELLO: 'World'
}
Server running on port:3000/

很好。process.env 現在有了您在 .env 檔案中定義的鍵和值。

以上涵蓋了本機開發。接下來我們來解決生產環境的問題。

建置 .env.vault

推送您最新的 .env 檔案變更並編輯您的生產密鑰。了解有關同步的更多資訊

npx dotenv-vault@latest push
npx dotenv-vault@latest open production

使用 UI 設定每個環境的這些密鑰。

www.dotenv.org

然後建置您加密的 .env.vault 檔案。

npx dotenv-vault@latest build

其內容應如下所示。

.env.vault

#/-------------------.env.vault---------------------/
#/         cloud-agnostic vaulting standard         /
#/   [how it works](https://dotenv.org/env-vault)   /
#/--------------------------------------------------/

# development
DOTENV_VAULT_DEVELOPMENT="/HqNgQWsf6Oh6XB9pI/CGkdgCe6d4/vWZHgP50RRoDTzkzPQk/xOaQs="
DOTENV_VAULT_DEVELOPMENT_VERSION=2

# production
DOTENV_VAULT_PRODUCTION="x26PuIKQ/xZ5eKrYomKngM+dO/9v1vxhwslE/zjHdg3l+H6q6PheB5GVDVIbZg=="
DOTENV_VAULT_PRODUCTION_VERSION=2

設定 DOTENV_KEY

擷取您的生產 DOTENV_KEY。

npx dotenv-vault@latest keys production
# outputs: dotenv://:[email protected]/vault/.env.vault?environment=production

使用 CLI 在 Vercel 上設定 DOTENV_KEY。

npx vercel@latest env add DOTENV_KEY

? What’s the value of DOTENV_KEY? dotenv://:[email protected]/vault/.env.vault?environment=production
✅  Added Environment Variable DOTENV_KEY to Project nodejs-vercel [94ms]

或者使用 Vercel 的 UI。

vercel.com

部署

安全地將這些變更提交到程式碼並部署。

就是這樣！在部署時，您的 .env.vault 檔案將被解密，其生產密鑰將以環境變數的形式注入 - 正是時候。

yourapp.vercel.app

您已成功使用新的 .env.vault 標準來加密和部署您的密鑰。這比將您的密鑰分散在多個第三方平台和工具中安全得多。每當您需要新增或變更密鑰時，只需重建您的 .env.vault 檔案並重新部署即可。