Firebase: Pass url Param in URL Rewrite

Viewed 5871

For the code examples in the firebase docs, it says to initiate a url rewrite like so:

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

What do I do when I want to pass a parameter to the index page? I tried:

        "hosting": {
          // Add the "rewrites" section within "hosting"
          "rewrites": [ {
            "source": "/item/**",
            "destination": "/item.html?i=$1"
          } ]
        }

But that doesn't do anything..

I have also tried the answer below:

 "hosting": {
  // Add the "rewrites" section within "hosting"
  "rewrites": [ {
    "source": "/item/:item",
    "destination": "/item.html?i=:item"
  } ]
}

but that just returns a 404 page.

5 Answers

I know this is an old question but I had a similar issue and didn't find an answer so thought I'd share how I solved it.

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

I solved my issue by rewriting the dynamic URL to the static html page. Since it's a rewrite the URL will stay as the source URL pattern and not change to the destination URL like a redirect would.

We can then read the source URL through window.location.pathname with Javascript on the item.html page. You can then use .split('/') to return an Array to choose the part that you need.

Hope this helps to anybody looking for a similar solution.

I ran into this same issue as well. Although this isn't possible with rewrites, I found it is possible with redirects:

"redirects": [
  {"source": "/user/friendly/url.html",
   "destination": "/userunfriendly.html?myid=42",
   "type": 301
  },
Related