L'en-tête 'Access-Control-Allow-Origin' contient plusieurs valeurs

J'utilise AngularJS $ http côté client pour accéder à un endpoint d'un ASP.NET application API Web du côté serveur. Comme le client est hébergé sur un domaine différent que le serveur, j'ai besoin de CORS. Il fonctionne pour $ http.post (url, data). Mais dès que j'authentifie l'utilisateur et que je fais une requête via $http.get(url), je reçois le message

The 'Access-Control-Allow-Origin' header contains multiple values 'http://127.0.0.1:9000, http://127.0.0.1:9000', but only one is allowed. Origin 'http://127.0.0.1:9000' is therefore not allowed access.

Fiddler me montre qu'il y a effectivement deux entrées d'en-tête dans la requête get après une requête d'options réussie. Qu'est-ce et où est-ce que je fais quelque chose de mal?

mise à Jour

quand j'utilise jQuery $.obtenir au lieu de $ http.obtenir, le même message d'erreur s'affiche. Ce n'est donc pas un problème avec les AngularJS. Mais où est-il mauvais?

80
demandé sur Papa Mufflon 2014-03-12 10:13:13

11 réponses

j'ai ajouté

config.EnableCors(new EnableCorsAttribute(Properties.Settings.Default.Cors, "", ""))

ainsi que

app.UseCors(CorsOptions.AllowAll);

sur le serveur. Il en résulte deux entrées d'en-tête. Il suffit d'utiliser le dernier et il fonctionne.

46
répondu Papa Mufflon 2014-03-12 07:34:07

