Jak dodać nagłówek Access-Control-Allow-Origin

Projektuję stronę internetową (np. mywebsite.com) i ta strona ładuje czcionki font-face z innej strony (powiedzmy anothersite.com). miałem problemy z wczytywaniem czcionek w Firefoksie i przeczytałem na Ten blog :

Firefox (który obsługuje @ font-face od v3.5) nie pozwala na cross-domeny czcionki domyślnie. Oznacza to, że czcionka muszą być serwowane z tej samej domeny (i sub-domeny), chyba że można dodać "Access-Control-Allow-Origin" nagłówek do czcionki.

Jak ustawić nagłówek Access-Control-Allow-Origin na czcionce?

Author: sideshowbarker, 2011-02-15

6 answers

Więc to co robisz jest... W folderze Pliki Czcionek umieść plik htaccess z następującym tekstem.

<FilesMatch "\.(ttf|otf|eot|woff|woff2)$">
  <IfModule mod_headers.c>
    Header set Access-Control-Allow-Origin "*"
  </IfModule>
</FilesMatch>

Również w zdalnym pliku CSS, deklaracja font-face wymaga pełnego bezwzględnego adresu URL pliku czcionki (nie jest potrzebna w lokalnych plikach CSS):

Np.

@font-face {
    font-family: 'LeagueGothicRegular';
    src: url('http://www.example.com/css/fonts/League_Gothic.eot?') format('eot'),
         url('http://www.example.com/css/fonts/League_Gothic.woff') format('woff'),
         url('http://www.example.com/css/fonts/League_Gothic.ttf') format('truetype'),
         url('http://www.example.com/css/fonts/League_Gothic.svg')

}
To rozwiąże problem. Należy pamiętać, że możesz dokładnie określić, które domeny powinny mieć dostęp do Twojej czcionki. W powyższym htaccess podałem, że każdy może uzyskać dostęp do mojej czcionki za pomocą "*" można go jednak ograniczyć do:

Pojedynczy URL:

Header set Access-Control-Allow-Origin http://example.com

lub rozdzielana przecinkami lista adresów URL

Access-Control-Allow-Origin: http://site1.com,http://site2.com

(wiele wartości nie jest obsługiwanych w bieżących implementacjach)

 166
Author: Mazatec,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2018-11-21 11:49:18

Zgodnie z oficjalnymi dokumentami , przeglądarki nie lubią, gdy używasz

Access-Control-Allow-Origin: "*"

Nagłówek jeśli używasz również

Access-Control-Allow-Credentials: "true"

Nagłówek. Zamiast tego chcą, abyś zezwolił na ich pochodzenie. Jeśli nadal chcesz zezwolić na wszystkie origins, możesz wykonać prostą magię Apache, aby ją uruchomić (upewnij się, że masz włączone mod_headers): {]}

Header set Access-Control-Allow-Origin "%{HTTP_ORIGIN}e" env=HTTP_ORIGIN

Przeglądarki są wymagane do wysłania nagłówka Origin we wszystkich żądaniach między domenami. Dokumenty wyraźnie stwierdzają, że potrzebujesz aby odtworzyć ten nagłówek z powrotem w nagłówku Access-Control-Allow-Origin, Jeśli akceptujesz / planujesz akceptację żądania. To właśnie robi ta dyrektywa.

 21
Author: laughingbovine,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2013-07-31 20:15:01

Przyjęta odpowiedź nie działa dla mnie niestety, ponieważ moja strona pliki CSS @ import plików CSS czcionki, a te wszystkie są przechowywane w Rackspace Cloud plików CDN.

Ponieważ nagłówki Apache nigdy nie są generowane( ponieważ mój CSS nie jest na Apache), musiałem zrobić kilka rzeczy:

  1. przejdź do interfejsu plików w chmurze i Dodaj niestandardowy nagłówek (Access-Control-Allow-Origin z wartością *) dla każdego pliku Font-awesome
  2. Zmień typ zawartości plików WOFF i ttf na font/WOFF i odpowiednio font/TTF

Sprawdź, czy uda ci się uciec z tylko #1, ponieważ drugi wymaga trochę pracy z wierszem poleceń.

Aby dodać niestandardowy nagłówek w #1:

  • Wyświetl kontener plików w chmurze dla pliku
  • przewiń w dół do pliku
  • Kliknij ikonę koła zębatego
  • kliknij Edytuj nagłówki
  • select Access-Control-Allow-Origin
  • Dodaj pojedynczy znak ' * ' (bez cudzysłowów)
  • wciśnij enter
  • powtórz dla drugiego pliki

Jeśli chcesz kontynuować i wykonać #2, będziesz potrzebować wiersza poleceń z CURL

curl -D - --header "X-Auth-Key: your-auth-key-from-rackspace-cloud-control-panel" --header "X-Auth-User: your-cloud-username" https://auth.api.rackspacecloud.com/v1.0

Ze zwracanych wyników wyodrębnij wartości dla X-Auth-Token i x-Storage-Url

curl -X POST \
  -H "Content-Type: font/woff" \
  --header "X-Auth-Token: returned-x-auth-token" returned-x-storage-url/name-of-your-container/fonts/fontawesome-webfont.woff

curl -X POST \
  -H "Content-Type: font/ttf" \
  --header "X-Auth-Token: returned-x-auth-token" returned-x-storage-url/name-of-your-container/fonts/fontawesome-webfont.ttf

Oczywiście ten proces działa tylko wtedy, gdy używasz Rackspace CDN. Inne CDN mogą oferować podobne funkcje do edycji nagłówków obiektów i zmiany typów zawartości, więc może Ci się poszczęści (i zamieść dodatkowe informacje TUTAJ).

 5
Author: Phil,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2014-03-27 19:38:51

Dla aplikacji opartych na Javie dodaj to do swojej sieci.plik xml:

<servlet-mapping>
    <servlet-name>default</servlet-name>
    <url-pattern>*.ttf</url-pattern>
</servlet-mapping>

<servlet-mapping>
    <servlet-name>default</servlet-name>
    <url-pattern>*.otf</url-pattern>
</servlet-mapping>

<servlet-mapping>
    <servlet-name>default</servlet-name>
    <url-pattern>*.eot</url-pattern>
</servlet-mapping>

<servlet-mapping>
    <servlet-name>default</servlet-name>
    <url-pattern>*.woff</url-pattern>
</servlet-mapping>
 4
Author: Neon Sun,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2019-12-13 19:21:50

Sprawdź ten link.. To na pewno rozwiąże twój problem.. Istnieje wiele rozwiązań, aby cross domain uzyskać połączenia Ajax ALE ŻĄDANIE POST DLA CROSS DOMAIN JEST ROZWIĄZANE TUTAJ . Zajęło mi 3 dni, żeby to rozgryźć.

Http://blogs.msdn.com/b/carlosfigueira/archive/2012/02/20/implementing-cors-support-in-asp-net-web-apis.aspx

 1
Author: user2440156,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2013-09-30 12:13:38

W Twoich aktach.php żądania ajax, może ustawić nagłówek wartości.

<?php header('Access-Control-Allow-Origin: *'); //for all ?>
 1
Author: Santos L. Victor,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2015-09-03 13:11:24