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

Question

I'm using JQuery:

$('#myDiv').load('myApp/url',function(){ });

and it's giving No 'Access-Control-Allow-Origin' header is present on the requested resource By chrome, and firefox so far , any straight forward answer on how to fix this . I don't have control over server to make any configurations and I'm using PHP

Answer 1

This is a CORS issue (Cross Origin Resource Sharing), you are trying to request content via ajax from two different domains. Unless the domain from where you want to grab the data has properly set the CORS headers, browsers will cancel the request right away.

This occurs due to the communication between two different domains. The domain that will server your data, should have some headers set, this headers act as permissions, they tell which domains are allowed to ask for data from it, and which verbs/methods are allowed.

You can read more about this here and here

Answer 2

The easy way is to do this by hand:

var script = document.createElement('script');
script.src = uri;
script.id = 'scriptid';
document.head.appendChild(script);

It may be some browser compatibility issues, but you get the power of CORS with no 'Access-Control-Allow-Origin' error

Answer 3

No, there won't be a straight forward answer to this because it will depend entirely on your system/server setup, and what you have access to. Here's what you need to know.

In the beginning -- AJAX requests had a very strict "same origin" policy. This meant if you made an ajax request FROM a website with the domain example.com, you could only make a request to a URL that was on example.com.

In more recent years browsers have loosened up on this. If the server that you're making a request to has an Access-Control-Allow-Origin header, and that header includes the URL/domain of the server you're making the request from, then the request will be allowed. Similar question/answer here.

So, how you set this header depends on the server you're making a request to. If you have control over this server, start your Googling there.

If you don't have control over this server, you need to make a request to php page on your server, and this PHP page should make a curl request to the server that had the information you don't. A curl request, happening outside the browser, isn't subject to the same cross domain issues.