Join us for Firebase Summit on November 10, 2021. Tune in to learn how Firebase can help you accelerate app development, release with confidence, and scale with ease. Register

配置託管行為

使用 Firebase 託管,您可以為對您網站的請求配置自定義託管行為。

您可以為託管配置什麼?

  • 指定要部署到 Firebase 託管的本地項目目錄中的哪些文件。學習怎樣。

  • 提供定制的 404/Not Found 頁面。學習怎樣。

  • 設置redirects的頁面,您已經移動或刪除。學習怎樣。

  • 設置rewrites任何這些目的:

  • 添加headers以沿著左右的請求或響應,附加信息通過諸如瀏覽器應如何處理頁和其內容(認證,緩存,編碼等)。學習怎樣。

  • 設置國際化 (i18n) 重寫以根據用戶的語言偏好和/或國家/地區提供特定內容。了解如何(不同頁)。

您在哪裡定義您的託管配置?

你在你的定義火力地堡主機配置firebase.json文件。火力地堡自動生成你的firebase.json在項目的根目錄下,當你運行該文件firebase init命令。

你可以找到一個完整的firebase.json配置示例在這個頁面的底部(只覆蓋火力地堡主機)。請注意,一個firebase.json文件還可以包含其他火力地堡服務配置

您可以檢查部署firebase.json使用內容託管REST API

託管響應的優先順序

此頁面上描述的不同 Firebase 託管配置選項有時會重疊。如果存在衝突,Hosting 將使用以下優先級順序確定其響應:

  1. 保留命名空間是使用begin /__/*路徑段
  2. 配置重定向
  3. 完全匹配靜態內容
  4. 配置重寫
  5. 自定義404
  6. 默認404頁面

如果您使用的i18n重寫,將完全匹配和404處理的優先級順序在擴大範圍,以適應你的“國際化的內容”。

指定要部署的文件

默認屬性- publicignore -包括在默認firebase.json文件中定義該項目目錄中的文件應該部署到您的火力地堡項目。

默認hosting在配置firebase.json文件看起來像這樣:

"hosting": {
  "public": "public",  // the only required attribute for Hosting
  "ignore": [
    "firebase.json",
    "**/.*",
    "**/node_modules/**"
  ]
}

民眾

必需的
public屬性指定的目錄部署到火力地堡託管。默認值是一個名為public ,但您可以指定任何目錄的路徑,只要它存在於你的項目目錄。

以下是要部署的目錄的默認指定名稱:

"hosting": {
  "public": "public"

  // ...
}

您可以將默認值更改為要部署的目錄:

"hosting": {
  "public": "dist/app"

  // ...
}

忽略

可選的
ignore屬性指定忽略文件上部署。它可以採取的水珠同樣的方式, Git的手柄.gitignore

以下是要忽略的文件的默認值:

"hosting": {
  // ...

  "ignore": [
    "firebase.json",  // the Firebase configuration file (the file described on this page)
    "**/.*",  // files with a leading period should be hidden from the system
    "**/node_modules/**"  // contains dependencies used to create your site but not run it
  ]
}

自定義 404/Not Found 頁面

可選的
你可以成為一個自定義的404 Not Found錯誤,當用戶試圖訪問一個不存在的頁面。

在項目中創建的新文件public目錄,命名為404.html ,然後添加您的自定義404 Not Found的內容的文件。

火力地堡主機會顯示這個自定義的內容404.html如果瀏覽器觸發頁面404 Not Found您的域或子域的錯誤。

配置重定向

可選的
如果您移動了頁面或縮短 URL,請使用 URL 重定向來防止鏈接失效。例如,你可以在瀏覽器重定向從example.com/teamexample.com/about.html

通過創建一個指定的URL的重定向redirects包含對象數組屬性(稱為“重定向規則”)。在每個規則中,指定一個 URL 模式,如果與請求 URL 路徑匹配,則觸發 Hosting 響應重定向到指定的目標 URL。

下面是一個基本結構redirects屬性。這個例子將請求重定向到/foo通過向一個新的請求/bar

"hosting": {
  // ...

  // Returns a permanent redirect to "/bar" for requests to "/foo" (but not "/foo/**")
  "redirects": [ {
    "source": "/foo",
    "destination": "/bar",
    "type": 301
  } ]
}

