在多個網站上共用專案資源

您可以在單一 Firebase 專案中設定一或多個 Firebase 託管網站。由於網站都屬於同一個 Firebase 專案，因此所有網站都可以存取專案的其他 Firebase 資源。

  • 每個網站都有自己的代管設定。
  • 每個網站都有自己的內容集合。
  • 每個網站可以擁有一或多個關聯網域。

在同一項 Firebase 專案中設定多個託管網站後，就能在相關網站和應用程式之間輕鬆共用 Firebase 資源。舉例來說，如果您將網誌、管理面板和公開應用程式都設為同一項 Firebase 專案中的個別網站，這些成員就能共用相同的 Firebase 驗證使用者資料庫，並擁有專屬的專屬網域或內容。

步驟 1：更新 Firebase CLI 版本

更新至最新版 Firebase CLI，即可使用最新的 Firebase 託管功能。

步驟 2：新增其他網站

使用下列任一方法將其他網站加入 Firebase 專案：

對於上述每個方法，您都需要指定 SITE_ID，用來建構 Firebase 為網站佈建的預設子網域：

  • SITE_ID.web.app
  • SITE_ID.firebaseapp.com

由於 SITE_ID 用於這些網址，因此網站 ID 有下列規定：

  • 必須是有效的主機名稱標籤，不得含有 .、_ 等。
  • 長度不得超過 30 個半形字元
  • 在 Firebase 中不得重複

您也可以選擇新增自訂網域，為多個網站提供相同的內容和設定。

刪除次要網站

請使用下列其中一種方法，將不需要的網站從 Firebase 專案中刪除：

請注意，預設網站與 Firebase 專案 ID 的 SITE_ID 相同，因此無法刪除。

步驟 3：為網站設定部署目標

如果您有多個網站且您執行 Firebase CLI 部署指令，CLI 需要一種方式來溝通應將哪些設定部署至每個網站。透過部署目標，您可以在 firebase.json 設定檔和 Firebase CLI 指令中使用 TARGET_NAME 來識別「特定」網站，以便測試或部署至您的網站。

如要建立部署目標並將 TARGET_NAME 套用至託管網站，請從專案目錄的根目錄中執行下列 CLI 指令：

firebase target:apply hosting TARGET_NAME RESOURCE_IDENTIFIER

其中的參數如下：

  • TARGET_NAME：您要部署的託管網站的專屬名稱，由您自行定義。

  • RESOURCE_IDENTIFIER：用於託管網站的 SITE_ID，列在 Firebase 專案中

例如，如果您在 Firebase 專案中建立了兩個網站 (myapp-blog 和 myapp-app)，可以執行下列指令，為每個網站套用專屬的 TARGET_NAME (分別 blog 和 app)：

firebase target:apply hosting blog myapp-blog
firebase target:apply hosting app myapp-app

部署目標的設定會儲存在專案目錄中的 .firebaserc 檔案中，因此您只需要為每項專案設定部署目標一次。

步驟 4：定義每個網站的代管設定

當您在 firebase.json 檔案中定義其代管設定時，請使用網站的套用 TARGET_NAME。

  • 如果您的 firebase.json 檔案定義了多個網站的設定，請使用陣列格式：

    {
  "hosting": [ {
      "target": "blog",  // "blog" is the applied TARGET_NAME for the Hosting site "myapp-blog"
      "public": "blog/dist",  // contents of this folder are deployed to the site "myapp-blog"

      // ...
    },
    {
      "target": "app",  // "app" is the applied TARGET_NAME for the Hosting site "myapp-app"
      "public": "app/dist",  // contents of this folder are deployed to the site "myapp-app"

      // ...

      "rewrites": [...]  // You can define specific Hosting configurations for each site
    }
  ]
}

  • 如果您的 firebase.json 檔案只為一個網站定義設定，就不必使用陣列格式：

    {
  "hosting": {
      "target": "blog",
      "public": "dist",

      // ...

      "rewrites": [...]
  }
}

步驟 5：在本機進行測試、預覽變更，並部署至您的網站

從本機專案目錄的根目錄中執行下列任一指令。

指令 說明
firebase emulators:start --only hosting 模擬由本機託管的網址 default 託管網站的代管內容與設定
firebase emulators:start --only hosting:TARGET_NAME 在本地託管的網址中模擬指定代管網站的代管內容與設定
firebase hosting:channel:deploy \
CHANNEL_ID		 透過預覽網址部署預設託管網站的「託管」內容和設定
firebase hosting:channel:deploy \
CHANNEL_ID --only TARGET_NAME		 透過預覽網址部署指定代管網站的「託管」內容與設定
firebase deploy --only hosting 將託管內容和設定部署至在「firebase.json」中設定的所有託管網站實際發布版本
firebase deploy --only hosting:TARGET_NAME 將代管內容和設定部署至指定「託管」網站的上線頻道
指令 說明
(不建議；請改用 emulators:start)
firebase serve --only hosting 		透過本機託管的網址提供 default 託管網站的代管內容與設定
(不建議；請改用 emulators:start)
firebase serve --only hosting:TARGET_NAME 		從本機託管的網址提供指定「代管」網站的「代管」內容與設定