2015-09-01 8 views
14

Ich arbeite an einer Webanwendung (Angular + Rails), die Assets über CloudFront CDN verwaltet. Die Anwendung wird über nginx bereitgestellt, das korrekt eingerichtet ist, um den "Access-Control-Allow-Origin" -Header festzulegen. CloudFront ist so eingerichtet, dass der Header weitergeleitet wird.Access-Control-Allow-Origin fehlt bei der ersten Antwort

Problem ist, dass der Header in der ersten Antwort für eine Angular-Vorlage fehlt, aber es ist korrekt bei nachfolgenden Antworten vorhanden (wenn ich die Seite aktualisieren).

Wenn ich beispielsweise den gesamten Verlauf und Cache in Chrome lösche und die Seite besuche, hat die Antwort für eine Vorlagendatei keinen Header "Access-Control-Allow-Origin". Wenn ich die Seite aktualisiere, hat die Antwort für die Vorlage die Überschrift.

Ich bemerkte, dass, wenn ich den gesamten Verlauf und Cache, aber nicht Cookies löscht, es weiterhin ordnungsgemäß funktioniert.

Es verhält sich ähnlich bei Firefox. Wenn ich den gesamten Verlauf löschen und zwischenspeichern, funktioniert er nicht bei der ersten Antwort, aber bei nachfolgenden Antworten funktioniert er korrekt. Nach dem Löschen des gesamten Verlaufs und Cache, aber ohne Cookies, funktioniert es anders als in Chrome weiterhin korrekt.

Auch, wenn ich Entwicklungstools öffnen und Cache in Firefox deaktivieren, fehlt die Kopfzeile bei jeder Antwort.

Wissen Sie, was das Problem sein könnte oder wo sollte ich als nächstes aussehen?

Danke.

+0

versuche JSONP für cors Anfragen –

+2

Die erste domainübergreifende Anfrage ist OPTIONS, die Serverheader sollten zurückgeben Access-Control-Allow-Methoden: POST, GET, ** OPTIONS ** –

+0

Mit welchem ​​Problem hast du genau zu tun? Für jede Anfrage wird zuerst eine OPTIONS-Anfrage gemacht, wenn diese erfolgreich ist, wird die eigentliche Anfrage gemacht. Haben Sie ein Problem dort oder in einer anderen Anfrage? Beeinflusst es Ihre Anwendung? –

Antwort

6

"Access-Control-Allow-Origin" ist ein Antwortheader, kein Anforderungsheader. Es wird von einem HTTP-Server zurückgegeben, wenn ein HTTP-Client eine Anforderung mit einer OPTION-Methode sendet. Zum Beispiel sendet die Ajax-API in Browsern eine OPTION-Anfrage, bevor sie eine POST-Anfrage durchführt, wenn die Ziel-URL nicht die aktuelle Seiten-URL ist (siehe Cross-Origin-Ressourcenfreigabe-Problem). Diese OPTION-Anforderung enthält den Header "Origin", der den aktuellen Seitenanfang der URL (Schema + Domäne) enthält. Die Ajax-API sendet die POST-Anforderung nur dann, wenn die Antwort den Header "Access-Control-Allow-Origin" mit einer URL enthält, die mit der Hauptseite übereinstimmt.

Sie müssen sich nur um solche Kopfzeilen kümmern, wenn Sie auf dynamischen Inhalt von einem anderen Server als dem der aktuellen Seite zugreifen möchten. Es scheint hier nicht der Fall zu sein.

Weitere Informationen über CORS, diese Wikipedia-Seite sehen: https://en.wikipedia.org/wiki/Cross-origin_resource_sharing

+0

Am Ende habe ich dieses Problem gelöst, indem ich Inline-Templates mit Angular verwendet habe, da ich gesehen habe, dass die Mehrheit der Entwickler dies bevorzugt. Diese Antwort war jedoch am hilfreichsten, um mehr über CORS zu erfahren. – Strika

0

Wenn es auch ist AngularJS Tag, lassen Sie mich vorschlagen, dass Sie nicht HTML-Templates zu laden, aber sie alle in eine JS-Datei (zum Beispiel mit html2js kompilieren grunt plugin)

Verwandte Themen