angularjs - origin - enable cors web config

Falta el token ''access-control-allow-headers'' en el encabezado CORS ''Access-Control-Allow-Headers'' del canal de verificación previa CORS

Question

Tengo dos proyectos VS: uno que expone los controladores MVC5 y el otro es un cliente angular. Quiero que el cliente angular pueda consultar los controladores. Leí numerosos hilos y probé lo siguiente:

• Agregué esto en la configuración web del servidor:

  <system.webServer>
      <httpProtocol>
         <customHeaders>
              <clear />
              <add name="Access-Control-Allow-Origin" value="*" />
          </customHeaders>
      </httpProtocol>
  <system.webServer>

• Creé y usé el siguiente filtro en la acción del controlador:

  public class AllowCrossSiteJsonAttribute : ActionFilterAttribute
  {
      public override void OnActionExecuting(ActionExecutingContext filterContext)
      {
          filterContext.RequestContext.HttpContext.Response.AddHeader("Access-Control-Allow-Origin", "*");
          base.OnActionExecuting(filterContext);
      }
  }

• En el cliente angular, creé el siguiente interceptor:

  app.factory("CORSInterceptor", [
      function()
      {
          return {
              request: function(config)
              {
                   config.headers["Access-Control-Allow-Origin"] = "*";
                   config.headers["Access-Control-Allow-Methods"] = "GET, POST, OPTIONS";
                   config.headers["Access-Control-Allow-Headers"] = "Content-Type";
                   config.headers["Access-Control-Request-Headers"] = "X-Requested-With, accept, content-type";
                   return config;
              }
       };
  }
  ]);
  
  app.config(["$httpProvider", function ($httpProvider) {
      $httpProvider.interceptors.push("CORSInterceptor");
  }]);

Según Firebug, esto se traduce en la siguiente solicitud:

OPTIONS //Login/Connect HTTP/1.1
Host: localhost:49815
User-Agent: Mozilla/5.0 (Windows NT 6.1; WOW64; rv:40.0) Gecko/20100101 Firefox/40.0
Accept: text/html,application/xhtml+xml,application/xml;q=0.9,*/*;q=0.8
Accept-Language: en-US,en;q=0.5
Accept-Encoding: gzip, deflate
Origin: http://localhost:50739
Access-Control-Request-Method: POST
Access-Control-Request-Headers: access-control-allow-headers,access-control-allow-origin,content-type
Connection: keep-alive
Pragma: no-cache
Cache-Control: no-cache

Y la siguiente respuesta:

HTTP/1.1 200 OK
Allow: OPTIONS, TRACE, GET, HEAD, POST
Server: Microsoft-IIS/10.0
Public: OPTIONS, TRACE, GET, HEAD, POST
X-SourceFiles: =?UTF-8?B?RDpcVEZTXElVV2ViXEdhcE5ldFNlcnZlclxBU1BTZXJ2aWNlc1xMb2dpblxDb25uZWN0?=
Access-Control-Allow-Origin: *
Access-Control-Allow-Methods: GET, POST, OPTIONS
Access-Control-Allow-Headers: *
Access-Control-Request-Headers: X-Requested-With, accept, content-type
Date: Tue, 01 Sep 2015 13:05:23 GMT
Content-Length: 0

Y aún así, Firefox bloquea la solicitud con el siguiente mensaje:

Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at http://localhost:49815//Login/Connect. (Reason: missing token ''access-control-allow-headers'' in CORS header ''Access-Control-Allow-Headers'' from CORS preflight channel).

Answer 1

A menudo, los hilos que leí sugerían varios pasos de configuración innecesarios, lo que creaba confusión. En realidad es muy simple ...

Con el simple propósito de enviar una solicitud entre sitios, desde un cliente angular, a un controlador ASP:

• No se requieren interceptores angulares.
• No se requieren filtros personalizados en el lado del servidor.

• La única modificación obligatoria es agregar esto en web.config del servidor

  <system.webServer>
        <httpProtocol>
            <customHeaders>
                <clear />
                <add name="Access-Control-Allow-Origin" value="*" />
                <add name="Access-Control-Allow-Headers" value="Content-Type"/>
            </customHeaders>
       </httpProtocol>
  </system.webServer>

Answer 2

El problema es que el Access-Control-Allow-Headers no permite comodines. (El único encabezado Access-Control-Allow-Origin que permite el comodín es el Access-Control-Allow-Origin ).

Por lo tanto, el valor debe enumerar explícitamente los nombres de los encabezados que desea permitir. Reemplace el * con algunos nombres de encabezado reales y luego creo que encontrará que funciona.