How to get external data without CORS headers with Firebase hosted webapp?

问题

I have my Ionic2 app hosted on Firebase. What I need is to get external data from an API service where

No 'Access-Control-Allow-Origin' header is present on the requested resource

I can work around it locally by using proxies in ionic.config.json file:

"proxies": [
{
"path":"/api",
"proxyUrl": "https://api.somwhere.com/"
}
]

But I have no idea how to deal with this after deploying my app to Firebase. Is it somehow possible?

回答1:

The Firebase docs have an example of setting the Access-Control-Allow-Origin in your firebase.json to allow cross-origin requests for font files. You could adjust that like this:

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

That will allow cross-origin requests for all resources. Of course if you want to restrict it to specific resources, you can adjust the source value.

回答2:

This is probably not a firebase related issue. Your api needs to send CORS in header. Either accept all(*) or your specific firebase hosted app. Easy fix for API written in .net See link https://docs.microsoft.com/en-us/aspnet/web-api/overview/security/enabling-cross-origin-requests-in-web-api