Search code examples
firebasefirebase-hosting

Redirect to page when a URL path pattern is identified


I'd like any traffic that comes to:

mysite.com/suppliers/add-supplier

To be directed to add-supplier.html when the path is identified in my firebase.json config file. I've tried this:

{
  "firestore": {
    "rules": "firestore.rules",
    "indexes": "firestore.indexes.json"
  },
  "hosting": {
    "public": "public",
    "ignore": [
      "firebase.json",
      "**/.*",
      "**/node_modules/**"
    ],
    "rewrites": [
      {
        "source": "**",
        "destination": "/index.html"
      }
    ],
    "redirects": [
      {
        "source": "/suppliers/add-supplier",
        "destination": "/add-supplier.html"
      }
    ],
    "cleanUrls": true
  },
  "storage": {
    "rules": "storage.rules"
  }
}

Even though this identifies and redirects correctly, it gets rid of the suppliers/add-supplier path and makes it mysite.com/add-supplier

Is there a way to retain the original URL while also redirecting to the correct HTML page?


Solution

  • You have two options:

    1. Use a rewrite instead of a redirect:
    "rewrites": [
      {
        "source": "/suppliers/add-supplier",
        "destination": "/add-supplier.html"
      },
      {
        "source": "**",
        "destination": "/index.html"
      }
    ]
    
    1. Remove the redirect entirely, and place your file at suppliers/add-supplier.html instead of in the root