5

In my Angular 2 project the client calls a Web API method, which requires that the user is authorized using the Windows Authentication. This call works fine in Internet Explorer 11, Firefox and Chrome but not in the Microsoft Edge, which doesn't shows the Login dialog, shows "Response with status: 401 Unauthorized for URL" in the console. If I try to open the API Url directly in Edge, it shows the dialog properly, so if I understand it correct, the problem is in Angular 2 call.

Have someome experienced the same problem with Microsoft Edge browser? Is some special header or Web API configuration required to solve the problem?

Angular 2 service:

let headers = new Headers();
let options = new RequestOptions({ headers: headers, withCredentials: true });

return this._http.get(this._productUrl, options)
  .map((response: Response) => <IProduct[]> response.json())
  .do(data => console.log('All: ' +  JSON.stringify(data)))
  .catch(this.handleError);

Web.Config in the WebApi 2 project:

<system.web>
    <authentication mode="Windows" />
    <authorization>
        <deny users="?" />
    </authorization>
 </system.web>

WebApiConfig:

var cors = new EnableCorsAttribute("http://localhost:3000", "*", "*") {SupportsCredentials = true};
config.EnableCors(cors);

Global.asax:

protected void Application_BeginRequest()
{
    if (Request.Headers.AllKeys.Contains("Origin") && Request.HttpMethod == "OPTIONS")
    {
        Response.Headers.Add("Access-Control-Allow-Origin", "http://localhost:3000");
        Response.Headers.Add("Access-Control-Allow-Headers", "Origin, Content-Type, X-Auth-Token");
        Response.Headers.Add("Access-Control-Allow-Methods", "GET, POST, PATCH, PUT, DELETE, OPTIONS");
        Response.Headers.Add("Access-Control-Allow-Credentials", "true");
        Response.Headers.Add("Access-Control-Max-Age", "1728000");
        Response.End();
    }
}
Alexander Zwitbaum
  • 4,776
  • 4
  • 48
  • 55
  • Experiencing the same issue, but have found any resolution. Did you work around the problem? – Hampus Nilsson Jul 12 '17 at 11:56
  • Access-Control headers are often cached by the client.HttpMethod "OPTIONS" is used by the client to get these headers if the client intend to do a call that will modify data on the endpoint. I.E. everything but a "GET". GET requests are most common, and if you have called GET to an endpoint before calling POST, the client may reuse the same Access-Control headers without doing an OPTIONS request. – jornare Jul 12 '17 at 12:08

1 Answers1

4

I know the question is old, but it was never answered, so here is the answer.

It's a "By design" fault from Microsoft Edge.

It won't work on localhost or machinename.

See here for the Issue

https://developer.microsoft.com/en-us/microsoft-edge/platform/issues/4776775/

Paw Ormstrup Madsen
  • 683
  • 8
  • 12