Как сделать так, чтобы nginx поддерживал форматы @font-face и разрешал access-control-allow-origin?

Я добавил эти правила в mime.types:

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

Теперь заголовок Content-Type устанавливается правильно для каждого из них. Моя единственная проблема сейчас заключается в том, что Firefox требует Access-Control-Allow-Origin. Я нашел этот ответ в Google и добавил его в директиву моего сервера:

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

но теперь мои шрифты не обслуживаются вообще.

Вместо error.log сообщает, что пытается открыть их в локальной файловой системе..

2010/10/02 22:20:21 [ошибка] 1641#0: *15 open() "/usr/local/nginx/html/fonts/mgopenmodernabold-webfont.woff" не удалось (2: такого файла или каталога нет), клиент: 69.164.216.142, сервер: static.arounds.org, запрос: "HEAD /fonts/mgopenmodernabold-webfont.woff HTTP/1.1", хост: "static.arounds.org"

Есть идеи, что может быть с синтаксисом? Нужно ли явно добавлять правило, гласящее: не пытайтесь открыть его локально или как?

РЕДАКТИРОВАТЬ: Я думаю, что проблема в том, что я обслуживаю 2 разных местах сейчас. И вместо этого я должен выполнить проверку регулярных выражений внутри основного, а затем передать заголовок.

Источник

4 ответа

Решение

Woot! Понял.. Это было в значительной степени то, что я подозревал в моем редактировании, я должен был в основном сделать проверку имени файла регулярного выражения в моей единственной location {} вместо того, чтобы сделать альтернативу.

    location / { 
            root /www/site.org/public/;
            index index.html;

            if ($request_filename ~* ^.*?/([^/]*?)$)
            {
                set $filename $1; 
            }

            if ($filename ~* ^.*?\.(eot)|(ttf)|(woff)$){
                add_header Access-Control-Allow-Origin *;
            }
    }
Источник 
location ~* \.(eot|ttf|woff)$ {
    add_header Access-Control-Allow-Origin *;
}
Источник

Все активы

Это заставит все активы работать нормально. Можете добавить root если вы хотите определить новое местоположение

location ~ \.(js|css|png|jpg|jpeg|gif|ico|html|woff|woff2|ttf|svg|eot|otf)$ {
    add_header "Access-Control-Allow-Origin" "*";
    expires 1M;
    access_log off;
    add_header Cache-Control "public";
}
Источник

Другое решение: поместите все свои шрифты, например, в static/fonts, и добавить

location /static/fonts  {
    add_header "Access-Control-Allow-Origin" *;
    alias /var/www/mysite/static/fonts;
}
Источник
Другие вопросы по тегам