您可以使用 Firebase CLI，將 Next.js 網頁應用程式部署至 Firebase，並透過 Firebase 託管提供這些應用程式。CLI 會遵循您的 Next.js 設定，不需要額外設定或幾乎不需額外設定就能轉譯為 Firebase 設定。如果您的應用程式包含動態伺服器端邏輯，CLI 會將該邏輯部署至 Cloud Functions for Firebase。最新支援的 Next.js 版本為 13.4.7。
事前準備
在開始將應用程式部署至 Firebase 之前，請先詳閱下列要求和選項：
- Firebase CLI 12.1.0 以上版本。請務必使用您偏好的方法安裝 CLI。
選用：Firebase 專案已啟用計費功能 (如要使用 SSR，此為必要選項)
選用：使用實驗性 ReactFire 程式庫，享受適用於 Firebase 的功能
初始化 Firebase
如要開始使用，請為您的架構專案初始化 Firebase。針對新專案使用 Firebase CLI，或是修改現有專案的 firebase.json。
初始化新專案
- 在 Firebase CLI 中，啟用網路架構預覽：
firebase experiments:enable webframeworks
從 CLI 執行初始化指令，然後按照提示操作：
firebase init hosting
以「您要使用網路架構嗎？」回答「是」。(實驗功能)
選擇代管來源目錄。如果這是現有的 Next.js 應用程式，CLI 程序會完成，您可繼續進行下一部分。
如果出現提示訊息，請選擇 Next.js。
提供靜態內容
初始化 Firebase 後，您可以使用標準部署指令提供靜態內容：
firebase deploy
您可以在實際網站上查看已部署的應用程式。
預先轉譯動態內容
Firebase CLI 會偵測 getStaticProps 和 getStaticPaths 的使用情形。
選用：整合 Firebase JS SDK
在伺服器和用戶端套裝組合中納入 Firebase JS SDK 方法時，請先檢查 isSupported() 再使用產品，以避免執行階段錯誤。並非所有產品都適用於所有環境。
選用：與 Firebase Admin SDK 整合
如果瀏覽器版本包含 Admin SDK 套件，就會失敗。您只能在 getStaticProps 和 getStaticPaths 中參照這些項目。
提供完整動態內容 (SSR)
Firebase CLI 會偵測 getServerSideProps 的使用情形。 在這種情況下，CLI 會將函式部署至 Cloud Functions for Firebase，以執行動態伺服器程式碼。您可以在 Firebase 控制台查看這些函式的相關資訊，例如網域和執行階段設定。
使用 next.config.js 設定託管行為
圖片最佳化
系統支援使用 Next.js 圖片最佳化功能，但無論您是否使用 SSR，系統都會觸發建立函式 (在 Cloud Functions for Firebase 中)。
重新導向、重新寫入及標頭
Firebase CLI 會遵循 next.config.js 中的重新導向、重寫和標頭，並在部署時將其轉換為對應的 Firebase 託管設定。如果 Next.js 重新導向、重寫或標頭無法轉換為對等的 Firebase 託管標頭，即使未使用圖片最佳化或 SSR，該標頭仍會改回並建構函式。
選用：整合 Firebase 驗證
網路架構感知 Firebase 部署工具會透過 Cookie 讓用戶端與伺服器的狀態自動保持同步。以下提供幾種存取 SSR 驗證內容的方法：
- Express
res.locals物件可選擇包含已驗證的 Firebase 應用程式執行個體 (firebaseApp) 和目前登入的使用者 (currentUser)。您可以前往getServerSideProps存取這項權限。 - 經過驗證的 Firebase 應用程式名稱會在路徑查詢 (
__firebaseAppName) 中提供，這樣就能在結構定義中手動整合：
// get the authenticated Firebase App
const firebaseApp = getApp(useRouter().query.__firebaseAppName);