Как настроить политику CORS для шрифтов?

Для отображения пользовательских шрифтов прямо в электронном письме браузер должен получать файлы шрифтов с правильными заголовками HTTP.

Если сервер не устанавливает требуемые заголовки, некоторые браузеры могут сообщать об ошибках в консоли или вообще не отображать шрифты.

Чтобы решить эту проблему, ваш системный администратор должен применить правильный заголовок CORS для шрифтов на сервере, где они размещены.

Возможно, ваш сервер уже настроен, и вам не нужно ничего менять. Если же это не так, вам нужно позаботиться о:

1. Правильных заголовках MIME-типа.

2. CORS заголовках — только если вы обслуживаете файлы шрифтов и html-страницы из разных доменов.

3. Для IE убедитесь, что ваши HTTP-заголовки для файлов шрифтов не имеют значения no-store или no-cache.

Apache

Чтобы установить правильные типы MIME для файлов шрифтов, добавьте эти строки в config:

AddType font/ttf                        ttf 
AddType font/otf                        otf 
AddType font/woff                       woff 
AddType font/woff2                      woff2 
AddType application/vnd.ms-fontobject   eot

Если вы не можете редактировать конфигурацию, создайте файл .htaccess в папке с вашим проектом и добавьте туда строки.

Для заголовков CORS добавьте:

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

Nginx

По умолчанию в Nginx нет типов MIME по умолчанию для шрифтов и неправильных типов MIME для файлов .eot. Вам нужно перейти в папку с конфигами и найти, где определены типы MIME.

Обычно это в файле mime.types.

1. Поиск .eot и строка с ним.

2. Добавьте строки ниже.

font/ttf ttf; font/otf otf; font/woff woff; font/woff2 woff2; application/vnd.ms-fontobject eot;

Для заголовков CORS добавьте что-то подобное в конфигурацию вашего хоста.

location ~* \.(eot|otf|ttf|woff|woff2)$ { add_header Access-Control-Allow-Origin *; }