Jenis pantomim untuk font WOFF?

Jenis mime apa yang harus dilayani oleh font WOFF?

Saya melayani font truetype (ttf) font/truetypedan opentype (otf) font/opentype, tetapi saya tidak dapat menemukan format yang benar untuk font WOFF.

Saya telah mencoba font/woff,, font/webopendan font/webopentype, tetapi Chrome masih mengeluh:

"Sumber daya diartikan sebagai font tetapi ditransfer dengan aplikasi tipe MIME / octet-stream."

Adakah yang tahu?

Pembaruan dari komentar Keith Shaw pada 22 Jun 2017:

Pada Februari 2017, RFC8081 adalah standar yang diusulkan. Ini mendefinisikan jenis media tingkat atas untuk font, oleh karena itu jenis media standar untuk WOFF dan WOFF2 adalah sebagai berikut:

font/woff

font/woff2

Pada Januari 2011 diumumkan bahwa sementara itu Chromium akan mengenali

application/x-font-woff

sebagai tipe mime untuk WOFF. Saya tahu perubahan ini sekarang dalam Chrome beta dan jika belum dalam kondisi stabil, seharusnya tidak terlalu jauh.

Bagi saya, yang berikutnya telah bekerja di file .htaccess.

AddType font/ttf .ttf
AddType font/eot .eot
AddType font/otf .otf
AddType font/woff .woff
AddType font/woff2 .woff2   

Itu akan terjadi application/font-woff.

lihat http://www.w3.org/TR/WOFF/#appendix-b (Rekomendasi Calon W3C 4 Agustus 2011)

dan http://www.w3.org/2002/06/registering-mediatype.html

Dari Mozilla css, font-face note

Di Gecko, font web tunduk pada batasan domain yang sama (file font harus pada domain yang sama dengan halaman yang menggunakannya), kecuali jika kontrol akses HTTP digunakan untuk melonggarkan pembatasan ini. Catatan: Karena tidak ada tipe MIME yang ditentukan untuk font TrueType, OpenType, dan WOFF, tipe MIME dari file yang ditentukan tidak dipertimbangkan.

sumber: https://developer.mozilla.org/en/CSS/@font-face#Notes

Referensi untuk menambahkan jenis font mime ke .NET / IIS

via web.config

<system.webServer>
  <staticContent>
     <!-- remove first in case they are defined in IIS already, which would cause a runtime error -->
     <remove fileExtension=".woff" />
     <remove fileExtension=".woff2" />
     <mimeMap fileExtension=".woff" mimeType="font/woff" />
     <mimeMap fileExtension=".woff2" mimeType="font/woff2" />
  </staticContent>
</system.webServer>

melalui IIS Manager

SOLUSI NGINX

mengajukan

/etc/nginx/mime.types

atau

/usr/local/nginx/conf/mime.types

Menambahkan

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

menghapus

application/octet-stream        eot;

REFERENSI

RFC @ 02.2017

https://tools.ietf.org/html/rfc8081# halaman 15

https://www.iana.org/assignments/media-types/media-types.xhtml

Terima kasih kepada Mike Fulcher

http://drawingablank.me/blog/font-mime-types-in-nginx.html

Pada Februari 2017, RFC8081 adalah standar yang diusulkan. Ini mendefinisikan jenis media tingkat atas untuk font, oleh karena itu jenis media standar untuk WOFF dan WOFF2 adalah sebagai berikut:

font/woff
font/woff2

Catatan: Jawaban ini benar pada waktunya tetapi menjadi usang pada tahun 2017 ketika RFC 8081 dirilis

Tidak ada fonttipe MIME! Jadi, font/xxxapakah SELALU salah.

Hal yang melakukannya untuk saya adalah menambahkan ini ke inisialisasi mime_types.rb saya:

Rack::Mime::MIME_TYPES['.woff'] = 'font/woff'

dan menghapus cache

rake tmp:cache:clear

sebelum memulai kembali server.

Sumber: https://github.com/sstephenson/sprockets/issues/366#issuecomment-9085509

Tambahkan berikut ini ke .htaccess Anda

AddType font/woff woff

semoga berhasil

@Nico ,

Saat ini tidak ada standar yang ditentukan untuk jenis font mime woff. Saya menggunakan layanan pengiriman font CDN dan menggunakan font / woff dan saya mendapatkan peringatan yang sama di chrome.

