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

Định cấu hình hành vi lưu trữ

Với Lưu trữ Firebase, bạn có thể định cấu hình hành vi lưu trữ tùy chỉnh cho các yêu cầu đến trang web của mình.

Bạn có thể cấu hình những gì cho Hosting?

  • Chỉ định tệp nào trong thư mục dự án cục bộ mà bạn muốn triển khai cho Lưu trữ Firebase. Tìm hiểu cách thực hiện.

  • Cung cấp trang 404 / Không tìm thấy tùy chỉnh. Tìm hiểu cách thực hiện.

  • Thiết lập redirects cho các trang mà bạn đã di chuyển hoặc xóa. Tìm hiểu cách thực hiện.

  • Thiết lập rewrites cho bất kỳ các mục đích:

  • Thêm headers để vượt qua cùng biết thêm chi tiết về yêu cầu hoặc một phản ứng, chẳng hạn như làm thế nào các trình duyệt nên xử lý các trang và nội dung của nó (xác thực, bộ nhớ đệm, mã hóa, vv). Tìm hiểu cách thực hiện.

  • Thiết lập viết lại quốc tế hóa (i18n) để phân phát nội dung cụ thể dựa trên tùy chọn ngôn ngữ của người dùng và / hoặc quốc gia. Tìm hiểu cách (trang khác nhau).

Bạn xác định cấu hình Hosting của mình ở đâu?

Bạn định nghĩa Hosting cấu hình căn cứ hỏa lực của bạn trong firebase.json tập tin. Căn cứ hỏa lực tự động tạo ra của bạn firebase.json tập tin ở thư mục gốc của thư mục dự án của bạn khi bạn chạy các firebase init lệnh.

Bạn có thể tìm đầy đủ firebase.json dụ cấu hình (bao gồm chỉ Hosting căn cứ hỏa lực) ở dưới cùng của trang này. Lưu ý rằng một firebase.json tập tin cũng có thể chứa các cấu hình cho các dịch vụ căn cứ hỏa lực khác .

Bạn có thể kiểm tra được triển khai firebase.json nội dung bằng cách sử dụng API REST Hosting .

Thứ tự ưu tiên của các phản hồi Lưu trữ

