how to call cross-domain web api using ajax?

问题

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.

回答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:

http://jsbin.com/idasay/4

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");
     }
 });

回答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.

回答3:

Look for jsonp datatype.

jQuery.ajax({
       type: "GET",
       url: 'http://xxx.com/restaurant/VeryLogin(username,password)',
       dataType: "jsonp",
   cache: false,
       crossDomain: true,
   processData: true,

       success: function (data) {
           alert(data);
       },
       error: function (XMLHttpRequest, textStatus, errorThrown) {
           alert("error");
       }
   });

回答4:

here is a fantastic article to make GET and POST cross-domain call : http://www.asp.net/web-api/overview/security/enabling-cross-origin-requests-in-web-api

It just helped me a lot....shoot comments for any query.

来源：https://stackoverflow.com/questions/9890034/how-to-call-cross-domain-web-api-using-ajax

标签

ASP.NET

ajax

wcf-web-api