Loại Mime cho phông chữ WOFF?

Loại phông chữ WOFF nên được phục vụ như thế nào?

Tôi đang phục vụ phông chữ font/truetypetruetype (ttf) và opentype (otf) font/opentype, nhưng tôi không thể tìm thấy định dạng chính xác cho phông chữ WOFF.

Tôi đã thử font/woff, font/webopenvà font/webopentype, nhưng Chrome vẫn phàn nàn:

"Tài nguyên được hiểu là phông chữ nhưng được chuyển bằng ứng dụng loại MIME / octet-stream."

Có ai biết không?

Cập nhật từ bình luận của Keith Shaw vào ngày 22 tháng 6 năm 2017:

Kể từ tháng 2 năm 2017, RFC8081 là tiêu chuẩn được đề xuất. Nó xác định loại phương tiện cấp cao nhất cho phông chữ, do đó loại phương tiện tiêu chuẩn cho WOFF và WOFF2 như sau:

font/woff

font/woff2

Vào tháng 1 năm 2011 , thông báo rằng Chromium sẽ nhận ra

application/x-font-woff

là loại mime cho WOFF. Tôi biết thay đổi này hiện đã có trong Chrome beta và nếu chưa ổn định, thì nó không nên quá xa.

Đối với tôi, cái tiếp theo đã được làm việc trong một tập tin .htaccess.

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

Nó sẽ được application/font-woff.

xem http://www.w3.org/TR/WOFF/#appcill-b (Khuyến nghị của ứng viên W3C ngày 04 tháng 8 năm 2011)

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

Từ ghi chú mặt chữ css của Mozilla

Trong Gecko, phông chữ web phải tuân theo cùng một giới hạn tên miền (các tệp phông chữ phải nằm trên cùng một tên miền với trang sử dụng chúng), trừ khi các điều khiển truy cập HTTP được sử dụng để nới lỏng hạn chế này. Lưu ý: Vì không có loại MIME được xác định cho phông chữ TrueType, OpenType và WOFF, loại MIME của tệp được chỉ định không được xem xét.

nguồn: https://developer.mozilla.org/en/CSS/@font-face#Notes

Tham khảo để thêm các loại mime phông chữ vào .NET / IIS

qua 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>

thông qua quản lý IIS

GIẢI PHÁP NGINX

tập tin

/etc/nginx/mime.types

hoặc là

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

thêm vào

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

tẩy

application/octet-stream        eot;

NGƯỜI GIỚI THIỆU

RFC @ 02.2017

https://tools.ietf.org/html/rfc8081#page-15

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

Cảm ơn Mike Fulcher

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

Kể từ tháng 2 năm 2017, RFC8081 là tiêu chuẩn được đề xuất. Nó xác định loại phương tiện cấp cao nhất cho phông chữ, do đó loại phương tiện tiêu chuẩn cho WOFF và WOFF2 như sau:

font/woff
font/woff2

Lưu ý: Câu trả lời này đúng vào thời điểm đó nhưng đã trở nên lỗi thời vào năm 2017 khi RFC 8081 được phát hành

Không có fontloại MIME! Như vậy, font/xxxLUÔN LUÔN là sai.

Điều đó đã làm cho tôi là thêm nó vào trình khởi tạo mime_types.rb của tôi:

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

và xóa sạch bộ nhớ cache

rake tmp:cache:clear

trước khi khởi động lại máy chủ.

Nguồn: https://github.com/sstephenson/sprockets/issues/366#issuecomment-9085509

Thêm phần sau vào .htaccess của bạn

AddType font/woff woff

chúc may mắn

@Nico ,

Hiện tại không có tiêu chuẩn được xác định cho loại mime phông chữ woff. Tôi sử dụng dịch vụ cdn phân phối phông chữ và nó sử dụng phông chữ / woff và tôi nhận được cảnh báo tương tự trong chrome.

Tham khảo: Cơ quan cấp số Internet

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

Đây là một danh sách hữu ích của mimetypes

Tôi biết bài đăng này là cũ nhưng sau khi dành nhiều giờ để cố gắng làm cho phông chữ hoạt động trên máy cục bộ nginx của tôi và thử hàng tấn giải pháp, cuối cùng tôi đã có được một giải pháp phù hợp với tôi.

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

Trong dấu ngoặc đơn, bạn có thể đặt các phần mở rộng của phông chữ hoặc nói chung là các tệp bạn muốn tải. Ví dụ, tôi đã sử dụng nó cho phông chữ và cho hình ảnh (png, jpg, v.v.) vì vậy đừng nhầm lẫn rằng giải pháp này chỉ áp dụng cho phông chữ.

Chỉ cần đặt nó vào tập tin cấu hình nginx của bạn, khởi động lại và tôi hy vọng nó cũng hoạt động cho bạn!

Có lẽ điều này sẽ giúp được ai đó. Tôi thấy rằng trên IIS 7 .ttfđã là một loại mime được biết đến. Nó được cấu hình là:

application/octet-stream

Vì vậy, tôi chỉ nói thêm rằng đối với tất cả các loại font chữ CSS ( .oet, .svg, .ttf,.woff ) và IIS bắt đầu phục vụ họ. Các công cụ phát triển Chrome cũng không phàn nàn về việc diễn giải lại loại này.

Chúc mừng, Michael

Đối với tất cả Giải pháp index.php, xóa url mẫu và tệp woff được phép. để viết mã bên dưới vào tệp .htaccess và thực hiện thay thế này cho tệp application / config / config.php của bạn: $ config ['index_page'] = '';

Chỉ dành cho máy chủ lưu trữ Linux. chi tiết tập tin .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 tự động định nghĩa .ttf là application / octet-stream có vẻ hoạt động tốt và fontshop khuyến nghị .woff được định nghĩa là application / octet-stream

GIỜ:

1. Định dạng phông chữ mở web
2. Nó có thể được biên dịch với các phác thảo TrueType hoặc PostScript (CFF)
3. Nó hiện đang được hỗ trợ bởi FireFox 3.6+

Cố gắng thêm rằng:

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

Tôi đã có cùng một vấn đề, font / opentype làm việc cho tôi

Loại Mime có thể không phải là vấn đề duy nhất của bạn. Nếu tệp phông chữ được lưu trữ trên S3 hoặc tên miền khác, bạn cũng có thể gặp vấn đề là Firefox sẽ không tải phông chữ từ các tên miền khác nhau. Đây là một sửa chữa dễ dàng với Apache, nhưng trong Nginx, tôi đã đọc rằng bạn có thể cần phải mã hóa các tệp phông chữ của mình trong cơ sở 64 và nhúng chúng trực tiếp vào tệp css phông chữ của bạn.