nous avons rencontré ce problème parce que nous avions mis en place le CORS conformément aux meilleures pratiques (par exemple http://www.asp.net/web-api/overview/security/enabling-cross-origin-requests-in-web-api ) et avait également un en-tête personnalisé <add name="Access-Control-Allow-Origin" value="*"/> dans le web.config.

supprimer le web.entrée de configuration, et tout va bien.

contrairement à la réponse de @mww, nous avons toujours EnableCors() dans le WebApiConfig.cs et un EnableCorsAttribute sur le contrôleur. Lorsque nous avons pris l'un ou l'autre, nous avons rencontré d'autres problèmes.

38
répondu Brandon Kuczenski 2015-01-12 22:16:32

j'utilise Cors 5.1.0.0, après beaucoup de maux de tête, j'ai découvert le problème à dupliquer Access-Control-Allow-Origin & Access-Control-Allow-d'en-Tête en-têtes du serveur

Supprimé config.EnableCors() de la WebApiConfig.fichier cs et il suffit de définir l'attribut [EnableCors("*","*","*")] sur la classe de contrôleur

Vérifier cet article pour plus de détails.

33
répondu mww 2015-11-30 04:51:30

moi aussi J'ai eu à la fois OWIN et mon WebAPI qui avaient apparemment besoin que les CORS soient activés séparément, ce qui a créé l'erreur 'Access-Control-Allow-Origin' header contains multiple values .

j'ai fini par supprimer tout le code qui activait CORS et j'ai ensuite ajouté ce qui suit au noeud system.webServer de mon Web.Config:

<httpProtocol>
  <customHeaders>
    <add name="Access-Control-Allow-Origin" value="https://stethio.azurewebsites.net" />
    <add name="Access-Control-Allow-Methods" value="GET, POST, OPTIONS, PUT, DELETE" />
    <add name="Access-Control-Allow-Headers" value="Origin, X-Requested-With, Content-Type, Accept, Authorization" />
  </customHeaders>
</httpProtocol>

cela répondait aux exigences du CORS pour OWIN (permettant L'ouverture de session) et pour WebAPI( permettant les appels API), mais cela a créé un nouveau problème: un OPTIONS la méthode n'a pas pu être trouvée pendant le pré-vol pour mes appels API. Le correctif pour cela était simple--j'avais juste besoin de supprimer ce qui suit du noeud handlers de mon Web.Config:

<remove name="OPTIONSVerbHandler" />

J'espère que ça aidera quelqu'un.

7
répondu Matt Cashatt 2015-08-05 22:51:01

en fait, vous ne pouvez pas configurer plusieurs en-têtes Access-Control-Allow-Origin (ou au moins il ne fonctionnera pas dans tous les navigateurs). Au lieu de cela, vous pouvez conditionnellement définir une variable d'environnement et ensuite l'utiliser dans Header directive:

SetEnvIf Origin "^(https?://localhost|https://[a-z]+\.my\.base\.domain)$" ORIGIN_SUB_DOMAIN=
Header set Access-Control-Allow-Origin: "%{ORIGIN_SUB_DOMAIN}e" env=ORIGIN_SUB_DOMAIN

ainsi, dans cet exemple, l'en-tête de réponse ne sera ajouté que si un en-tête de requête Origin correspond à RegExp: ^(https?://localhost|https://[a-z]+\.my\.base\.domain)$ (cela signifie essentiellement localhost par HTTP ou HTTPS et *.mon Dieu.base.domaine sur HTTPS).

N'oubliez pas d'activer le module setenvif .

Docs:

BTW. Le }e dans %{ORIGIN_SUB_DOMAIN}e n'est pas une faute de frappe. C'est la façon dont vous utilisez la variable d'environnement dans la directive Header .

5
répondu Nux 2014-09-08 19:08:03

Serveur Apache:

je passe le même, mais c'est parce que je n'avais pas de guillemets (") l'astérisque dans mon fichier qui permettait l'accès au serveur, par exemple '.htaccess.

Header add Access-Control-Allow-Origin: * 
Header add Access-Control-Allow-Origin "*" 

, Vous pouvez aussi avoir un fichier '.htaccess' dans un dossier avec un autre".htaccess', par exemple

/ 
- .htaccess 
- public_html / .htaccess (problem here)

dans votre cas au lieu de l'astérisque " * " serait le serveur ip ( http://127.0.0.1:9000 ) que vous autorisez à servir des données.

ASP.NET:

Vérifiez qu'il n'y a pas de duplicata 'Access-Control-Allow-Origin' dans votre code.

Outils De Développement:

avec Chrome vous pouvez vérifier vos en-têtes de demande. Appuyez sur la touche F12 et allez à L'onglet "Réseau", maintenant lancez la requête AJAX et apparaîtra sur la liste, cliquez et donnez toutes les informations qui s'y trouvent.

Access-Control-Allow-Origin: *

4
répondu Chofoteddy 2014-03-22 00:41:32

cela se produit lorsque vous avez l'option Cors configurée à plusieurs endroits. Dans mon cas, je l'ai eu au niveau du contrôleur ainsi que dans le Démarrage.Auth.cs / ConfigureAuth.

ma compréhension est si vous voulez l'application large alors il suffit de le configurer au démarrage.Auth.cs / ConfigureAuth comme ceci...Vous aurez besoin de référence à Microsoft.Owin.Cors

public void ConfigureAuth(IAppBuilder app)
        {
          app.UseCors(CorsOptions.AllowAll);

Si vous préférez le garder au niveau du contrôleur, alors vous pouvez simplement insérer à la Contrôleur de niveau.

[EnableCors("http://localhost:24589", "*", "*")]
    public class ProductsController : ApiController
    {
        ProductRepository _prodRepo;
4
répondu Nizar 2015-08-09 15:17:19

si vous êtes dans IIS vous devez activer CORS dans web.config, alors vous n'avez pas besoin d'activer dans App_Start/WebApiConfig.cs méthode Register

ma solution a été, a commenté les lignes ici:

// Enable CORS
//EnableCorsAttribute cors = new EnableCorsAttribute("*", "*", "*");
//config.EnableCors(cors);

et écrivez sur le web.config:

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

2
répondu freedeveloper 2017-10-26 02:00:05

vient d'avoir ce problème avec un serveur nodejs.

, voici comment je l'ai corrigé.

j'exécute mon serveur de noeuds par le biais d'un nginx proxy et j'ai placé nginx et node à la fois allow cross domain requests et il n'a pas fait comme ça donc je l'ai retiré de nginx et l'ai laissé dans le noeud et tout était bien.

1
répondu James Harrington 2014-08-08 02:47:10

cela peut aussi se produire bien sûr si vous avez défini votre en - tête Access-Control-Allow-Origin pour avoir plusieurs valeurs-par exemple, une liste de valeurs séparée par une virgule, Qui est sorte de prise en charge dans le RFC mais n'est pas réellement prise en charge par la plupart des navigateurs principaux. Notez que le RFC parle de la façon d'Autoriser plus d'un domaine sans utiliser '*' aussi.

par exemple, vous pouvez obtenir cette erreur dans Chrome en-tête comme so:

Access-Control-Allow-Origin: http://test.mysite.com, http://test2.mysite.com

C'était dans Chrome Version 64.0.3282.186 (Official Build) (64-bit)

notez que si vous envisagez cela à cause d'un CDN, et que vous utilisez Akamai, vous pouvez vouloir noter que Akamai wont cache sur le serveur si vous utilisez Vary:Origin , la façon dont beaucoup suggèrent de résoudre ce problème.

vous devrez probablement changer la façon dont votre clé de cache est construite, en utilisant un comportement de réponse" Cache ID Modification". En savoir plus détails sur cette question dans la question connexe

1
répondu Brad Parks 2018-04-23 19:07:12

j'ai rencontré le même problème et c'est ce que j'ai fait pour le résoudre:

dans le service WebApi, à L'intérieur de Global.asax j'ai écrit le code suivant:

Sub Application_BeginRequest()
        Dim currentRequest = HttpContext.Current.Request
        Dim currentResponse = HttpContext.Current.Response

        Dim currentOriginValue As String = String.Empty
        Dim currentHostValue As String = String.Empty

        Dim currentRequestOrigin = currentRequest.Headers("Origin")
        Dim currentRequestHost = currentRequest.Headers("Host")

        Dim currentRequestHeaders = currentRequest.Headers("Access-Control-Request-Headers")
        Dim currentRequestMethod = currentRequest.Headers("Access-Control-Request-Method")

        If currentRequestOrigin IsNot Nothing Then
            currentOriginValue = currentRequestOrigin
        End If

        If currentRequest.Path.ToLower().IndexOf("token") > -1 Or Request.HttpMethod = "OPTIONS" Then
            currentResponse.Headers.Remove("Access-Control-Allow-Origin")
            currentResponse.AppendHeader("Access-Control-Allow-Origin", "*")
        End If

        For Each key In Request.Headers.AllKeys
            If key = "Origin" AndAlso Request.HttpMethod = "OPTIONS" Then
                currentResponse.AppendHeader("Access-Control-Allow-Credentials", "true")
                currentResponse.AppendHeader("Access-Control-Allow-Methods", currentRequestMethod)
                currentResponse.AppendHeader("Access-Control-Allow-Headers", If(currentRequestHeaders, "GET,POST,PUT,DELETE,OPTIONS"))
                currentResponse.StatusCode = 200
                currentResponse.End()
            End If
        Next

    End Sub

ici ce code ne permet que les requêtes pré-vol et token pour ajouter "Access-Control-Allow-Origin" dans la réponse sinon je ne l'ajoute pas.

Voici mon blog sur la mise en œuvre: https://ibhowmick.wordpress.com/2018/09/21/cross-domain-token-based-authentication-with-web-api2-and-jquery-angular-5-angular-6 /

0
répondu indranil bhowmick 2018-10-04 16:07:24