如何在 Firebase 托管中处理动态 URL 路由

假设在 Firebase 的公共文件夹中,我有一个 index.html 和一个 salon.html.

So let's say in my public folder in Firebase i have an index.html and a salon.html.

现在对于像 xyz.com/salon/43 这样的网址,我想加载 salon.html 并在 javascript 中从实时数据库中获取沙龙 43.

Now for a url like xyz.com/salon/43 I want to load salon.html and in the javascript I want to fetch salon 43 from the realtime database.

现在我可以使用 xyz.com/salon?id=43 之类的网址.我想知道是否可以在 Firebase 托管中进行前者,如果可以,如何做.

Right now I'm able to have urls like xyz.com/salon?id=43. I'm wondering if it is possible to do the former in Firebase hosting and if so how.

推荐答案

您正在寻找 Firebase Hosting 重写.来自文档:

You're looking for Firebase Hosting rewrites. From the documentation:

如果您想为多个 URL 显示相同的内容,请使用重写.重写对于模式匹配特别有用,因为您可以接受任何与模式匹配的 URL,并让客户端代码决定要显示的内容.重写规则可用于支持使用 HTML5 pushState 进行导航的应用程序.当浏览器尝试打开指定的源 URL 时,它会在目标 URL 处获得文件的内容.

Use a rewrite when you want to show the same content for multiple URLs. Rewrites are particularly useful with pattern matching, as you can accept any URL that matches the pattern and let the client-side code decide what to display. Rewrite rules can be used to support apps using HTML5 pushState for navigation. When a browser attempts to open a specified source URL it will be given the contents of the file at the destination URL.

可以通过在 firebase.json 文件中的托管中定义 rewrites 部分来指定 URL 重写:

URL rewrites can be specified by defining a rewrites section within hosting in the firebase.json file:

"hosting": {
  // Add the "rewrites" section within "hosting"
  "rewrites": [ {
    "source": "**",
    "destination": "/index.html"
  } ]
}

相关文章