CODEWITHSUNDEEP
jqueryajaxapirestcross-domain
SPBeginer
SPBeginer

Reputation: 755

How to access Rest API data hosted at other domain. Cross domain issue

I can successfully access data from my local Rest api through JQuery, But when i tried to access data from remote Rest API (hosted at other domain) through JQuery, i got the error as Undefined. How i solve cross domain problem ?

This is how i am using through JQuery.

function GetCompanyName(id) {
    jQuery.support.cors = true;
    $.ajax({
        url: 'http://novacompanysvc.azurewebsites.net/api/companies',
        type: 'GET',
        data:{ id:id },
        dataType: "text/xml",
    success: function (data) {
       if (window.DOMParser)
          {
          parser=new DOMParser();
          xmlDoc=parser.parseFromString(data,"text/xml");
          }
        else // Internet Explorer
          {
          xmlDoc=new ActiveXObject("Microsoft.XMLDOM");
          xmlDoc.async=false;
          xmlDoc.loadXML(data); 
          }
       WriteResponse(data);
     },
     error: function (x, y, z) {
            alert('error');
     }
  });
}

Upvotes: 2

Views: 8568

Answers (3)

hazan kazim
hazan kazim

Reputation: 958

i have face this problem also. i fix this by

avoid mixed content blocking is to serve all the content as HTTPS instead of HTTP.

For your own domain serve all content as HTTPS and fix your links.
you put by: http// to https//

For other domains use the site's HTTPS version if available. If HTTPS is not available, you can try contacting the domain and asking them if they can make the content available via HTTPS.

Upvotes: -1

Aman
Aman

Reputation: 21

I was also facing the same problem.

Now It is resolved by me. Suppose you have two domain. domain1 and domain2

you can use this technique.

Create a middle layer by using server side script in domain1, you can get the data from domain2 using java,PHP etc and then create a rest services in domain1 and use rest service in domain1.

Upvotes: 0

sdqali
sdqali

Reputation: 2234

This error happens because the API end point you are accessing does not implement CORS. If you run your code in Chrome and look at the console, you will see an error:

XMLHttpRequest cannot load http://novacompanysvc.azurewebsites.net/api/companies?id=1. Origin http://fiddle.jshell.net is not allowed by Access-Control-Allow-Origin.

The solution is to change the API end point to set the Access-Control-Allow-Origin header to either the wildcard * or to the domain where the page using the JavaScript code will be served from.

Upvotes: 2

Related Questions