AidenJH
AidenJH

Reputation: 21

jQuery ajax, get html cross domain

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

Answers (2)

Fenton
Fenton

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

Naftali
Naftali

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

Related Questions