All geek questions in one place

IE9, IE8 with AngularJS CORS returns "Access Denied" - ASP.NET WebApi

In IE8 and 9, I get the following JavaScript error when I make a CORS web client call:

Error: Access is denied. { [functions]: , description: "Access is denied.", message: "Access is denied.", name: "Error", number: -2147024891 }

I installed my WebApi as described here http://www.asp.net/web-api/overview/security/enabling-cross-origin-requests-in-web-api

Thus, WebApi contains:

  public static class WebApiConfig { public static void Register(HttpConfiguration config) { config.EnableCors(new EnableCorsAttribute("*", "*", "*")); [...]

My test AngularJS application:

  <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml" xmlns:ng="http://angularjs.org" ng-app="app"> <head> <title>test</title> <script src="Scripts/angular.js"></script> <script src="app.js"></script> </head> <body> <div ng-controller="testController as vm"> {{vm.test}} {{vm.data}} </div> </body> </html>

app.js:

  var app = angular.module('app'); app.controller('testController', function ($http) { var vm; vm = this; vm.test = "bla non no "; vm.data = null; $http.defaults.headers.common['Authorization'] = 'a token' return $http({ method: 'GET', data: null, url: 'http://webapi.com/api/controller/getactionmethod/', }, function (data) { console.log("bla"); }).success(function (data, status, headers, config) { console.log("bla a"); vm.data; }); });

The above code / webapi calls work with chrome and IE 10. IE10 fingerprints:

SEC7118: XMLHttpRequest for http://webapi.com/api/controller/getactionmethod/ requires Cross Resource Resource (CORS). SEC7119: XMLHttpRequest for http://webapi.com/api/controller/getactionmethod/ requires a preview of CORS.

I am really stuck and don't know what I can try. Any ideas?

+6
source share
2 answers

AngularJS v1.2.23 does not support CORS requests for IE8 or IE9. But IE8 / 9 supports CORS limited to the XDomainRequest object. See also http://msdn.microsoft.com/en-us/library/ie/cc288060(v=vs.85).aspx

I tried changing the angularjs lib as described here http://samuellam.wordpress.com/2013/08/03/ie-89-cors-support-in-angular-js/

But I noticed that I cannot send XDomainRequest requests to a custom header. So I ended up deploying the project on the same machine with the same ips that would work for IE8 and 9, which is actually just a workaround.

http://blogs.msdn.com/b/ieinternals/archive/2010/05/13/xdomainrequest-restrictions-limitations-and-workarounds.aspx

+2
source

I had the same issue with IE8 / 9 (Django backend instead of ASP.NET) when doing CORS requests.

There are several ways to solve this problem. The easiest and fastest solution for me was to use polyfill from jpillora . In doing so, the polyfill normal CORS XMLHttpRequests will be replaced by XDR on IE8 / 9.

Turn on XHook and add the following links to your site:

 xhook.before(function(request, callback) { //skip browsers that dont use XDR if(!window.XDomainRequest) return callback(); //skip requests that aren't cross domain var url = request.url; var loc = window.location; var hostname = loc.hostname + (loc.port ? ":"+loc.port : ""); if(!/^https?:\/\/([^\?\/]+)/.test(url) || RegExp.$1 === hostname) return callback(); //if not GET, force POST var method = request.method; if(method !== 'GET') method = 'POST'; //force same protocol url = url.replace(/^https?:/,loc.protocol); //request! var xdr = new window.XDomainRequest(); xdr.timeout = request.timeout; //proxy events var proxy = function(e) { xdr['on'+e] = function() { request.xhr.dispatchEvent(e); }; }; var events = ['progress','timeout','error']; for(var i = 0; i < events.length; ++i ) proxy(events[i]); //custom onload xdr.onload = function() { callback({ status: 200, statusText: "OK", headers: { 'Content-Type': xdr.contentType }, text: xdr.responseText }) }; xdr.open(method, url); xdr.send(request.body); return });

There are several other solutions:

+2
source

Source: https://habr.com/ru/post/976578/

More articles:


All Articles