firebase hosting blocking script due to CORS issue

Vik picture Vik · Sep 11, 2018 · Viewed 15.2k times · Source

I am using firebase hosting to host few scripts and trying to access them from another site. it naturally gets blocked due to CORS issues. based on my research on other forum threads etc i modified the firebase.json as below

{
  "hosting": {
    "public": "public",
    "ignore": [
      "firebase.json",
      "**/.*",
      "**/node_modules/**"
    ],
    "headers": [ {
    "source" : "**",
    "headers" : [ {
      "key" : "Access-Control-Allow-Origin",
      "value" : "*"
    } ]
  }]
}
}

which essentially allow any url to access the resources hosted here. however, on trying to run my site i still see below

        Access to XMLHttpRequest at 'https://oracle-bot-sdk.firebaseapp.com//loader.json' 
    from origin 'https://insurance-bot.moblize.it' has been blocked by CORS policy: 
No 'Access-Control-Allow-Origin' header is present on the requested resource.

what else is needed?

Answer

Jared picture Jared · Sep 15, 2018

Is the site (https://insurance-bot.moblize.it/) that is calling to https://oracle-bot-sdk.firebaseapp.com a Firebase hosted app?

I only ask because with version 4.2+ of Firebase Tools allows you to setup Multisite hosting using the same Firebase Project. I am not sure if that would help your situation out at all. Just wanted to mention it.

In the error message:

insurance-bot.moblize.it/:1 Failed to load https://oracle-bot-sdk.firebaseapp.com//loader.json: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'https://insurance-bot.moblize.it' is therefore not allowed access.

I noticed an extra '/' in https://oracle-bot-sdk.firebaseapp.com//loader.json. I doubt that is the issue, but wanted to mention it.

There is something that you could try. Similar to the answers above but a little different:

"headers": [
    {
        "source": "*",
        "headers": [
            {
                "key": "Access-Control-Allow-Origin",
                "value": "*"
            }
        ]
    }
]

Also I would read some of the info here: https://developer.mozilla.org/en-US/docs/Web/HTTP/CORS#Access-Control-Allow-Origin If you have not already.

I hope I was able to help in some way. Let me know.