Frage Wie kann ich nginx support @ font-face formatieren und access-control-allow-origin zulassen?


Ich habe diese Regeln hinzugefügt mime.types:

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

Jetzt wird der Content-Type-Header für jeden dieser Header richtig gesetzt. Mein einziges Problem ist jetzt, dass Firefox Access-Control-Allow-Origin erfordert. Ich habe das gegoogelt Antworten und fügte dies meiner Server-Direktive hinzu:

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

aber jetzt werden meine Schriftarten überhaupt nicht bedient.

Stattdessen die error.log meldet, dass es versucht, sie auf dem lokalen Dateisystem zu öffnen.

2010/10/02 22:20:21 [Fehler] 1641 # 0:   * 15 offen () "/usr/local/nginx/html/fonts/mgopenmodernabold-webfont.woff"   fehlgeschlagen (2: Keine solche Datei oder Verzeichnis),   Kunde: 69.164.216.142, se rver:   static.arounds.org, Anfrage: "HEAD   /fonts/mgopenmodernabold-webfont.woff   HTTP / 1.1 ", Host:" static.arounds.org "

Irgendwelche Ideen, was könnte mit der Syntax los sein? Muss ich explizit eine Regel hinzufügen, die besagt, dass ich nicht versuche, sie lokal zu öffnen oder was?

BEARBEITEN: Ich denke, das Problem ist, dass ich jetzt zwei verschiedene Orte betreue. Und statt dessen sollte ich den Regex-Check innerhalb des Hauptfensters durchführen und dann den Header einspeisen.


18
2017-10-02 22:28


Ursprung


Sie können in Ihrer Regel auch "otf" hinzufügen - Kevin Campion


Antworten:


Woot! Verstanden. Es war ziemlich genau das, was ich in meinem Schnitt vermutete. Ich musste den Regex-Dateinamen-Check in meiner Sohle machen location {} anstatt eine Alternative zu machen.

    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 *;
            }
    }

18
2017-10-02 22:36



Nein, das tust du wirklich nicht. Sie müssen nur über Kontextvererbung lernen. Wenn Sie die Site-Root-Anweisung in Ihrem Serverblock angeben, ist sie in allen Standortblöcken verfügbar. Ich schlage vor, du liest das: blog.martinfjordvald.com/2010/07/nginx-primer - Martin Fjordvald
Jemand hat mir das im #nginx-Kanal gesagt, aber ich habe vergessen, die Antwort zu aktualisieren. - meder omuraliev


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

10
2017-08-11 04:07



HINWEIS: Wenn die gegebene Lösung für Sie nicht funktioniert, lesen Sie diese und diese. Es ist aufschlussreich, und Sie können den Grund dafür finden, dass es nicht funktioniert. - its_me
Dies funktioniert nicht für mich, da die Font-URL eine Abfrage-Zeichenfolge enthält - Broncha


Alle Vermögenswerte

Dadurch werden alle Vermögenswerte gut funktionieren. Du kannst hinzufügen root wenn Sie einen neuen Standort definieren möchten

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";
}

5
2018-06-16 16:54





eine andere Lösung: Fügen Sie alle Ihre Schriften ein, zum Beispiel static/fontsund hinzufügen

location /static/fonts  {
    add_header "Access-Control-Allow-Origin" *;
    alias /var/www/mysite/static/fonts;
}

3
2018-06-10 08:25