Referensi: Otoritas Angka yang Ditugaskan di Internet

https://developer.mozilla.org/en-US/docs/Web/HTTP/Basics_of_HTTP/MIME_types/Complete_list_of_MIME_types

Ini adalah daftar tipuan yang berguna

Saya tahu posting ini agak tua tetapi setelah menghabiskan berjam-jam mencoba membuat font bekerja pada mesin nginx lokal saya dan mencoba banyak solusi saya akhirnya mendapatkan satu yang bekerja untuk saya seperti pesona.

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

Di dalam tanda kurung Anda dapat meletakkan ekstensi font Anda atau umumnya file yang ingin Anda muat. Misalnya saya menggunakannya untuk font dan untuk gambar (png, jpg dll) juga jadi jangan bingung bahwa solusi ini hanya berlaku untuk font.

Masukkan saja ke file konfigurasi nginx Anda, restart dan saya harap ini berfungsi juga untuk Anda!

Mungkin ini akan membantu seseorang. Saya melihat bahwa pada IIS 7 .ttfsudah dikenal sebagai tipe mime. Dikonfigurasi sebagai:

application/octet-stream

Jadi saya hanya menambahkan bahwa untuk semua jenis font yang CSS ( .oet, .svg, .ttf, .woff) dan IIS mulai melayani mereka. Alat dev Chrome juga tidak mengeluh tentang menafsirkan ulang tipe.

Cheers, Michael

Untuk semua Solution index.php hapus url formulir dan file woff diizinkan. untuk menulis kode di bawah ini dalam file .htaccess dan dan buat pergantian ini ke file aplikasi / config / config.php Anda: $ config ['index_page'] = '';

Hanya untuk server hosting Linux. Detail file .htaccess

AddType font/ttf .ttf
AddType font/eot .eot
AddType font/otf .otf
AddType font/woff .woff
<IfModule mod_rewrite.c>
    RewriteEngine On
    RewriteBase /

    #Removes access to the system folder by users.
    #Additionally this will allow you to create a System.php controller,
    #previously this would not have been possible.
    #'system' can be replaced if you have renamed your system folder.
    RewriteCond %{REQUEST_URI} ^system.*
    RewriteRule ^(.*)$ /index.php?/$1 [L]

    #When your application folder isn't in the system folder
    #This snippet prevents user access to the application folder
    #Submitted by: Fabdrol
    #Rename 'application' to your applications folder name.
    RewriteCond %{REQUEST_URI} ^application.*
    RewriteRule ^(.*)$ /index.php?/$1 [L]

    #Checks to see if the user is attempting to access a valid file,
    #such as an image or css document, if this isn't true it sends the
    #request to index.php
    RewriteCond %{REQUEST_FILENAME} !-f
    RewriteCond %{REQUEST_FILENAME} !-d
    RewriteRule ^(.*)$ index.php?/$1 [L]
</IfModule>

<IfModule !mod_rewrite.c>
    # If we don't have mod_rewrite installed, all 404's
    # can be sent to index.php, and everything works as normal.
    # Submitted by: ElliotHaughin

    ErrorDocument 404 /index.php
</IfModule>

IIS secara otomatis mendefinisikan .ttf sebagai application / octet-stream yang tampaknya berfungsi dengan baik dan fontshop merekomendasikan .woff untuk didefinisikan sebagai application / octet-stream

WOFF:

1. Format Font Buka Web
2. Itu dapat dikompilasi dengan garis luar TrueType atau PostScript (CFF)
3. Saat ini didukung oleh FireFox 3.6+

Coba tambahkan itu:

AddType application/vnd.ms-fontobject .eot
AddType application/octet-stream .otf .ttf

Saya memiliki masalah yang sama, font / opentype bekerja untuk saya

Jenis pantomim mungkin bukan satu-satunya masalah Anda. Jika file font di-host di S3 atau domain lain, Anda mungkin juga memiliki masalah bahwa Firefox tidak akan memuat font dari domain yang berbeda. Ini adalah perbaikan yang mudah dengan Apache, tetapi di Nginx, saya telah membaca bahwa Anda mungkin perlu menyandikan file font di base-64 dan menyematkannya langsung ke file font css Anda.