.woff, .woff2 폰트 파일 404 에러
1. 에러 메세지
이모티콘을 따로 이미지로 쓰기엔 너무 많고 용량을 많이 차지합니다.
그래서 웹 폰트를 다운 또는 cdn으로 받아쓰는데
저는 로컬에 woff 파일을 받아 쓰고 있었습니다.
그런데 다른 서버에 게시하고 작동 하는지 확인 하는도중
다음과 같은 404 에러가 저를 괴롭혔습니다 ㅠㅠ
- HTTP 404 Not Found
2. 원인
서버의 입장에서는 woff, woff2는 예상치 못한 파일 형식입니다.
비록 이 파일과 형식은 매우 흔한 폰트 파일이지만
웹 서버의 기본 설정은 예상치 못한 파일 형식이라고 생각 하나 봅니다.
그래서 파일이 실제로 존재하고 올바른 형식임에도 불구하고
404 에러를 내뱉는 이유가 여기에 있었습니다.
2. 해결방법
이 문제를 해결하기 위해서 이 파일이 올바른 형식임을 서버에게 알려주는 간단한 설정을 해주면 됩니다.
고로 web.config을 수정 하시면 되겠습니다.
우선 <system.webServer>의 <staticContent>가 보이실 겁니다.
만약 없다면 새로 추가하시면 되겠습니다.
<system.webServer> <staticContent> <clientCache cacheControlCustom="public" cacheControlMode="UseMaxAge" cacheControlMaxAge="365.00:00:00" /> <remove fileExtension=".woff" /> <remove fileExtension=".woff2" /> <mimeMap fileExtension=".woff" mimeType="application/x-font-woff" /> <mimeMap fileExtension=".woff2" mimeType="application/font-woff2" /> </staticContent> <modules>
하나 주의하실 점은 <remove>와 <mimeMap>태그입니다.
만약 <staticContent>가 이미 존재했었다면 위의 코드를 반드시 입력할 것을 추천 드립니다.
이렇게 하신면 여러분의 머리를 아프게 하던 HTTP 404 에러가 더 이상 나타나지 않으며
예쁘고 아름다운 웹 폰트들이 화면에 잘 나타나실 겁니다.
감사합니다.