AnsweredAssumed Answered

Why does esriRequest cause error 'No 'Access-Control-Allow-Origin' header is present on the requested resource?'

Question asked by jbridwell_Dewberry on Jul 28, 2019
Latest reply on Nov 13, 2019 by amarsden

I have an API that uses Basic Authentication (Username, Password). I am trying to use this in an esriRequest to pull back the JSON data object from the GET request. To test this (and potentially avoid CORS issues), I am running this on my localhost (IIS). I have already set my IIS Default WebSite HTTP Response Headers to Access-Control-Allow-Origin: '*'. However, I am still getting the following error in my esriRequest :

Access to XMLHttpRequest at 'https://ria.azurewebsites.net/api/ria/event?Username=myUsername&Password=myPassword' from origin 'http://localhost' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.

This error gets thrown in both Chrome and Firefox.I even tried adding withCredentials: true to my request, but it then throws an additional error:

Cross-Origin Read Blocking (CORB) blocked cross-origin response with MIME type application/json.

At the top of my code, I have also added: esriConfig.defaults.io.corsEnabledServers.push("ria.azurewebsites.net");, which has resolved this CORS issue for other APIs in my application, but not this one. I have tried several configurations, but my current code uses a precallback function and .setRequestPreCallback() method. As you can see in the commented out attributes, I've also tried to pass 'Username' and 'Password' as content too. I have tested the general GET Request in Swagger UI and it comes back just fine. Is there something I am missing here; something else I need to do in order for this to work?:

function floodCallbackFunction(ioArgs){    
   
if (ioArgs.url.indexOf("https://ria.azurewebsites.net") > -1) {       
      ioArgs
.headers.Username = "myUsername";       
      ioArgs
.headers.Password = "myPassword"; // add custom headers       
   
}       
   
return ioArgs;   
}
....
esriRequest.setRequestPreCallback(floodCallbackFunction);
var evnts;
var eventRequest = esriRequest({   
   withCredentials
: true,
   url: "https://ria.azurewebsites.net/api/ria/event",   
   content
: {
        // "Username": "myUsername",
        // "Password": "myPassword"           
   
},   
   dataType
:"jsonp",   
   handleAs
: "json"});
   
eventRequest.then(function(resp) {   
      evnts
= resp;   
      console
.log(evnts);   
      console
.log("Success: ", evnts);
   
}, function(error) {   
      console
.log("Error: ", error.message);
});

Outcomes