所述redirects屬性包含的重定向規則,其中每個規則必須包括下表中的字段的陣列。

火力託管比較sourceregex對所有的URL路徑的值在每個請求的開始(前瀏覽器確定文件或文件夾是否存在於該路徑)。如果發現匹配,那麼火力地堡託管源服務器發送一個HTTPS重定向響應告訴瀏覽器,使在一個新的請求destination URL。

場地描述
redirects
source (推薦)
regex

一種 URL 模式,如果與初始請求 URL 匹配,則會觸發託管應用重定向

destination

瀏覽器應在其中發出新請求的靜態 URL

此 URL 可以是相對路徑或絕對路徑。

type

HTTPS 響應代碼

  • 使用的類型301的“永久移動”
  • 使用類型的302關於'實測值'(臨時重定向)

捕獲重定向的 URL 段

可選的
有時候,你可能需要一個重定向規則的URL模式(捕獲特定部分sourceregex的值),在規則,然後再利用這些細分destination路徑。

配置重寫

可選的
使用重寫為多個 URL 顯示相同的內容。重寫對於模式匹配特別有用,因為您可以接受與模式匹配的任何 URL,並讓客戶端代碼決定要顯示的內容。

您還可以使用重寫以支持使用應用HTML5 pushState的導航。當瀏覽器試圖打開指定的相匹配的URL路徑sourceregex URL模式,瀏覽器將給出該文件的內容在destination URL代替。

指定URL重寫通過創建一個rewrites包含對象數組屬性(稱為“重寫規則”)。在每個規則中,指定一個 URL 模式,如果與請求 URL 路徑匹配,則觸發 Hosting 響應,就像為服務提供了指定的目標 URL 一樣。

下面是一個基本結構rewrites屬性。這個例子提供index.html的請求不存在的文件或目錄。

"hosting": {
  // ...

  // Serves index.html for requests to files or directories that do not exist
  "rewrites": [ {
    "source": "**",
    "destination": "/index.html"
  } ]
}

rewrites屬性包含的重寫規則,其中每個規則必須包括下表中的字段的陣列。

如果一個文件或目錄沒有在指定的相匹配的URL路徑存在火力主機只適用於重寫規則sourceregex URL模式。當一個請求觸發重寫規則,瀏覽器返回指定的實際內容destination文件,而不是HTTP重定向。

場地描述
rewrites
source (推薦)
regex

一個 URL 模式,如果與初始請求 URL 匹配,則觸發託管應用重寫

destination

必須存在的本地文件

此 URL 可以是相對路徑或絕對路徑。

對函數的直接請求

您可以使用rewrites從火力地堡主機URL服務功能。下面的例子是從摘錄服務使用雲功能動態內容

例如,直接從頁面的所有請求/bigben您託管網站執行bigben功能:

"hosting": {
  // ...

  // Directs all requests from the page `/bigben` to execute the `bigben` function
  "rewrites": [ {
    "source": "/bigben",
    "function": "bigben"
  } ]
}

添加該重寫規則和(使用部署到火力地堡後firebase deploy ),你的功能是通過以下網址可達:

  • 您的 Firebase 子域:
    PROJECT_ID .web.app/bigbenPROJECT_ID .firebaseapp.com/bigben

  • 任何連接的自定義域
    CUSTOM_DOMAIN /bigben

當將請求重定向到功能與主機,所支持的HTTP請求的方法是GETPOSTHEADPUTDELETEPATCH ,和OPTIONS 。像其他方法REPORTPROFIND不被支持。

對 Cloud Run 容器的直接請求

您可以使用rewrites從火力地堡主機URL訪問雲中運行的容器。下面的例子是從摘錄服務使用雲中運行的動態內容

例如,直接從頁面的所有請求/helloworld上你的託管網站觸發啟動和運行helloworld容器實例:

"hosting": {
 // ...

 // Directs all requests from the page `/helloworld` to trigger and run a `helloworld` container
 "rewrites": [ {
   "source": "/helloworld",
   "run": {
     "serviceId": "helloworld",  // "service name" (from when you deployed the container image)
     "region": "us-central1"  // optional (if omitted, default is us-central1)
   }
 } ]
}

