Firebase hosting does not send custom HTTP headers

Question

According to Firebase Hosting docs, I should be able to set custom headers on responses received from the server. I am trying to set the X-Frame-Options header on all html files, but the server simply does not want to send this header! Here's my firebase.json file, please let me know if I am doing anything wrong:

{
  "hosting": {
    "public": "build",
    "ignore": [
      "firebase.json",
      "**/.*",
      "**/node_modules/**"
    ],
    "headers": [
      {
        "source": "**/*.html",
        "headers": [
          {
            "key": "X-Frame-Options",
            "value": "SAMEORIGIN"
          }
        ]
      }
    ]
  }
}

Answer 1

I just went through a lot of trial and error on the same issue. I noticed a small little section in the firebase documentation:

A source value that Hosting matches against the original request path, regardless of any rewrite rules.

If your setup is like mine, you probably have this in your firebase.json file:

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

However, while you may be returning index.html, the original request path was simply "/", so on your headers section use this:

"source": "/"

This is what worked for me.