Firebase

Firebase Functions

若要使用更新且建議的 firebase functions 版本，請將 firebase.gen 選項設定為 2

export default defineNuxtConfig({
  nitro: {
    firebase: {
      gen: 2
    }
  }
})

如果您已經部署了網站版本並想要升級到第二代，請參閱 Firebase 文件上的遷移過程。也就是說，CLI 會要求您在部署新的函式之前刪除現有的函式。

專案設定

您可能更喜歡使用 Firebase CLI 設定您的專案，它會為您取得專案 ID，新增必要的依賴項（請參閱上方），甚至透過 GitHub Actions 設定自動部署（僅限託管）。 了解有關安裝 Firebase CLI 的資訊。

1. 安裝最新版本的 Firebase CLI。
   終端機

   npm install -g firebase-tools@latest
   

2. 初始化您的 Firebase 專案
   終端機

   firebase login
   firebase init hosting
   

完成後，將以下內容新增至您的 firebase.json 以啟用 Cloud Functions 中的伺服器端渲染

{
  "functions": { "source": ".output/server" },
  "hosting": [
    {
      "site": "<your_project_id>",
      "public": ".output/public",
      "cleanUrls": true,
      "rewrites": [{ "source": "**", "function": "server" }]
    }
  ]
}

本地預覽

如果需要測試而無需部署，您可以預覽網站的本地版本。

npm run build -- --preset=firebase
firebase emulators:start

建置並部署

透過執行 Nitro 建置，然後執行 firebase deploy 命令來部署至 Firebase Hosting。

npm run build -- --preset=firebase
firebase deploy

選項

您可以在您的 nuxt.config.ts 檔案中設定 firebase functions 的選項

export default defineNuxtConfig({
  nitro: {
    firebase: {
      gen: 2,
      httpsOptions: {
        region: 'europe-west1',
        maxInstances: 3,
      },
    },
  },
});

執行階段 Node.js 版本

您可以在設定中設定自訂 Node.js 版本

export default defineNuxtConfig({
  nitro: {
    firebase: {
      nodeVersion: '18' // Can be '16' or '18' or '20'
    },
  },
});

Firebase 工具會使用 package.json 中的 engines.node 版本來判斷要為您的函式使用哪個 Node 版本。Nuxt 會使用設定的 Node.js 版本自動寫入 .output/server/package.json。

您可能還需要在您的 firebase.json 檔案中新增一個執行階段鍵

{
  "functions": {
    "source": ".output/server",
    "runtime": "nodejs20"
  }
}

如果您的 firebase 專案有其他 cloud functions

您可能會收到警告，指出當您部署 Nuxt 專案時，其他 cloud functions 將會被刪除。這是因為 nitro 會將您的整個專案部署到 firebase functions。如果您只想部署您的 Nuxt 專案，可以使用 --only 旗標

firebase deploy --only functions:server,hosting

在生產環境中使用 Cookie

當 Firebase Hosting 與 Cloud Functions 或 Cloud Run 一起使用時，通常會從傳入的請求中移除 Cookie，以實現高效的 CDN 快取行為。只有特殊命名的 __session Cookie 允許傳遞到您的應用程式。

使用環境變數

要為您的 Firebase functions 設定環境變數，您需要將 .env 檔案複製到 .output/server 目錄。您可以透過在您的 package.json 中新增一個 postbuild 指令碼來執行此操作，該指令碼會在建置命令之後自動執行

{
  "scripts": {
    "postbuild": "cp .env .output/server/.env"
  }
}