整合其他架構與 Express.js

只要進行一些額外設定，您就能以基本架構感知 CLI 功能為基礎，將整合支援範圍擴展至 Angular 和 Next.js 以外的架構。

提供靜態內容

部署靜態內容前，請先設定應用程式。

設定

為了瞭解如何部署應用程式，Firebase CLI 必須能夠建構應用程式，並知道工具將資產放置在何處，以供 Hosting 使用。這是透過 npm 建構指令碼和 package.json 中的 CJS 目錄指令達成。

請看看下列 package.json：

{
    "name": "express-app",
    "version": "0.0.0",
    "scripts": {
        "build": "spack",
        "static": "cp static/* dist",
        "prerender": "ts-node prerender.ts"
    },
    …
}

Firebase CLI 只會呼叫建構指令碼，因此您必須確保建構指令碼完整無缺。

{
    "name": "express-app",
    "version": "0.0.0",
    "scripts": {
        "build": "spack && npm run static && npm run prerender",
        "static": "cp static/* dist",
        "prerender": "ts-node prerender.ts"
    },
    …
}

如果您的架構不支援預先算繪，請考慮使用 Rendertron 等工具。Rendertron 可讓您對應用程式的本機執行個體發出無頭 Chrome 要求，因此您可以儲存產生的 HTML，以便在 Hosting 上提供服務。

最後，不同架構和建構工具會將構件儲存在不同位置。使用 directories.serve 告知 CLI 建構指令碼輸出結果構件的位置：

{
    "name": "express-app",
    "version": "0.0.0",
    "scripts": {
        "build": "spack && npm run static && npm run prerender",
        "static": "cp static/* dist",
        "prerender": "ts-node prerender.ts"
    },
    "directories": {
        "serve": "dist"
    },
    …
}

部署

設定應用程式後，您可以使用標準部署指令提供靜態內容：

firebase deploy

提供動態內容

如要在 Cloud Functions for Firebase 上提供 Express 應用程式，請確保 Express 應用程式 (或 Express 樣式的網址處理常式) 的匯出方式，可讓 Firebase 在程式庫完成 npm 封裝後找到該應用程式。

如要達成這個目標，請確認 files 指令包含伺服器所需的一切項目，且主要進入點已在 package.json 中正確設定：

{
    "name": "express-app",
    "version": "0.0.0",
    "scripts": {
        "build": "spack && npm run static && npm run prerender",
        "static": "cp static/* dist",
        "prerender": "ts-node tools/prerender.ts"
    },
    "directories": {
        "serve": "dist"
    },
    "files": ["dist", "server.js"],
    "main": "server.js",
    ...
}

從名為 app 的函式匯出 Express 應用程式：

// server.js
export function app() {
  const server = express();
   …
   return server;
}

或者，如果您想匯出 Express 樣式的網址處理常式，請將其命名為 handle：

export function handle(req, res) {
   res.send(‘hello world’);
}

部署

firebase deploy

這會將靜態內容部署至 Firebase Hosting，並允許 Firebase 回到 Cloud Functions for Firebase 上託管的 Express 應用程式。

選用：與 Firebase 驗證整合

Firebase 部署工具會偵測網路架構，並自動使用 Cookie 讓用戶端和伺服器狀態保持同步。如要存取驗證環境，Express res.locals 物件可選擇性包含已驗證的 Firebase 應用程式例項 (firebaseApp) 和目前登入的使用者 (currentUser)。