Catch up on everything we announced at this year's Firebase Summit. Learn more

在本地測試,共享更改,然後實時部署

在部署到您的實時站點之前,您需要查看和測試您的更改。 Firebase 託管使您能夠在本地查看和測試更改,並與模擬的後端項目資源進行交互。如果您需要您的團隊成員查看和測試您的更改,Hosting 可以為您的站點創建可共享的臨時預覽 URL。我們甚至支持GitHub的整合從拉請求部署。

在你開始之前

完成上列出的步驟主機使用入門頁,具體有以下任務:

  1. 安裝 Firebase CLI 或將其更新到最新版本。
  2. 將本地項目目錄(包含您應用的內容)連接到您的 Firebase 項目。

您可以選擇部署應用的託管內容和配置,但這不是執行此頁面上的步驟的先決條件。

第1步:本地測試

如果您進行快速迭代或希望您的應用程序與模擬的後端項目資源進行交互,您可以在本地測試您的託管內容和配置。在本地測試時,Firebase 在本地託管的 URL 上為您的網絡應用提供服務。

託管是部分火力地堡本地仿真器套件,使您的應用程序與您的模擬託管內容和配置進行交互,以及可選的模擬項目資源(功能,數據庫和規則)。

  1. (可選)默認情況下,本地託管應用程序將與真正的,而非模擬的,項目資源(功能,數據庫,規則等)進行交互。您可以改為可選連接您的應用程序使用任何模擬的項目資源已經配置。了解更多:實時數據庫|雲公司的FireStore |雲功能

  2. 從本地項目目錄的根目錄,運行以下命令:

    firebase emulators:start
  3. 在由CLI返回的本地URL打開Web應用程序(通常是http://localhost:5000 )。

  4. 要使用更改更新本地 URL,請刷新瀏覽器。

從其他本地設備測試

默認情況下,模擬器只響應來自請求localhost 。這意味著您將能夠從計算機的 Web 瀏覽器訪問託管內容,但不能從網絡上的其他設備訪問。如果你想從其它本地設備測試,配置firebase.json像這樣:

"emulators": {
    // ...

    "hosting": {
      "port": 5000
      "host": "0.0.0.0"
    }
  }

步驟2:預覽和共享

如果您希望其他人在上線之前查看您的 Web 應用程序的更改,您可以使用預覽頻道。

在您部署到預覽頻道後,Firebase 會在“預覽網址”(一個可共享的臨時網址)為您的網絡應用提供服務。當使用預覽URL,對所有項目資源的真正後台的Web應用程序進行交互。

請注意,儘管預覽 URL 很難猜測(因為它們包含隨機哈希),但它們是公開的。因此,任何知道 URL 的人都可以訪問它。

  1. 從本地項目目錄的根目錄,運行以下命令:

    firebase hosting:channel:deploy CHANNEL_ID

    替換CHANNEL_ID與沒有空格的字符串(例如, feature_mission-2-mars )。此 ID 將用於構建與預覽頻道關聯的預覽 URL。

  2. 在 CLI 返回的預覽 URL 中打開您的 Web 應用程序。它會是這個樣子: PROJECT_ID -- CHANNEL_ID - RANDOM_HASH .web.app

  3. 要使用更改更新您的預覽 URL,請再次運行相同的命令。確保指定相同CHANNEL_ID的命令。

了解有關管理預覽渠道,包括如何設置頻道的到期。

Firebase 託管支持 GitHub 操作,當您提交對拉取請求的更改時,該操作會自動創建和更新預覽 URL。了解如何設置和使用此GitHub的行動

第3步:現場部署

當您準備好與全世界分享您的更改時,請將您的託管內容和配置部署到您的實時頻道。 Firebase 為這一步提供了幾個不同的選項,具體取決於您的用例(請參閱下面的選項)。

選項 1:從預覽頻道克隆到您的直播頻道

該選項提供了信心,你部署到直播頻道的確切內容和配置您在預覽通道進行測試。了解更多關於克隆版本

  1. 從任何目錄,運行以下命令:

    firebase hosting:clone SOURCE_SITE_ID:SOURCE_CHANNEL_ID TARGET_SITE_ID:live

    將每個佔位符替換為以下內容:

    • SOURCE_SITE_IDTARGET_SITE_ID :這些是包含在渠道的託管網站的ID。

      • 對於您的默認託管站點,請使用您的 Firebase 項目 ID。
      • 您可以指定位於同一 Firebase 項目甚至不同 Firebase 項目中的站點。
    • SOURCE_CHANNEL_ID :這是當前服務所需的版本部署到您的直播頻道的頻道IDENTIFER。

      • 對於直播頻道,使用live的信道ID。
  2. 查看您的更改(下一步)。

選項 2:從您的本地項目目錄部署到您的直播頻道

此選項使您可以靈活地調整特定於直播頻道的配置或進行部署,即使您尚未使用預覽頻道。

  1. 從本地項目目錄的根目錄,運行以下命令:

    firebase deploy --only hosting
  2. 查看您的更改(下一步)。

第4步:查看在您網站上的變化

上述兩個選項都將您的託管內容和配置部署到以下站點:

  • Firebase 為您的默認託管站點和任何其他託管站點配置的子域:
    SITE_ID .web.app (如PROJECT_ID .web.app
    SITE_ID .firebaseapp.com (如PROJECT_ID .firebaseapp.com

  • 任何自定義域,您已經連接到您的虛擬主機網站()

要限制部署到特定的託管網站,指定部署目標在你的CLI命令。

其他部署活動和信息

為部署添加註釋

您可以選擇向部署添加註釋。此註釋將顯示在其他部署信息託管儀表板的火力地堡控制台。例如:

firebase deploy --only hosting -m "Deploying the best new feature ever."

添加部署前和部署後腳本任務

您可以選擇連接shell腳本的firebase deploy命令執行預先部署或postdeploy任務。例如,部署後掛鉤可以通知管理員新的站點內容部署。請參閱火力地堡CLI文件的更多細節。

緩存部署的內容

當一個請求靜態內容製作,火力地堡託管自動緩存的CDN內容。如果重新部署您的網站內容,火力地堡自動清除整個CDN所有緩存的靜態內容,使新的請求收到您的新內容。

請注意,您可以配置的動態內容緩存

通過 HTTPS 提供服務

確保所有未託管在 Firebase 託管上的外部資源都通過 SSL (HTTPS) 加載,包括任何外部腳本。大多數瀏覽器不允許用戶加載“混合內容”(SSL 和非 SSL 流量)。

下一步