웹폰트 사용 시 IIS 설정.

2015. 12. 3. 14:30Coders

IIS 서버에서 웹폰트를 사용할 때에, 기본적으로 웹폰트의 파일 타입은 IIS에 설정되어 있지 않기 때문에, 지정해 줘야 합니다.

뭔 소리냐 하면, 기본적으로 IIS는 MIME Type 에 파일 확장자들을 등록해 줘야 해당 파일들을 찾을 수 있는데요(찾을 수 없다는 건 404 File Not Found 가 뜬다는 얘기죠.) 웹폰트의 확장자인 eot, woff 등등은 기본 MIME Type 에 등록되어 있지 않기 때문에, IIS 서버의 MIME Type 설정에 추가해 줘야 합니다.


다음과 같이 말이죠.


.eot : application/vnd.ms-fontobject

.woff : application/font-woff


만약 .NET 으로 웹 페이지 개발을 하고 있다면, 배포시에 기본 MIME Type으로 롤백 되어 버리기 때문에, 해당 설정을 해 준 다음 Web.config 파일을 까서 해당 내용을 프로젝트 소스에도 반영을 해 주는 게 좋겠지요.

또는, 프로젝트 자체의 Web.config 를 수정해도 됩니다.


다음과 같이요.

<?xml version="1.0" encoding="utf-8"?>

<!--
  ASP.NET 응용 프로그램을 구성하는 방법에 대한 자세한 내용을 보려면
  http://go.microsoft.com/fwlink/?LinkId=169433을 방문하십시오.
  -->

<configuration>

  <system.webServer>
    <staticContent>
      <!--웹폰트, SVG 파일 등을 MIME MAP 에 등록해 줌.-->
      <remove fileExtension=".eot" />
      <remove fileExtension=".ttf" />
      <remove fileExtension=".svg" />
      <remove fileExtension=".woff" />
      <remove fileExtension=".woff2" />

      <mimeMap fileExtension=".eot" mimeType="application/vnd.ms-fontobject" />
      <mimeMap fileExtension=".ttf" mimeType="application/font-sfnt" />
      <mimeMap fileExtension=".svg" mimeType="image/svg+xml" />
      <mimeMap fileExtension=".woff" mimeType="application/font-woff" />
      <mimeMap fileExtension=".woff2" mimeType="application/font-woff" />
    </staticContent>
  </system.webServer>
  <system.web>
    <compilation debug="true" targetFramework="4.5" />
    <httpRuntime targetFramework="4.5" />
  </system.web>

</configuration>

MIME Type 은 이 뿐만 아니라, 특정 확장자의 파일을 다운로드 하거나 화면에 뿌려주기 위해서도 기본 목록에 없다면 반드시 등록해 줘야 하는 값 입니다.


웹은 참 공부할 게 많네요.