how to call cross-domain web api using ajax?
Solution 1
Javascript is subject to the same domain policy. This means for security a JS Script in a client browser can only access the same domain as it came from.
JSONP is not subject to the same restrictions.
Check the jQuery docs on JSONP here:
http://api.jquery.com/jQuery.getJSON/
Here is a working example of using JSONP to access a cross-domain service via JQuery AJAX:
And just in case JSBIN deletes this paste in the future:
jQuery.ajax({
type: "GET",
url: 'http://api.geonames.org/postalCodeLookupJSON?postalcode=6600&country=AT&username=demo',
dataType: "jsonp",
cache: false,
crossDomain: true,
processData: true,
success: function (data) {
alert(JSON.stringify(data));
},
error: function (XMLHttpRequest, textStatus, errorThrown) {
alert("error");
}
});
Solution 2
It's impossible to use Ajax
to get cross-domain data directly without changing backend. It's called Same origin policy.
You can set the special header Access-Control-Allow-Origin
in backend(how do to this). Or you can use JSONP.
tiru
Updated on July 06, 2020Comments
-
tiru almost 4 years
jQuery.ajax({ type: "GET", url: 'http://example.com/restaurant/VeryLogin(username,password)', dataType: "json", success: function (data) { alert(data); }, error: function (XMLHttpRequest, textStatus, errorThrown) { alert("error"); } });
it alerts success, but data was null. The url returns xml data, if we specify the dataType we can get the json data,but here it was not getting any data.
Any help appreciated.
-
tiru about 12 yearsi have already followed the link,but it didn't produced the result.
-
pmckeown about 12 yearsFrom the link posted previously: " Due to browser security restrictions, most "Ajax" requests are subject to the same origin policy; the request can not successfully retrieve data from a different domain, subdomain, or protocol. Script and JSONP requests are not subject to the same origin policy restrictions."
-
pmckeown about 12 yearsI would advise looking at how to achieve what you need using the JSONP example at the above link.
-
tiru about 12 yearsi tried jsonp also but no result. If i replace an url that produces the json data directly without specifying the content means adding url+&json,i'm getting the response.But not getting any for the xml response.
-
tiru about 12 yearsi followed your changes nut no result yet.
-
pmckeown about 12 yearsIf you request jsonp, you won't get any xml in the response, you'll get JSON. xhr.responseText should contain the returned JSON.
-
Francis P about 12 yearsYou must read about jsonp. Yet, the page you are calling is not returning jsonp data.