This page has been robot translated, sorry for typos if any. Original content here.

Зберігання веб-шрифтів в CDN

Хранение веб-шрифтов в CDN

Як відомо, для поліпшення продуктивності статику краще зберігати в CDN.

Зокрема, веб-шрифти.

На жаль, веб-шрифти зберігаються в CDN за замовчуванням не будуть працювати в Firefox і Internet Explorer - для коректного відображення потрібні налаштування CORS. Нижче ви зможете знайти необхідний код.

конфігурація Apache

Налаштування повинні бути в .htaccess або httpd.conf:

 <FilesMatch ". (Eot | ttf | otf | woff)">
     Header set Access-Control-Allow-Origin "*"
 </ FilesMatch>	

конфігурація Nginx

Налаштування повинні бути в nginx.conf:

 if ($ filename ~ * ^. *? \. (eot) | (ttf) | (woff) $) {
     add_header Access-Control-Allow-Origin *;
 }	

Access-Control-Allow-Origin конфигурирует CORS так, щоб було можливо отримувати файли шрифтів з будь-якого домену.

Або ви можете перерахувати домени через кому, якщо хочете дозволити їх отримання з конкретних доменів.

Або ви можете перерахувати домени через кому, якщо хочете дозволити їх отримання з конкретних доменів.

Як перевірити

Щоб перевірити правильну настройку заголовків, можна використовувати curl:

 $ Curl -I https://some.cdn.otherdomain.net/media/fonts/somefont.ttf

відповідь:

 # Result HTTP / 1.1 200 OK Server: Apache X-Backend-Server: developer1.webapp.scl3.mozilla.com Content-Type: text / plain;  charset = UTF-8 Access-Control-Allow-Origin: * ETag: "4dece1737ba40" Last-Modified: Mon, 10 Jun 2013 15:04:01 GMT X-Cache-Info: caching Cache-Control: max-age = 604795 Expires: Wed, 19 Jun 2013 16:22:58 GMT Date: Wed, 12 Jun 2013 16:23:03 GMT Connection: keep-alive 

Якщо побачите у відповіді Access-Control-Allow-Origin: * - все відмінно.

Ця ж стратегія використовується в Bootstrap CDN, так що можна бути впевненим, що вона хороша.