添加該重寫規則和(使用部署到火力地堡後firebase deploy ),您的容器圖像是通過以下網址可達:

  • 您的 Firebase 子域:
    PROJECT_ID .web.app/helloworldPROJECT_ID .firebaseapp.com/helloworld

  • 任何連接的自定義域
    CUSTOM_DOMAIN /helloworld

當將請求重定向到雲環境中運行的容器與託管,支持HTTP請求方法是GETPOSTHEADPUTDELETEPATCHOPTIONS 。像其他方法REPORTPROFIND不被支持。

目前,您可以在以下區域將 Cloud Run 重寫與託管結合使用:

  • asia-east1
  • asia-east2
  • asia-northeast1
  • asia-northeast2
  • asia-northeast3
  • asia-south1
  • asia-southeast1
  • asia-southeast2
  • australia-southeast1
  • europe-north1
  • europe-west1
  • europe-west2
  • europe-west3
  • europe-west4
  • europe-west6
  • northamerica-northeast1
  • southamerica-east1
  • us-central1
  • us-east1
  • us-east4
  • us-west1

您可以使用rewrites創建自定義域動態鏈接。請訪問有關詳細信息,動態鏈接文件設置為動態鏈接自定義域

  • 使用您的自定義域適用於動態鏈接

    "hosting": {
      // ...
    
      "appAssociation": "AUTO",  // required for Dynamic Links (default is AUTO if not specified)
    
      // Add the "rewrites" attribute within "hosting"
      "rewrites": [ {
        "source": "/**",  // the Dynamic Links start with "https://CUSTOM_DOMAIN/"
        "dynamicLinks": true
      } ]
    }
    
  • 指定用於動態鏈接的自定義​​域路徑前綴

    "hosting": {
      // ...
    
      "appAssociation": "AUTO",  // required for Dynamic Links (default is AUTO if not specified)
    
      // Add the "rewrites" attribute within "hosting"
      "rewrites": [ {
        "source": "/promos/**",  // the Dynamic Links start with "https://CUSTOM_DOMAIN/promos/"
        "dynamicLinks": true
      }, {
        "source": "/links/share/**",  // the Dynamic Links start with "https://CUSTOM_DOMAIN/links/share/"
        "dynamicLinks": true
      } ]
    }
    

配置動態鏈接在你firebase.json文件的要求如下:

場地描述
appAssociation

必須設置為AUTO

  • 如果你沒有在配置中包含此屬性,默認appAssociationAUTO
  • 通過設置該屬性為AUTO ,主機可以動態地生成assetlinks.jsonapple-app-site-association的文件正在需要的時候,。
rewrites
source

您要用於動態鏈接的路徑

與重寫 URL 路徑的規則不同,動態鏈接的重寫規則不能包含正則表達式。

dynamicLinks必須設置為true

配置標題

可選的
標頭允許客戶端和服務器隨請求或響應一起傳遞附加信息。某些標頭集會影響瀏覽器處理頁面及其內容的方式,包括訪問控制、身份驗證、緩存和編碼。

通過創建一個指定自定義,文件特定的響應頭headers包含標頭的對象數組屬性。在每個對像中,指定一個 URL 模式,如果與請求 URL 路徑匹配,則觸發託管應用指定的自定義響應標頭。

下面是一個基本結構headers屬性。此示例為所有字體文件應用 CORS 標頭。

"hosting": {
  // ...

  // Applies a CORS header for all font files
  "headers": [ {
    "source": "**/*.@(eot|otf|ttf|ttc|woff|font.css)",
    "headers": [ {
      "key": "Access-Control-Allow-Origin",
      "value": "*"
    } ]
  } ]
}

headers屬性包含的定義,其中每個定義必須包括在表中下面的字段的陣列。

場地描述
headers
source (推薦)
regex

一種 URL 模式,如果與初始請求 URL 匹配,則會觸發託管應用自定義標頭

要創建一個標題來匹配您的自定義404頁,使用404.html為你的sourceregex的值。

的(子)陣列headers

Hosting 應用於請求路徑的自定義標頭

