Angular en IE - Habilitar custom headers y cors en WebApi (SEC7123)

Proyecto de ejemplo que tiene este cambio: Creditos


A partir de Angular 8 no es necesario modificar el archivo polyfills.


1. Agregar en WebApiConfig.cs

            var cors = new EnableCorsAttribute("*", "*", "*");
            config.EnableCors(cors);

2. Agregar en web.config (dentro de 

  <system.webServer>
    <httpProtocol>
      <customHeaders>
        <!-- <add name="Access-Control-Allow-Origin" value="*" />  -->
        <add name="Access-Control-Allow-Headers" value="Content-Type" />
        <add name="Access-Control-Allow-Methods" value="GET, POST, PUT, DELETE, OPTIONS" />
      </customHeaders>
    </httpProtocol>
 
  </system.webServer>

Solucionar problema CORS en servicios asmx

Agregar en web.config lo siguiente:

<configuration>
       ....
       ....
       ....

<system.webServer>
<httpProtocol>
<customHeaders>
<add name="Access-Control-Allow-Origin" value="http://servidor-origen-habilitado"/>
<add name="Access-Control-Allow-Methods" value="GET,PUT,POST,DELETE,OPTIONS"/>
<add name="Access-Control-Allow-Headers" value="Content-Type"/>
</customHeaders>
</httpProtocol>
</system.webServer>

</configuration>

Ej, si se quiere admitir que desde http://Xdesa:8080 se pueda llegar al servicio 'http://Xdesa/wsX/Seguridad.asmx/ExisteRolUsuario, poner lo siguiente:

<add name="Access-Control-Allow-Origin" value="http://Xdesa:8080"/>



(el error que da si no se agregan estas lineas es:
Access to XMLHttpRequest at ... from origin ... has been blocked by CORS policy: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource)

Habilitar CORS en WebApi C# en forma global

En los packages NuGet del sitio WebApi, agregar el package CORS (Microsoft.AspNet.WebApi.Cors)

Luego, en App_Start / WebApiConfig.cs, agregar lo siguiente:

using System.Web.Http.Cors;



var cors = new EnableCorsAttribute("*", "*", "*");
config.EnableCors(cors);

CORS en llamados Ajax (Cross Origin Resource Sharing) en jQuery

Cuando se realiza un llamado Ajax desde una página html (o .vm, o .aspx, etc), en realidad se está realizando una llamada CORS (Cross Origin Resource Sharing).

Esto es porque la invocación se realiza desde el equipo del usuario hacia un servidor (por ejemplo Xdesa).

Por defecto, y por cuestiones de seguridad, los llamados CORS no están habilitados, y si se realizan se genera una excepción con el texto "No Transport".

Para habilitar ejecuciones CORS, a partir de la versión 1.4.1 de jQuery es necesario realizar esta configuración:

    jQuery.support.cors = true;

La versión previa a 1.4.1 (inclusive), no requiere este setting.