Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

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

I'm trying to fetch the feed of a news website. Thought I'd use google's feed API to convert the feedburner feed into json. The following url will return 10 posts from the feed, in json format. http://ajax.googleapis.com/ajax/services/feed/load?v=1.0&num=10&q=http://feeds.feedburner.com/mathrubhumi

I used the following code to get the contents of above url

$.ajax({   type: "GET",   dataType: "jsonp",   url: "http://ajax.googleapis.com/ajax/services/feed/load",   data: {     "v": "1.0",     "num": "10",     "q": "http://feeds.feedburner.com/mathrubhumi"   },   success: function(result) {     //.....   } }); 

but it's not working and I'm getting the following error

XMLHttpRequest cannot load http://ajax.googleapis.com/ajax/services/feed/load?v=1.0&num=10&q=http%3A%2F%2Ffeeds.feedburner.com%2Fmathrubhumi. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost' is therefore not allowed access.

How do I fix this?

like image 879
Aneeez Avatar asked Feb 16 '15 17:02

Aneeez


People also ask

How do you fix CORS header Access-Control allow Origin missing?

To allow any site to make CORS requests without using the * wildcard (for example, to enable credentials), your server must read the value of the request's Origin header and use that value to set Access-Control-Allow-Origin , and must also set a Vary: Origin header to indicate that some headers are being set ...

How do I get rid of CORS error?

Short description. Cross-Origin Resource Sharing (CORS) errors occur when a server doesn't return the HTTP headers required by the CORS standard. To resolve a CORS error from an API Gateway REST API or HTTP API, you must reconfigure the API to meet the CORS standard.


2 Answers

If you use Google Chrome browser you can hack with an extension.

You can find a Chrome extension that will modify CORS headers on the fly in your application. Obviously, this is Chrome only, but I like that it works with zero changes anywhere at all.

You can use it for debugging your app on a local machine (if everything works in production).

Notice: If URL becomes broken the extension name is Access-Control-Allow-Origin: *. I recommend you to disable this extension when you not working on your stuff, because, for example, youtube does not work with this extension.

like image 53
dkruchok Avatar answered Sep 23 '22 10:09

dkruchok


I believe this might likely be that Chrome does not support localhost to go through the Access-Control-Allow-Origin -- see Chrome issue

To have Chrome send Access-Control-Allow-Origin in the header, just alias your localhost in your /etc/hosts file to some other domain, like:

127.0.0.1   localhost yourdomain.com 

Then if you'd access your script using yourdomain.com instead of localhost, the call should succeed.

like image 42
thanix Avatar answered Sep 20 '22 10:09

thanix