Các tùy chọn cấu hình Lưu trữ Firebase khác nhau được mô tả trên trang này đôi khi có thể trùng lặp. Nếu có xung đột, Hosting sẽ xác định phản hồi của nó bằng cách sử dụng thứ tự ưu tiên sau:

  1. Namespace reserved bắt đầu bằng /__/* đoạn đường nét
  2. cấu hình trang đổi hướng
  3. Đối sánh chính xác nội dung tĩnh
  4. cấu hình được ghi đè
  5. Tuỳ chỉnh 404 trang
  6. Trang 404 mặc định

Nếu bạn đang sử dụng được ghi đè i18n , kết hợp chính xác và xử lý 404 thứ tự ưu tiên được mở rộng trong phạm vi để thích ứng với "nội dung i18n" của bạn.

Chỉ định tệp nào sẽ triển khai

Thuộc tính mặc định - publicignore - bao gồm trong mặc định firebase.json tập tin xác định các tập tin trong thư mục dự án của bạn nên được triển khai cho dự án căn cứ hỏa lực của bạn.

Giá trị mặc định hosting cấu hình trong một firebase.json tập tin trông như sau:

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

công cộng

Yêu cầu
Các public quy định cụ thể thuộc tính mà thư mục để triển khai đến căn cứ hỏa lực Hosting. Giá trị mặc định là thư mục có tên public , nhưng bạn có thể chỉ định con đường của bất kỳ thư mục, miễn là nó tồn tại trong thư mục dự án của bạn.

Sau đây là tên được chỉ định mặc định của thư mục để triển khai:

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

  // ...
}

Bạn có thể thay đổi giá trị mặc định cho thư mục mà bạn muốn triển khai:

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

  // ...
}

phớt lờ

Không bắt buộc
Các ignore quy định cụ thể thuộc tính các tập tin để bỏ qua trên triển khai. Có thể mất những đống cùng một cách mà Git xử lý .gitignore .

Sau đây là các giá trị mặc định để các tệp bỏ qua:

"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
  ]
}

Tùy chỉnh trang 404 / Không tìm thấy

Không bắt buộc
Bạn có thể phục vụ một tùy chỉnh 404 Not Found lỗi khi cố gắng sử dụng để truy cập vào một trang không tồn tại.

Tạo một file mới trong dự án của bạn public thư mục , đặt tên cho nó 404.html , sau đó thêm tùy chỉnh của bạn 404 Not Found nội dung vào tập tin.

Căn cứ hỏa lực Hosting sẽ hiển thị nội dung của tập quán này 404.html trang nếu một trình duyệt gây nên một 404 Not Found lỗi trên tên miền hoặc tên miền phụ của bạn.

Định cấu hình chuyển hướng

Không bắt buộc
Sử dụng chuyển hướng URL để ngăn các liên kết bị hỏng nếu bạn đã di chuyển một trang hoặc để rút ngắn URL. Ví dụ, bạn có thể chuyển hướng trình duyệt từ example.com/team để example.com/about.html .

Chỉ định chuyển hướng URL bằng cách tạo ra một redirects thuộc tính có chứa một mảng các đối tượng (gọi là "quy tắc chuyển hướng"). Trong mỗi quy tắc, hãy chỉ định một mẫu URL, nếu khớp với đường dẫn URL yêu cầu, sẽ kích hoạt Lưu trữ phản hồi với chuyển hướng đến URL đích được chỉ định.

Dưới đây là cấu trúc cơ bản cho một redirects thuộc tính. Ví dụ này đổi hướng yêu cầu /foo bằng cách làm cho một yêu cầu mới đến /bar .

"hosting": {
  // ...

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

Các redirects thuộc tính chứa một loạt các quy tắc chuyển hướng, trong đó mỗi nguyên tắc phải bao gồm các lĩnh vực trong bảng dưới đây.

Căn cứ hỏa lực Hosting so sánh source hoặc regex giá trị so với tất cả các đường dẫn URL vào lúc bắt đầu của mọi yêu cầu (trước khi trình duyệt sẽ xác định xem một tập tin hoặc thư mục tồn tại ở con đường đó). Nếu một trận đấu được tìm thấy, thì máy chủ Hosting nguồn gốc căn cứ hỏa lực sẽ gửi một phản ứng HTTPS chuyển hướng nói với các trình duyệt để thực hiện một yêu cầu mới tại destination URL.

Đồng ruộng Sự miêu tả
redirects
source (đề nghị)
hoặc regex

Mẫu URL, nếu khớp với URL yêu cầu ban đầu, sẽ kích hoạt Lưu trữ áp dụng chuyển hướng

destination

Một URL tĩnh nơi trình duyệt sẽ đưa ra một yêu cầu mới

URL này có thể là một đường dẫn tương đối hoặc một đường dẫn tuyệt đối.

type

Mã phản hồi HTTPS

  • Sử dụng một loại 301 cho 'Moved Permanently'
  • Sử dụng một loại 302 cho 'Tìm thấy' (Temporary Redirect)

Chụp các phân đoạn URL để chuyển hướng

Không bắt buộc
Đôi khi, bạn có thể cần phải phân đoạn chụp cụ thể của mẫu URL một quy tắc chuyển hướng của ( source hoặc regex giá trị), sau đó tái sử dụng những phân khúc này vào những năm cai trị destination con đường.

Định cấu hình ghi lại

Không bắt buộc
Sử dụng cách viết lại để hiển thị cùng một nội dung cho nhiều URL. Ghi lại đặc biệt hữu ích với đối sánh mẫu, vì bạn có thể chấp nhận bất kỳ URL nào phù hợp với mẫu và để mã phía máy khách quyết định nội dung sẽ hiển thị.

Bạn cũng có thể sử dụng được ghi đè để hỗ trợ các ứng dụng sử dụng HTML5 pushState để điều hướng. Khi một nỗ lực trình duyệt để mở một đường dẫn URL mà phù hợp với quy định source hoặc regex mẫu URL, trình duyệt sẽ được cung cấp các nội dung của file tại destination URL để thay thế.

Chỉ định URL viết lại bằng cách tạo ra một rewrites thuộc tính có chứa một mảng các đối tượng (gọi là "viết lại quy tắc"). Trong mỗi quy tắc, hãy chỉ định một mẫu URL, nếu khớp với đường dẫn URL yêu cầu, sẽ kích hoạt Lưu trữ phản hồi như thể dịch vụ được cung cấp URL đích được chỉ định.

Dưới đây là cấu trúc cơ bản cho một rewrites thuộc tính. Ví dụ này phục vụ index.html cho các yêu cầu các tập tin hoặc thư mục đó không tồn tại.

"hosting": {
  // ...

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

Các rewrites thuộc tính chứa một loạt các quy tắc viết lại, trong đó mỗi nguyên tắc phải bao gồm các lĩnh vực trong bảng dưới đây.

Căn cứ hỏa lực Hosting chỉ áp dụng một quy tắc viết lại nếu một tập tin hoặc thư mục không tồn tại một đường dẫn URL mà phù hợp với quy định source hoặc regex mẫu URL. Khi một yêu cầu gây nên một quy tắc viết lại, trở về trình duyệt nội dung thực tế của các quy định destination tập tin thay vì HTTP chuyển hướng.

Đồng ruộng Sự miêu tả
rewrites
source (đề nghị)
hoặc regex

Mẫu URL, nếu khớp với URL yêu cầu ban đầu, sẽ kích hoạt Lưu trữ áp dụng việc ghi lại

destination

Tệp cục bộ phải tồn tại

URL này có thể là một đường dẫn tương đối hoặc một đường dẫn tuyệt đối.

Yêu cầu trực tiếp đến một chức năng

Bạn có thể sử dụng rewrites để phục vụ một chức năng từ một căn cứ hỏa lực Hosting URL. Ví dụ sau đây là một đoạn trích từ phục vụ nội dung động sử dụng đám mây Chức năng .

Ví dụ, chỉ đạo tất cả các yêu cầu từ trang /bigben trên trang web của bạn Hosting để thực hiện bigben chức năng:

"hosting": {
  // ...

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

Sau khi thêm quy tắc viết lại này và triển khai tới căn cứ hỏa lực (sử dụng firebase deploy ), chức năng của bạn có thể truy cập thông qua các URL sau:

  • Các miền phụ Firebase của bạn:
    PROJECT_ID .web.app/bigbenPROJECT_ID .firebaseapp.com/bigben

  • Bất kỳ kết nối miền tùy chỉnh :
    CUSTOM_DOMAIN /bigben

Khi chuyển hướng các yêu cầu chức năng với Hosting, hỗ trợ phương pháp yêu cầu HTTP là GET , POST , HEAD , PUT , DELETE , PATCH , và OPTIONS . Các phương pháp khác như REPORT hoặc PROFIND không được hỗ trợ.

Yêu cầu trực tiếp đến một vùng chứa Cloud Run

Bạn có thể sử dụng rewrites để truy cập một container Mây Run từ một căn cứ hỏa lực Hosting URL. Ví dụ sau đây là một đoạn trích từ phục vụ nội dung động sử dụng đám mây Run .

Ví dụ, chỉ đạo tất cả các yêu cầu từ trang /helloworld trên trang web Hosting của bạn để kích hoạt khởi động và chạy một helloworld dụ container:

"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)
   }
 } ]
}

Sau khi thêm quy tắc viết lại này và triển khai tới căn cứ hỏa lực (sử dụng firebase deploy ), hình ảnh chứa của bạn có thể truy cập thông qua các URL sau:

  • Các miền phụ Firebase của bạn:
    PROJECT_ID .web.app/helloworldPROJECT_ID .firebaseapp.com/helloworld

  • Bất kỳ kết nối miền tùy chỉnh :
    CUSTOM_DOMAIN /helloworld

Khi chuyển hướng yêu cầu container Mây Run với Hosting, hỗ trợ phương pháp yêu cầu HTTP là GET , POST , HEAD , PUT , DELETE , PATCH , và OPTIONS . Các phương pháp khác như REPORT hoặc PROFIND không được hỗ trợ.

Hiện tại, bạn có thể sử dụng tính năng ghi lại Cloud Run với Hosting ở các khu vực sau:

  • 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

Bạn có thể sử dụng rewrites để tạo tên miền tuỳ chỉnh năng động Links. Hãy truy cập vào tài liệu động Liên kết để biết thông tin chi tiết về việc thiết lập một miền tùy chỉnh cho động Liên kết .

  • Sử dụng tên miền tùy chỉnh của bạn chỉ dành cho động Liên kết

    "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
      } ]
    }
    
  • Chỉ định tiền tố đường dẫn miền tùy chỉnh để sử dụng cho Liên kết động

    "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
      } ]
    }
    

Cấu hình động liên kết trong của bạn firebase.json tập tin đòi hỏi những điều sau đây:

Đồng ruộng Sự miêu tả
appAssociation

Phải được thiết lập để AUTO

  • Nếu bạn không bao gồm thuộc tính này trong cấu hình của bạn, mặc định cho appAssociationAUTO .
  • Bằng cách thiết lập thuộc tính này để AUTO , Hosting động có thể tạo ra assetlinks.jsonapple-app-site-association tập tin khi họ đang yêu cầu.
rewrites
source

Đường dẫn bạn muốn sử dụng cho Liên kết động

Không giống như các quy tắc viết lại đường dẫn đến URL, quy tắc viết lại cho Liên kết động không được chứa các biểu thức chính quy.

dynamicLinks Phải được đặt true

Định cấu hình tiêu đề

Không bắt buộc
Tiêu đề cho phép máy khách và máy chủ chuyển thông tin bổ sung cùng với một yêu cầu hoặc phản hồi. Một số bộ tiêu đề có thể ảnh hưởng đến cách trình duyệt xử lý trang và nội dung của trang, bao gồm kiểm soát truy cập, xác thực, bộ nhớ đệm và mã hóa.

Chỉ định tùy chỉnh, đáp ứng tiêu đề tập tin cụ thể bằng cách tạo ra một headers thuộc tính có chứa một mảng các đối tượng tiêu đề. Trong mỗi đối tượng, chỉ định một mẫu URL, nếu khớp với đường dẫn URL yêu cầu, sẽ kích hoạt Lưu trữ áp dụng các tiêu đề phản hồi tùy chỉnh đã chỉ định.

Dưới đây là cấu trúc cơ bản cho một headers thuộc tính. Ví dụ này áp dụng tiêu đề CORS cho tất cả các tệp phông chữ.

"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": "*"
    } ]
  } ]
}

Các headers thuộc tính chứa một loạt các định nghĩa, trong đó mỗi định nghĩa phải bao gồm các lĩnh vực trong bảng dưới đây.

Đồng ruộng Sự miêu tả
headers
source (đề nghị)
hoặc regex

Mẫu URL, nếu khớp với URL yêu cầu ban đầu, sẽ kích hoạt Lưu trữ áp dụng tiêu đề tùy chỉnh

Để tạo một tiêu đề để phù hợp với bạn trang 404 tuỳ chỉnh , sử dụng 404.html như bạn source hoặc regex giá trị.

mảng (chính và phụ) headers

Các tiêu đề tùy chỉnh mà Lưu trữ áp dụng cho đường dẫn yêu cầu

Mỗi tiểu tiêu đề phải bao gồm một keyvalue cặp (xem hai hàng kế tiếp).

key Tên của tiêu đề, ví dụ Cache-Control
value Giá trị cho tiêu đề, ví dụ max-age=7200

Bạn có thể tìm hiểu thêm về Cache-Control trong phần Hosting rằng mô tả phục vụ nội dung động và microservices lưu trữ. Bạn cũng có thể tìm hiểu thêm về CORS tiêu đề.

Kiểm soát .html mở rộng

Không bắt buộc
Các cleanUrls thuộc tính cho phép bạn kiểm soát hay không URL nên bao gồm các .html mở rộng.

Khi true , Hosting tự động giảm các .html mở rộng từ các URL tập tin tải lên. Nếu một .html mở rộng được thêm vào theo yêu cầu, Hosting thực hiện một 301 redirect đến con đường tương tự nhưng loại bỏ sự .html mở rộng.

Dưới đây là làm thế nào để kiểm soát sự bao gồm của .html trong URL bằng cách bao gồm một cleanUrls thuộc tính:

"hosting": {
  // ...

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

Kiểm soát dấu gạch chéo sau

Không bắt buộc
Các trailingSlash thuộc tính cho phép bạn kiểm soát hay không URL nội dung tĩnh nên bao gồm dấu slashes.

  • Khi true , Hosting ← liên kết URL để thêm một dấu gạch chéo.
  • Khi false , Hosting ← liên kết URL để loại bỏ một gạch chéo.
  • Khi không xác định, Hosting slashes chỉ sử dụng những trailing cho các tập tin index thư mục (ví dụ, about/index.html ).

Dưới đây là làm thế nào để kiểm soát trailing dấu gạch chéo bằng cách thêm một trailingSlash thuộc tính:

"hosting": {
  // ...

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

Các trailingSlash thuộc tính không ảnh hưởng đến viết lại nội dung động phục vụ bởi Mây Chức năng hoặc Cloud Run.

Đối sánh mô hình quả cầu

Căn cứ hỏa lực tùy chọn Hosting cấu hình sử dụng rộng rãi trong các mô hình kết hợp glob ký hiệu với extglob, tương tự như cách xử lý Git gitignore quy tắc và Bower xử lý ignore quy tắc. Trang wiki này là một tài liệu tham khảo chi tiết hơn, nhưng sau đây là cách giải thích các ví dụ sử dụng trên trang này:

  • firebase.json - Chỉ phù hợp với firebase.json tập tin trong thư mục gốc của public mục

  • ** - Trận bất kỳ tập tin hoặc thư mục trong một thư mục tùy ý

  • * - Chỉ phù hợp với tập tin và thư mục trong thư mục gốc của public mục

  • **/.* - Trận bất kỳ tập tin đầu với . (thường là các tập tin ẩn, như trong .git thư mục) trong một thư mục tùy ý

  • **/node_modules/** - Trận bất kỳ tập tin hoặc thư mục trong một thư mục con độc đoán của một node_modules thư mục, mà tự nó có thể trong một thư mục tùy ý của public mục

  • **/*.@(jpg|jpeg|gif|png) - Trận bất kỳ tập tin trong một thư mục tùy ý rằng kết thúc với đúng một trong các cách sau: .jpg , .jpeg , .gif , hoặc .png

Ví dụ về cấu hình lưu trữ đầy đủ

Sau đây là một đầy đủ firebase.json dụ cấu hình cho căn cứ hỏa lực Hosting. Lưu ý rằng một firebase.json tập tin cũng có thể chứa các cấu hình cho các dịch vụ căn cứ hỏa lực khác .

{
  "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",

  }
}