每個子報頭必須包括一個keyvalue(參見下兩行)。

key報頭的名稱,例如Cache-Control
value為報頭中的值,例如max-age=7200

您可以了解更多關於Cache-Control ,它描述動態內容服務和託管微服務託管部分。您還可以了解更多有關CORS頭。

控制.html擴展

可選的
cleanUrls屬性允許您控制的URL是否應該包括.html擴展。

如果true ,自動寄存丟棄.html從上傳的文件URL擴展。如果一個.html擴展是在所述請求中添加,託管執行一個301重定向到相同的路徑,但消除了.html擴展。

以下是如何控制的夾雜物.html通過包含在URL中cleanUrls屬性:

"hosting": {
  // ...

  // Drops `.html` from uploaded URLs
  "cleanUrls": true
}

控制尾部斜杠

可選的
trailingSlash屬性允許你控制靜態內容的URL是否應該包括尾部斜杠。

  • true ,虛擬主機重定向的URL添加斜線。
  • false ,主機重定向的URL刪除斜線。
  • 當未指定,主機為目錄索引文件只使用後斜杠(例如, about/index.html )。

下面是如何控制通過添加結尾的斜杠trailingSlash屬性:

"hosting": {
  // ...

  // Removes trailing slashes from URLs
  "trailingSlash": false
}

trailingSlash屬性不影響重寫通過雲功能或雲環境中運行提供動態內容。

全局模式匹配

火力地堡主機配置選項廣泛利用的glob模式匹配與extglob,類似的符號來Git的程序如何處理gitignore規則和鮑爾手柄ignore規則。這wiki頁面是一個更詳細的參考,但下面是這個頁面上使用的例子說明:

  • firebase.json -唯一匹配firebase.json在根文件public目錄

  • ** -匹配任意子目錄中的任何文件或文件夾

  • * -僅匹配在根目錄的文件和文件夾public目錄

  • **/.* -匹配任何文件年初. (通常是隱藏文件,如.git文件夾)中的任意子目錄

  • **/node_modules/** -匹配在任意子目錄中的任何文件或文件夾node_modules文件夾,其本身可以是在一個任意的子目錄public目錄

  • **/*.@(jpg|jpeg|gif|png) -匹配任何文件中的任意子目錄下,以完全以下的一端: .jpg.jpeg.gif ,或.png

完整託管配置示例

下面是一個完整的firebase.json的火力地堡主機配置示例。請注意,一個firebase.json文件還可以包含其他火力地堡服務配置

{
  "hosting": {

    "public": "dist/app",  // "public" is the only required attribute for Hosting

    "ignore": [
      "firebase.json",
      "**/.*",
      "**/node_modules/**"
    ],

    "redirects": [ {
      "source": "/foo",
      "destination": "/bar",
      "type": 301
    }, {
      "source": "/firebase/**",
      "destination": "https://www.firebase.com",
      "type": 302
    } ],

    "rewrites": [ {
      // Shows the same content for multiple URLs
      "source": "/app/**",
      "destination": "/app/index.html"
    }, {
      // Configures a custom domain for Dynamic Links
      "source": "/promos/**",
      "dynamicLinks": true
    }, {
      // Directs a request to Cloud Functions
      "source": "/bigben",
      "function": "bigben"
    }, {
      // Directs a request to a Cloud Run containerized app
      "source": "/helloworld",
      "run": {
        "serviceId": "helloworld",
        "region": "us-central1"
      }
    } ],

    "headers": [ {
      "source": "**/*.@(eot|otf|ttf|ttc|woff|font.css)",
      "headers": [ {
        "key": "Access-Control-Allow-Origin",
        "value": "*"
      } ]
    }, {
      "source": "**/*.@(jpg|jpeg|gif|png)",
      "headers": [ {
        "key": "Cache-Control",
        "value": "max-age=7200"
      } ]
    }, {
      "source": "404.html",
      "headers": [ {
        "key": "Cache-Control",
        "value": "max-age=300"
      } ]
    } ],

    "cleanUrls": true,

    "trailingSlash": false,

    // Required to configure custom domains for Dynamic Links
    "appAssociation": "AUTO",

  }
}