Sử dụng tính năng viết lại quốc tế hóa ("viết lại i18n") để cung cấp các nội dung khác nhau tùy thuộc vào quốc gia hoặc ngôn ngữ ưa thích của người dùng. Dưới đây là một số cấu hình ví dụ mà bạn có thể thiết lập:
Cung cấp cùng một nội dung tiếng Pháp cho tất cả người dùng thích tiếng Pháp (bất kể quốc gia).
Ví dụ: trang chủ có văn bản tiếng PhápCung cấp nội dung tiếng Pháp tiêu chuẩn cho người dùng thích tiếng Pháp, nhưng đối với người dùng Canada thích tiếng Pháp, thay vào đó hãy phân phát nội dung tiếng Pháp Canada.
Ví dụ: trang chủ có cụm từ tiếng Pháp chuẩn so với trang chủ có cụm từ tiếng Pháp CanadaCung cấp cùng một nội dung cho tất cả người dùng Canada (bất kể tùy chọn ngôn ngữ của họ).
Ví dụ: trang chủ có ngôn ngữ "mặc định" trên trang web của bạn nhưng có tính năng dành riêng cho Canada (như chủ đề ngày lễ)Cung cấp nội dung tiếng Pháp của Canada cho người dùng Canada thích tiếng Pháp.
Ví dụ: trang chủ có cụm từ tiếng Pháp Canada và tính năng dành riêng cho Canada (như chủ đề ngày lễ)
Firebase Hosting xác định quốc gia của người dùng từ địa chỉ IP của họ và tùy chọn ngôn ngữ của người dùng từ tiêu đề yêu cầu Accept-Language
(thường được trình duyệt web của họ tự động đặt ).
Thiết lập viết lại i18n
Để thiết lập tính năng ghi đè i18n cho trang web Lưu trữ của bạn, bạn cần tạo thư mục "nội dung i18n" cho tất cả nội dung đã bản địa hóa của mình, sau đó thêm thuộc tính i18n
vào tệp firebase.json
để trỏ đến thư mục "nội dung i18n" mới của bạn.
Dưới đây là các bước chi tiết:
Trong thư mục
public
của thư mục ứng dụng cục bộ của bạn, hãy tạo một thư mục riêng cho "nội dung i18n" của bạn, sau đó tạo các thư mục con cho từng kết hợp ngôn ngữ và quốc gia được trang web của bạn hỗ trợ.Trong mỗi thư mục con, hãy thêm nội dung cụ thể cho sự kết hợp đó, như trang chủ theo chủ đề ngày lễ hoặc trang 404 theo ngôn ngữ cụ thể.
Đây là một ví dụ về thư mục "nội dung i18n" được gọi là
localized-files
:public/ index.html // your site's default homepage 404.html // your site's custom 404 page localized-files/ ALL_ca/ index.html es_ALL/ index.html 404.html fr/ index.html 404.html fr_ca/ index.html
public/ // matches requests that aren't specified by your "i18n content" subfolders // example: display your homepage in the "default" language for your site with no country-specific features index.html // your site's default homepage 404.html // your site's custom 404 page localized-files/ // matches requests from Canada with any language preference // example: display your homepage in the "default" language for your site with a Canada-specific feature ALL_ca/ index.html // matches requests from any country with a language preference of `es` or `es-foo` // example: display your homepage in Spanish with no country-specific features es_ALL/ index.html 404.html // your site's custom 404 page in Spanish // matches requests from any country with a language preference of `fr` or `fr-foo` // example: display your homepage in Standard French with no country-specific features fr/ index.html 404.html // your site's custom 404 page in French // matches requests from Canada with a language preference of `fr` or `fr-foo` // example: display your homepage in Canadian French and/or with a Canada-specific feature fr_ca/ index.html
Thư mục
localized-files/
chứa các thư mục con riêng biệt cho từng tổ hợp ngôn ngữ và quốc gia được trang web của bạn hỗ trợ. Mẫu đặt tên cho mỗi thư mục con phải tuân theo một trong các định dạng sau:languageCode_countryCode
: Chứa nội dung dành riêng cho người dùng có tùy chọn ngôn ngữ và mã quốc gia đólanguageCode
: Chứa nội dung dành riêng cho người dùng có tùy chọn ngôn ngữ đó nhưng nội dung không dành riêng cho quốc gia; về cơ bản tương đương vớilanguageCode_ALL
Tham khảo tiểu mục Mã quốc gia và ngôn ngữ bên dưới để biết thêm chi tiết về các mã này. Bạn có thể sử dụng giá trị
ALL
(phân biệt chữ hoa chữ thường) để chỉ ra bất kỳ quốc gia nào (nhưes_ALL/
) hoặc bất kỳ ngôn ngữ nào (nhưALL_ca/
).Các tệp trong thư mục con không cần phải có các tệp tương tự trong thư mục
public
hoặc các thư mục con khác. Bạn có thể tạo nội dung hoàn toàn dành riêng cho một ngôn ngữ và/hoặc quốc gia.Thêm thuộc tính
i18n
vào tệpfirebase.json
của bạn và chỉ định thư mục chứa "nội dung i18n" của bạn. Tiếp tục ví dụ của chúng tôi:// firebase.json "hosting": { "public": "public", "ignore": [ "firebase.json", "**/.*", "**/node_modules/**" ], "i18n": { "root": "/localized-files" // directory that contains your "i18n content" } ... }
Thư mục được chỉ định cho
root
phải là tên của thư mục chứa tất cả các thư mục con "nội dung i18n" của bạn. Nếu bạn đặt tất cả các thư mục con "nội dung i18n" vào thư mục gốc của thư mụcpublic
, hãy sử dụng/
cho giá trị củaroot
. Dấu gạch chéo đầu và cuối trong giá trịroot
là tùy chọn.Triển khai "nội dung i18n" và cấu hình của bạn vào trang web Lưu trữ của bạn.
Bạn có thể kiểm tra thiết lập của mình bằng cách sử dụng tính năng ghi đè cookie .
Mã quốc gia và ngôn ngữ
Khi đặt tên cho thư mục con "nội dung i18n", bạn phải sử dụng chữ thường cho cả mã quốc gia và ngôn ngữ. Bạn có thể sử dụng giá trị ALL
(phân biệt chữ hoa chữ thường) để chỉ ra bất kỳ quốc gia nào (như es_ALL/
) hoặc bất kỳ ngôn ngữ nào (như ALL_ca/
).
Hosting lấy mã quốc gia từ địa chỉ IP của người dùng. Mã quốc gia là mã ISO 3166-1 alpha-2 gồm hai chữ cái .
Mã ngôn ngữ được lấy từ tiêu đề yêu cầu Accept-Language
của người dùng (thường được trình duyệt web của họ đặt tự động ). Chúng là mã ISO 639-1 . Hãy ghi nhớ những điều sau khi sử dụng mã ngôn ngữ:
Khi Hosting tìm kiếm "nội dung i18n" nào để phân phối, nó sẽ sắp xếp ngôn ngữ dựa trên các giá trị chất lượng trong tiêu đề
Accept-Language
.Dịch vụ lưu trữ loại bỏ bất kỳ thẻ phụ khu vực và quốc gia nào trong tiêu đề
Accept-Language
, do đó mã ngôn ngữ trong tên thư mục con "nội dung i18n" không thể chứa các thẻ phụ này. Ví dụ: bạn không thể sử dụnges-419
hoặces-US
làm mã ngôn ngữ trong tên thư mục con, nhưng bạn có thể sử dụnges
.Nếu bạn muốn cung cấp nội dung khu vực hoặc quốc gia cụ thể, bạn có thể tạo các thư mục con chứa nội dung ngôn ngữ-quốc gia cụ thể mà bạn muốn hỗ trợ.
Trong ví dụ này, một yêu cầu từ Tây Ban Nha với tùy chọn ngôn ngữ là
es
,es-es
hoặc thậm chíes-419
sẽ nhận được nội dung từ thư mục cones_es/
vì Hosting coi tất cả các mã ngôn ngữ đó làes
.Yêu cầu từ Hoa Kỳ, Mexico hoặc bất kỳ quốc gia nào khác có tùy chọn ngôn ngữ là
es-419
sẽ nhận được nội dung từ thư mục cones_ALL/
vì Hosting coies-419
làes
.public/ // matches requests that aren't specified by your "i18n content" subfolders index.html // the site's default homepage localized-files/ // matches requests from Spain with a language preference of `es` or `es-foo` es_es/ index.html // matches requests from any other country with a language preference of `es` or `es-foo` es_ALL/ index.html
Trong ví dụ này, yêu cầu từ Mexico với tùy chọn ngôn ngữ là
es-419
sẽ nhận được nội dung từ thư mục cones_mx/
vì Hosting xử lý mã ngôn ngữes-419
làes
.Tuy nhiên, yêu cầu từ Hoa Kỳ với tùy chọn ngôn ngữ
es-419
sẽ nhận được nội dung từ thư mụces_ALL/
vì Hosting coies-419
làes
và không có thư mục cones_us/
.public/ // matches requests that aren't specified by your "i18n content" subfolders index.html // the site's default homepage localized-files/ // matches requests from Argentina with a language preference of `es` or `es-foo` (mimics behavior of `es-ar` header tag) es_ar/ index.html // matches requests from Spain with a language preference of `es` or `es-foo` (mimics behavior of `es-es` header tag) es_es/ index.html // matches requests from Mexico with a language preference of `es` or `es-foo` (mimics behavior of `es-mx` header tag) es_mx/ index.html // matches requests from any other country with a language preference of `es` or `es-foo` (mimics behavior of `es-419` header tag) es_ALL/ index.html
Thứ tự ưu tiên cho "nội dung i18n"
Nếu bạn thiết lập viết lại i18n, Hosting sẽ phân phối nội dung dựa trên thứ tự ưu tiên sau:
Các vùng tên dành riêng bắt đầu bằng phân đoạn đường dẫn
/__/*
Chuyển hướng được định cấu hình
Nội dung tĩnh khớp chính xác
Mã ngôn ngữ + Mã quốc gia (ví dụ: nội dung từ
fr_ca/
)
Thứ tự tuân theo các giá trị chất lượng cho từng ngôn ngữ trong tiêu đềAccept-Language
của yêu cầu.Chỉ mã quốc gia (ví dụ: nội dung từ
ALL_ca/
)Chỉ mã ngôn ngữ (ví dụ: nội dung từ
fr/
hoặces_ALL/
)
Thứ tự tuân theo các giá trị chất lượng cho từng ngôn ngữ trong tiêu đềAccept-Language
của yêu cầu.Nội dung tĩnh khớp chính xác "Mặc định"
Đây là nội dung nằm ngoài thư mục "nội dung i18n", giống như ở thư mục gốc của thư mụcpublic
.
Viết lại cấu hình
xử lý 404
i18n 404 trang
Điều này tuân theo thứ tự ưu tiên tương tự được liệt kê ở trên đối với nội dung tĩnh khớp chính xác.Trang 404 tùy chỉnh
Trang 404 mặc định (do Firebase cung cấp)
Ví dụ về thứ tự ưu tiên
Hãy tiếp tục ví dụ của chúng tôi từ trên. Chúng tôi sẽ sử dụng cùng một thư mục mẫu và một yêu cầu mẫu.
Ví dụ thư mục dự án cục bộ có thư mục "nội dung i18n" (được gọi là
localized-files
)public/ index.html // your site's default homepage 404.html // your site's custom 404 page localized-files/ ALL_ca/ index.html es_ALL/ index.html 404.html fr/ index.html 404.html fr_ca/ index.html
Thông tin yêu cầu ví dụ
Mã ngôn ngữ:
fr
,en
(tiếng Pháp, rồi tiếng Anh)
Mã ngôn ngữ được sắp xếp dựa trên giá trị chất lượng trong tiêu đềAccept-Language
.Mã quốc gia:
ca
(Canada)
Theo thứ tự ưu tiên khớp chính xác và giá trị chất lượng cho tùy chọn ngôn ngữ, Hosting sẽ tìm kiếm các thư mục cho trang được yêu cầu theo thứ tự sau.
public/localized-files/fr_ca/
public/localized-files/en_ca/
public/localized-files/ALL_ca/
public/localized-files/fr_ALL/
public/localized-files/fr/
public/localized-files/en_ALL/
public/localized-files/en/
public/
xử lý 404
Trang nào sẽ được phục vụ cho người dùng?
Trang được yêu cầu:
index.html
index.html
từ thư mụcfr_ca/
Vì Hosting tìm kiếm thư mục con
fr_ca/
trước tiên nên nó sẽ tìm thấy kết quả khớp chính xác choindex.html
trong thư mục con đó.Trang được yêu cầu:
awesome-page.html
404.html
từ thư mục confr/
Trước tiên, dịch vụ lưu trữ sẽ tìm kiếm toàn bộ thư mục (bao gồm tất cả các thư mục con và thư mục gốc "nội dung i18n") theo thứ tự ưu tiên để có kết quả khớp chính xác, nhưng không có kết quả khớp chính xác cho
awesome-page.html
.Vì vậy, Hosting sẽ bắt đầu xử lý 404, tuân theo thứ tự ưu tiên i18n tương tự như các tìm kiếm đối sánh chính xác. Thư mục con
fr/
là thư mục con đầu tiên được tìm kiếm có chứa trang 404.
Lưu ý những điều sau đây về việc tìm kiếm và phục vụ thư mục "nội dung i18n" này:
Thư mục
localized-files/
không thực sự chứa các thư mục conen_ca/
,en_ALL/
hoặcen/
, do đó Hosting sẽ chỉ bỏ qua danh sách ưu tiên cho đến khi tìm thấy thư mục con phù hợp cho sự kết hợp ngôn ngữ-quốc gia của yêu cầu.Mặc dù thư mục
localized-files/
chứa thư mục cones_ALL/
nhưng yêu cầu mẫu ở trên không bao gồm mã ngôn ngữes
hoặces-foo
, do đó Hosting sẽ không tìm kiếm "nội dung i18n" khớp vớies
.Các thư mục con được gọi là
fr/
vàfr_ALL/
tương đương nhau xét theo tùy chọn quốc gia và ngôn ngữ của người dùng. Tuy nhiên, nếu cả hai thư mục con đều tồn tại, Hosting sẽ phân phátfr_ALL/
content trướcfr/
content.
Ghi đè mã ngôn ngữ và quốc gia bằng cookie
Bạn có thể thay đổi nội dung nào được cung cấp bằng cách sử dụng cookie để ghi đè tiêu đề quốc gia và ngôn ngữ.
Dưới đây là một số cách bạn có thể sử dụng ghi đè cookie:
Thử nghiệm một tính năng với các kết hợp ngôn ngữ/quốc gia khác nhau để kiểm tra xem nội dung nào được phân phối.
Cho phép người dùng của bạn thay đổi nội dung họ nhìn thấy. Ví dụ: bạn có thể triển khai bộ chọn ngôn ngữ, sau đó đặt cookie
firebase-language-override
của người dùng cho phù hợp.
Để định cấu hình ghi đè cookie, hãy đặt cookie bằng cả hai hoặc một trong hai tên sau: firebase-country-override
và firebase-language-override
. Ví dụ: đoạn mã JavaScript sau ghi đè mã quốc gia thành ca
và tiêu đề Accept-Language
thành fr,en
:
document.cookie = "firebase-country-override=ca";
document.cookie = "firebase-language-override=fr,en";
Ghi đè cookie ngôn ngữ phải là danh sách mã ngôn ngữ được phân tách bằng dấu phẩy theo thứ tự ưu tiên, không có thẻ phụ hoặc giá trị chất lượng.
Việc ghi đè cookie không được phản ánh trong nhật ký.