Reputation: 21
I have a webpage where I am trying to use an ajax call to place some html content from another webpage inside. However I am struggling with the cross domain issues.
$('.trigger').click(function(e) {
e.preventDefault();
$.ajax({
url: 'http://myothersite.com',
datatype: 'text/html',
type: 'GET',
success: function(data) {
var content = data.responseText;
console.log(content);
}
});
});
Would anyone be able to advise how I would go about achieving this?
Thanks,
Upvotes: 1
Views: 5730
Reputation: 251292
If you can adjust the headers appropriately, you can perform cross-origin requests.
In order for it to work you need to change the client and the server:
Client:
xhr.setRequestHeader("X-Requested-With", "XMLHttpRequest"];
Client using jQuery
jQuery.support.cors = true;
The server needs to be changed to in order to respond to the OPTIONS
request appropriately. I have written an example for ASP.NET Web API, but the concepts are the same no matter what you are running on the server.
If you cannot make the changes to the server (for example it is a third party service) you can still use old-school JSONP.
Upvotes: 2
Reputation: 146360
You cannot do a cross domain get of text/html
in any modern browser.
The only return type that I know of that works currently is jsonp
Or you can do some cross-origin resource sharing.
Upvotes: 5