Token manquant 'access-control-allow-headers' dans L'en-tête 'Access-Control-Allow-Headers' de CORS preflight channel

j'ai deux projets VS : l'un exposant les contrôleurs MVC5, l'autre étant un client angulaire. Je veux que le client angulaire puisse interroger les contrôleurs. J'ai lu un grand nombre de threads et j'ai essayé le code suivant :

  • j'ai ajouté ceci dans la configuration web du serveur:

    <system.webServer>
        <httpProtocol>
           <customHeaders>
                <clear />
                <add name="Access-Control-Allow-Origin" value="*" />
            </customHeaders>
        </httpProtocol>
    <system.webServer>
    
  • j'ai créé et utilisé le filtre suivant sur l'action de contrôleur:

    public class AllowCrossSiteJsonAttribute : ActionFilterAttribute
    {
        public override void OnActionExecuting(ActionExecutingContext filterContext)
        {
            filterContext.RequestContext.HttpContext.Response.AddHeader("Access-Control-Allow-Origin", "*");
            base.OnActionExecuting(filterContext);
        }
    }
    
  • dans le client angulaire, j'ai créé le suivant intercepteur :

    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");
    }]);
    

selon Firebug, il en résulte la requête suivante:

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

Et la réponse suivante :

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

et pourtant, Firefox bloque la requête avec le message suivant:

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).
16
demandé sur sideshowbarker 2015-09-01 16:25:52

2 réponses

souvent, les threads que j'ai lus suggéraient plusieurs étapes de configuration inutiles, ce qui a créé de la confusion. C'est en fait très simple...

pour le simple but d'envoyer une requête cross site, d'un client angulaire, à un contrôleur ASP :

  • aucun intercepteur angulaire n'est requis.
  • aucun filtre personnalisé du côté du serveur n'est requis.
  • La seule modification obligatoire est à ajouter au serveur Web.config

    <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>
    
25
répondu Yugo Amaryl 2015-11-01 01:13:51

le problème est que Le Access-Control-Allow-Headers l'en-tête n'autorise pas les caractères génériques. (La seule Access-Control- en-tête qui ne permet pas de joker, c'est Access-Control-Allow-Origin.)

donc la valeur doit à la place énumérer explicitement les noms des en-têtes que vous voulez autoriser. Remplacer le * avec quelques noms d'en-tête et puis je pense que vous verrez que cela fonctionne.

8
répondu sideshowbarker 2015-09-02 07:06:33