我的 Angular web 应用程序按预期通过按钮进行路由，但是当我在 url 中键入页面路径时，路由不起作用。 托管于 firebase

Question

When I run the program on my localhost, I can navigate through my program using the url, but not when it is hosted on firebase.

eg) Typing "www.localhost:4200/home" Takes me home.

Typing "www.localhost:4200/contact" Takes me to contact page.

BUT

When I host the website on firebase, I can only access it directly:" www.portfoliotest.web.app " and routing through the buttons work, but not when I type "www.portfoliotest.web.app/home" or "www.portfoliotest.web.app/contact" but i get a "Page not found" firebase error instead.

How can I set up my routing so that I can access my pages through the url?

Thank you.

Answer 1

Your routing isn't your issue: it's how you've set up Firebase.

In your firebase.json , you need to redirect all URLs to index.html :

"rewrites": [
  {
    "source": "**",
    "destination": "/index.html"
  }
]

That way, your Angular routing takes precedence over static file service.