Programing

WOFF 글꼴의 MIME 유형?

lottogame 2020. 2. 9. 20:29
반응형

WOFF 글꼴의 MIME 유형?


WOFF 글꼴은 어떤 MIME 유형으로 제공되어야합니까?

트루 타입 (ttf) 글꼴을로 font/truetype, 오픈 타입 ( otf)을로 제공 font/opentype하지만 WOFF 글꼴의 올바른 형식을 찾을 수 없습니다.

나는 시도 font/woff, font/webopen그리고 font/webopentype하지만, 크롬은 여전히 불평 :

"리소스로 해석되었지만 MIME 유형 application / octet-stream으로 전송 된 자원."

아는 사람 있나요?


2017 년 6 월 22 일에 대한 Keith Shaw의 의견 에서 업데이트 :

2017 년 2 월 현재 RFC8081 이 제안 된 표준입니다. 글꼴의 최상위 미디어 유형을 정의하므로 WOFF 및 WOFF2의 표준 미디어 유형은 다음과 같습니다.

font/woff

font/woff2


2011 년 1 월 이 발표 된 그 동안 크롬이 인식 할 수

application/x-font-woff

WOFF의 MIME 유형으로. 이 변경 사항은 현재 Chrome 베타 버전이며 아직 안정적이지 않은 경우 너무 멀지 않아야합니다.


나를 위해 다음은 .htaccess 파일에서 작업하기 시작했습니다.

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

될 것 application/font-woff입니다.

http://www.w3.org/TR/WOFF/#appendix-b(W3C 후보 권장 사항 2011 년 8 월 4 일)를 참조하십시오 .

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

Mozilla CSS 폰트 페이스 노트에서

Gecko에서 웹 글꼴은 HTTP 액세스 제어를 사용하여이 제한을 완화하지 않는 한 도메인 제한이 동일합니다 (글꼴 파일은 페이지를 사용하는 페이지와 동일한 도메인에 있어야 함). 참고 : TrueType, OpenType 및 WOFF 글꼴에 대해 정의 된 MIME 유형이 없으므로 지정된 파일의 MIME 유형은 고려되지 않습니다.

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


.NET / IIS에 글꼴 마임 유형을 추가하기위한 참조

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>

IIS 관리자를 통해

IIS에 woff mime 유형을 추가하는 스크린 샷


NGINX 솔루션

파일

/etc/nginx/mime.types

또는

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

더하다

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

없애다

application/octet-stream        eot;

참조

RFC @ 02.2017

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

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

Mike Fulcher에게 감사합니다

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


2017 년 2 월 현재 RFC8081 이 제안 된 표준입니다. 글꼴의 최상위 미디어 유형을 정의하므로 WOFF 및 WOFF2의 표준 미디어 유형은 다음과 같습니다.

font/woff
font/woff2

fontMIME 형식 이 없습니다 ! 따라서 font/xxx항상 잘못되었습니다.


나를 위해 한 것은 이것을 mime_types.rb 초기화 프로그램에 추가하는 것이 었습니다.

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

캐시를 닦아

rake tmp:cache:clear

서버를 다시 시작하기 전에

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


.htaccess에 다음을 추가하십시오.

AddType font/woff woff

행운을 빕니다


@ 니코 ,

현재 woff font mime 유형에 대해 정의 된 표준이 없습니다. 글꼴 배달 CDN 서비스를 사용하고 글꼴 / woff를 사용하며 크롬에서 동일한 경고가 표시됩니다.

참조 : 인터넷 할당 번호 기관


어쩌면 이것은 누군가를 도울 것입니다. IIS 7 .ttf에서 이미 알려진 MIME 유형이라는 것을 알았습니다. 다음과 같이 구성됩니다.

application/octet-stream

난 그냥 추가 한 모든 CSS 글꼴 유형 (그래서 .oet, .svg, .ttf, .woff) 및 IIS 그들을 제공하기 시작했다. Chrome 개발 도구는 유형을 다시 해석하는 것에 대해 불평하지 않습니다.

건배, 마이클


나는이 게시물이 오래되었다는 것을 알고 있지만 내 nginx 로컬 컴퓨터에서 글꼴을 작동시키고 많은 솔루션을 시도하는 데 많은 시간을 보낸 후에 마침내 매력처럼 나를 위해 일한 솔루션을 얻었습니다.

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

괄호 안에는 글꼴의 확장자 또는 일반적으로로드하려는 파일을 넣을 수 있습니다. 예를 들어 글꼴과 이미지 (png, jpg 등)에도 사용 했으므로이 솔루션이 글꼴에만 적용된다고 혼동하지 마십시오.

그냥 nginx 설정 파일에 넣고 다시 시작하십시오.


IIS는 .ttf를 응용 프로그램 / 옥텟 스트림으로 자동 정의했으며 fontshop은 .woff를 응용 프로그램 / 옥텟 스트림으로 정의 할 것을 권장합니다.


오프 :

  1. 웹 열기 글꼴 형식
  2. TrueType 또는 PostScript (CFF) 외곽선으로 컴파일 할 수 있습니다.
  3. 현재 FireFox 3.6 이상에서 지원됩니다

그것을 추가하십시오 :

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

모든 솔루션 index.php에 대해 양식 URL과 woff 파일을 제거하십시오. .htaccess 파일에 아래 코드를 작성하고 application / config / config.php 파일을 대체하십시오 : $ config [ 'index_page'] = '';

Linux 호스팅 서버 전용 .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>

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

이것은 유용한 mimetype 목록입니다


나는 같은 문제를 겪었다. 글꼴 / 오픈 타입 은 나를 위해 일했다.


MIME 유형이 유일한 문제는 아닙니다. 글꼴 파일이 S3 또는 다른 도메인에서 호스팅되는 경우 Firefox가 다른 도메인에서 글꼴을로드하지 않는 문제가 추가로 발생할 수 있습니다. Apache를 사용하면 쉽게 해결할 수 있지만 Nginx에서는 글꼴 파일을 base-64로 인코딩하고 글꼴 css 파일에 직접 포함해야한다는 것을 읽었습니다.

참고 URL : https://stackoverflow.com/questions/3594823/mime-type-for-woff-fonts



반응형