@font-face를 사용하여 Firefox의 외부 도메인에서 글꼴을 로드할 수 없는 이유는 무엇입니까?

CSS @font-face 외부 도메인의 절대 URL: Firefox에서 글꼴 로딩 문제 해결

에서 스토어 섹션을 개발하려는 시도 중 Shopify에서는 별도의 Pagodabox 서버에 호스팅된 글꼴이 Firefox 버전 13.0.1에서 로드되지 않아 사용자에게 문제가 발생했습니다. CSS는 절대 URL을 사용하여 글꼴을 참조했으며 문제의 원인을 확인하기 위해 도움을 구했습니다.

Firefox는 @font-face를 사용하여 외부 도메인에서 글꼴 로드를 제한하는 보안 조치를 시행합니다. 글꼴 소스가 다른 서버에 있는 경우 액세스 제어 헤더, 특히 '*' 또는 승인된 도메인으로 설정된 Access-Control-Allow-Origin 헤더를 동반해야 합니다.

이 문제를 해결하려면 문제의 경우 해결 방법은 .htaccess 파일에 Apache 구성을 추가하고 서버를 다시 시작하는 것입니다. 예는 다음과 같습니다.

AddType application/vnd.ms-fontobject .eot
AddType font/ttf .ttf
AddType font/otf .otf
<FilesMatch "\.(ttf|otf|eot)$">
<IfModule mod_headers.c>
Header set Access-Control-Allow-Origin "*"
</IfModule>
</FilesMatch>

지정된 구성을 .htaccess 파일에 추가하면 Firefox는 액세스 제어 헤더를 인식하고 외부 Pagodabox 도메인에 호스팅된 글꼴을 성공적으로 로드할 수 있습니다.

위 내용은 @font-face를 사용하여 Firefox의 외부 도메인에서 글꼴을 로드할 수 없는 이유는 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!