使用 Firebase 托管实现本地化 404 页面 [英] Implementing localized 404 page with Firebase hosting

查看:20
本文介绍了使用 Firebase 托管实现本地化 404 页面的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

假设我的网络应用有两个语言环境:英语 (myapp.com/en/) 和法语 (myapp.com/fr/).我想本地化我的 404 页面,以便对 myapp.com/en/non-existentmyapp.com/non-existent 的请求将返回英文版404 页面和对 myapp.comm/fr/non-existent 的请求将返回法语页面.

Say my web app has two locales: English(myapp.com/en/) and French(myapp.com/fr/). I want to localize my 404 pages, so that request to myapp.com/en/non-existent or myapp.com/non-existent would return an English version of the 404 page and request to myapp.comm/fr/non-existent would return a French one.

但是,Firebase 托管似乎默认不提供此类功能,因为它只允许单个 404 页面(来源)

However, it seems like Firebase Hosting does not provide such functionality by default, as it only allows a single 404 page(source)

那么,有没有办法使用 Firebase 托管实现本地化 404 页面?

So, is there a way of implementing a localized 404 page with Firebase Hosting?

推荐答案

自 2020 年 8 月 12 日起,Firebase 托管现在包括对 i18n 内化.

As of August 12th 2020, Firebase Hosting now includes support for i18n internalization.

使用方法如下:

  1. 在您的 public 目录下创建一个新目录来托管这些本地化文件(例如 localized).
  2. 更新您的 firebase.json 文件以包含对这个新目录的引用:
  1. Create a new directory to host these localized files (e.g localized) under your public directory.
  2. Update your firebase.json file to include a reference to this new directory:

// firebase.json

"hosting": {

  "public": "public",

  "ignore": [
     // ...
  ],

  "i18n": {
    "root": "/localized"  // directory that contains your "i18n content"
  }

  // ...
}

  1. localized 目录下,创建一个名为 fr 的新目录,您可以在其中添加法语 404.html 文件.
  2. 运行 firebase deploy 来部署您的网站,现在您的法国用户应该会被重定向到正确的页面 :)
  1. Under the localized directory, create a new directory named fr, and that's where you can add your french 404.html file.
  2. Run firebase deploy to deploy your site and now your french users should be redirected to the correct page :)

请参阅 Firebase 文档了解有关国家和语言代码的更多信息.

See the Firebase Docs for more information on country and language codes.

这篇关于使用 Firebase 托管实现本地化 404 页面的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