Access-Control-Allow-Origin requesting storage file

Question

I receive error

No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'https://MY-Firebase-APP.Firebaseapp.com' is therefore not allowed access.

when accessing a json file from my Firebase storage. Here is the rules for the storage-

service firebase.storage {
service firebase.storage {
  match /b/paystumped.appspot.com/o {
    match /{allPaths=**} {
      allow read, write: if true;
    }
  }
}

The app is hosted by Firebase as well. Here is the firebase.json I am using when I run 'firebase deploy'

{
  "hosting": {
    "public": "dist",
    "ignore": [
      "firebase.json",
      "**/.*",
      "**/node_modules/**"
    ],
    "headers": [
      {
        "source": "**/*",
        "headers": [
          {
            "key": "Access-Control-Allow-Origin",
            "value": "*"
          }
        ]
      },
      {
        "source": "**/*.@(jpg|jpeg|gif|png)",
        "headers": [
          {
            "key": "Cache-Control",
            "value": "max-age=7200"
          }
        ]
      },
      {
        "source": "404.html",
        "headers": [
          {
            "key": "Cache-Control",
            "value": "max-age=300"
          }
        ]
      }
    ],
    "cleanUrls": true,
    "trailingSlash": false

} }

I am sure there is some trivial CORS setup to do to make this work.

Answer 1

After reading up on CORS and understanding how this should work I found the desired answer here. https://stackoverflow.com/a/37765371/4360863

The firebase storage policy is configured by a utility provided by google.