IE9에서 Adobe 글꼴이 CSS3 @ font-face와 작동하도록 설정
작은 인트라넷 응용 프로그램을 작성하는 중입니다. 운 좋게도 최근에 구입 한 Adobe 글꼴 을 사용해보십시오 . 내가 알았 듯이 우리의 경우 라이센스 위반이 아닙니다.
모든 주요 브라우저를 대상으로 .ttf / .otf 버전의 글꼴을 .woff, .eot 및 .svg로 변환했습니다. 내가 사용한 @ font-face 구문은 기본적으로 Font Spring 의 방탄 구문입니다 .
@font-face {
font-family: 'MyFontFamily';
src: url('myfont-webfont.eot');
src: url('myfont-webfont.eot?#iehack') format('eot'),
url('myfont-webfont.woff') format('woff'),
url('myfont-webfont.ttf') format('truetype'),
url('myfont-webfont.svg#svgFontName') format('svg');
}
도메인 간 참조를 허용하도록 HTTP 헤더 (Access-Control-Allow-Origin = "*"추가)를 수정했습니다. FF와 Chrome에서는 완벽하게 작동하지만 IE9에서는 다음을 얻습니다.
CSS3111: @font-face encountered unknown error.
myfont-webfont.woff
CSS3114: @font-face failed OpenType embedding permission check. Permission must be Installable.
myfont-webfont.ttf
글꼴을 .ttf / .otf에서 .woff로 변환 할 때 .afm 파일 도 얻지 만 중요 여부에 대한 실마리는 없습니다.
그것을 해결하는 방법에 대한 아이디어가 있습니까?
[편집] -IIS 7.5 에서 내 웹 사이트 (글꼴도 있지만 정적 콘텐츠의 경우 별도의 디렉토리와 하위 도메인 아래)를 호스팅 합니다.
"CSS3114"오류 해결 방법 만 설명 할 수 있습니다.
TTF 파일의 포함 레벨을 변경해야합니다.
적절한 도구 를 사용하여 설치 가능한 포함 포함으로 설정할 수 있습니다.
64 비트 버전의 경우 @ user22600 's answer를 확인하십시오 .
Knu가 말했듯 이이 도구를 사용할 수 있지만 MS-DOS 전용으로 컴파일됩니다. Win64 용으로 컴파일했습니다. 다운로드 .
용법:
.exe를 수정해야 할 글꼴과 같은 폴더에 배치하십시오.
명령 행에서 해당 디렉토리로 이동하십시오.
입력
embed fontname.fonttype확장 예와 파일 이름과 fontType을 함께 글꼴 이름을 대체embed brokenFont.ttf다 했어요! 글꼴이 작동합니다.
즉, 글꼴의 형식을 'eot'가 아닌 'embedded-opentype'으로 설정해야합니다. 예를 들면 다음과 같습니다.
src: url('fontname.eot?#iefix') format('embedded-opentype')
다음과 같은 오류가 발생했습니다.
CSS3114 : @ font-face가 OpenType 포함 권한 검사에 실패했습니다. 권한은 설치 가능해야합니다.
fontname.ttf
아래 코드를 사용한 후 내 문제가 해결되었습니다 ....
src: url('fontname.ttf') format('embedded-opentype')
도와 주셔서 감사합니다!
건배,
Renjith.
이것을 시도하고 web.config 에이 줄을 추가하십시오.
<system.webServer>
<staticContent>
<mimeMap fileExtension=".woff" mimeType="application/octet-stream" />
</staticContent>
</system.webServer>
다른 답변 : 법적 문제.
이 작업을 수행하기 전에 유의해야 할 사항이 몇 가지 있습니다. 먼저,이 오류를 얻으려면 IE에서 요소를 검사하고 탭을 전환하고 오류를 찾으십시오. 콘솔에 "CSS3114"가 나타납니다.
이해해야 할 것은 라이센스 문제입니다. 이 오류가 발생하는 글꼴을로드하려고하면 IE (pun 의도 된) 글꼴을 사용할 수있는 파일에 대한 권한이 없으며 권한이 없으면 권한을 잃을 가능성이 높습니다. 라이센스를 보유하고 있지 않는 한이 방식으로이 글꼴을 사용하는 것보다 법적 전투 (그 자체는 거의 불가능). 따라서 처음으로 "아니요"라고 말할 수있는 유일한 브라우저 인 IE에게 감사 할 수 있습니다. 적어도 의심스러운 일을하고 있다는 것을 알려주기 때문입니다.
즉, 당신의 대답은 다음과 같습니다.
먼저 .css에서 최고의 코드를 사용하고 있는지 확인하십시오. 다른 CSS 답변을 참조하십시오.
IE 11 CSS 예제 (IE9에서는 모든 최신 브라우저에서 작동해야 함) :
@font-face {
font-family: "QuestionableLegalFont";
font-weight: bold;
src: url('../fonts/QuestionableLegalFont.ttf') format('truetype');
}
그런 다음 웹 글꼴이 작동하는지 확인하십시오 (다른 브라우저에서 글꼴을 확인하여 이미 알고 있음). 온라인 글꼴 변환기가 필요한 경우 여기를 확인하십시오 : https://onlinefontconverter.com/
마지막으로 "CSS3114"오류를 제거합니다. 온라인 도구의 경우 여기를 클릭하십시오 : https://www.andrebacklund.com/fontfixer.html
IE9에서 임베딩 비트를 설치 가능으로 설정하려면 TTF 글꼴이 필요합니다. Generator가 자동으로이 작업을 수행하지만 현재 다른 이유로 Adobe 글꼴을 차단하고 있습니다. 가까운 시일 내에이 제한을 해제 할 수 있습니다.
이 문제로 인해 많은 시간을 낭비했습니다. 마침내 나는 훌륭한 해결책을 스스로 찾았다. .ttf 글꼴 만 사용하기 전에. 그러나 IE에서 작동하기 시작한 추가 글꼴 형식 .eot를 추가했습니다.
다음 코드를 사용했으며 모든 브라우저에서 매력처럼 작동했습니다.
@font-face {
font-family: OpenSans;
src: url(assets/fonts/OpenSans/OpenSans-Regular.ttf),
url(assets/fonts/OpenSans/OpenSans-Regular.eot);
}
@font-face {
font-family: OpenSans Bold;
src: url(assets/fonts/OpenSans/OpenSans-Bold.ttf),
url(assets/fonts/OpenSans/OpenSans-Bold.eot);
}
이것이 누군가를 도울 수 있기를 바랍니다.
Mac 사용자는 글꼴 포함 권한을 수정하기 위해 언급 된 MS-DOS 및 Windows 명령 줄 도구를 사용할 수 없었습니다. 그러나 FontLab을 사용 하여이 문제를 해결하여 '모든 것이 허용됩니다'로 권한을 설정할 수 있음을 알았습니다. Mac OS X에서 글꼴 권한을 Installable 로 설정하는 방법에 대한이 레시피 가 다른 사람들에게도 유용하기를 바랍니다.
nodejs / npm에 익숙한 경우 ttembed-js 를 사용하여 TTF 글꼴에서 "installable embedding allowed"플래그를 쉽게 설정할 수 있습니다. 지정된 .ttf 파일이 수정됩니다.
npm install -g ttembed-js
ttembed-js somefont.ttf
문제는 서버 구성과 관련이있을 수 있습니다. 글꼴 파일에 올바른 헤더를 보내지 않을 수 있습니다. 교차 출처 웹 글꼴의 다운로드 IE9 차단 질문에 대한 답변을 살펴보십시오 .
EricLaw는 Apache 설정에 다음을 추가 할 것을 제안합니다
<FilesMatch "\.(ttf|otf|eot|woff)$">
<IfModule mod_headers.c>
Header set Access-Control-Allow-Origin "http://mydomain.com"
</IfModule>
</FilesMatch>
ttfpatch를 사용할 때 "tableversion은 0, 1 또는 16 진수 : 003이어야합니다"라는 오류가 발생하는 모든 사람을 위해 64 비트에 대해 embed를 컴파일했습니다. 나는 아무것도 변경하지 않고 그냥 libs를 추가하고 컴파일했다. 자기 책임으로 사용하십시오.
사용법 : ConsoleApplication1 font.ttf
http://www.mediafire.com/download/8x1px8aqq18lcx8/ConsoleApplication1.exe
C 코드를 실행하지 않고 PHP 스크립트 로이 작업을 수행하려는 경우 (또는 Mac과 같은 상태에서 1 년 동안 기다릴 때만 Xcode로 컴파일 할 수는 없습니다), 여기에 글꼴에서 퍼가기 권한을 제거하는 데 사용할 수있는 PHP 함수 :
function convertRestrictedFont($filename) {
$font = fopen($filename,'r+');
if ($font === false) {
throw new Exception('Could not open font file.');
}
fseek($font, 12, 0);
while (!feof($font)) {
$type = '';
for ($i = 0; $i < 4; $i++) {
$type .= fgetc($font);
if (feof($font)) {
fclose($font);
throw new Exception('Could not read the table definitions of the font.');
}
}
if ($type == 'OS/2') {
// Save the location of the table definition
// containing the checksum and pointer to the data
$os2TableDefinition = ftell($font);
$checksum = 0;
for ($i = 0; $i < 4; $i++) {
fgetc($font);
if (feof($font)) {
fclose($font);
throw new Exception('Could not read the OS/2 table header of the font.');
}
}
// Get the pointer to the OS/2 table data
$os2TablePointer = ord(fgetc($font)) << 24;
$os2TablePointer |= ord(fgetc($font)) << 16;
$os2TablePointer |= ord(fgetc($font)) << 8;
$os2TablePointer |= ord(fgetc($font));
$length = ord(fgetc($font)) << 24;
$length |= ord(fgetc($font)) << 16;
$length |= ord(fgetc($font)) << 8;
$length |= ord(fgetc($font));
if (fseek($font, $os2TablePointer + 8, 0) !== 0) {
fclose($font);
throw new Exception('Could not read the embeddable type of the font.');
}
// Read the fsType before overriding it
$fsType = ord(fgetc($font)) << 8;
$fsType |= ord(fgetc($font));
error_log('Installable Embedding: ' . ($fsType == 0));
error_log('Reserved: ' . ($fsType & 1));
error_log('Restricted License: ' . ($fsType & 2));
error_log('Preview & Print: ' . ($fsType & 4));
error_log('Editable Embedding: ' . ($fsType & 8));
error_log('Reserved: ' . ($fsType & 16));
error_log('Reserved: ' . ($fsType & 32));
error_log('Reserved: ' . ($fsType & 64));
error_log('Reserved: ' . ($fsType & 128));
error_log('No subsetting: ' . ($fsType & 256));
error_log('Bitmap embedding only: ' . ($fsType & 512));
error_log('Reserved: ' . ($fsType & 1024));
error_log('Reserved: ' . ($fsType & 2048));
error_log('Reserved: ' . ($fsType & 4096));
error_log('Reserved: ' . ($fsType & 8192));
error_log('Reserved: ' . ($fsType & 16384));
error_log('Reserved: ' . ($fsType & 32768));
fseek($font, ftell($font) - 2);
// Set the two bytes of fsType to 0
fputs($font, chr(0), 1);
fputs($font, chr(0), 1);
// Go to the beginning of the OS/2 table data
fseek($font, $os2TablePointer, 0);
// Generate a new checksum based on the changed
for ($i = 0; $i < $length; $i++) {
$checksum += ord(fgetc($font));
}
fseek($font, $os2TableDefinition, 0);
fputs($font, chr($checksum >> 24), 1);
fputs($font, chr(255 & ($checksum >> 16)), 1);
fputs($font, chr(255 & ($checksum >> 8)), 1);
fputs($font, chr(255 & $checksum), 1);
fclose($font);
return true;
}
for ($i = 0; $i < 12; $i++) {
fgetc($font);
if (feof($font)) {
fclose($font);
throw new Exception('Could not skip a table definition of the font.');
}
}
}
fclose($font);
return false;
}
이 코드를 실행하기 전에 글꼴 파일을 백업해야하며 손상된 경우 나를 탓하지 마십시오.
다음 코드를 통해 해결할 수 있습니다
@font-face {
font-family: 'Font-Name';
src: url('../fonts/Font-Name.ttf');
src: url('../fonts/Font-Name.eot?#iefix') format('embedded-opentype');
}
eot파일이 넘어야한다는 것을 알았 습니다 ttf. 아래에 있으면 ttf글꼴이 올바르게 표시된다고 생각하면 IE9에서 여전히 오류가 발생합니다.
권하다:
@font-face {
font-family: 'Font-Name';
src: url('../fonts/Font-Name.eot?#iefix') format('embedded-opentype');
src: url('../fonts/Font-Name.ttf') format('truetype');
}
권장 하지 않음 :
@font-face {
font-family: 'Font-Name';
src: url('../fonts/Font-Name.ttf') format('truetype');
src: url('../fonts/Font-Name.eot?#iefix') format('embedded-opentype');
}
나는 ttfpatch 도구를 시도했지만 그것은 나에게서 작동하지 않았다. 인터넷 익스플로러 9와 10은 여전히 불평했다.
I found this nice Git gist and it solved my issues. https://gist.github.com/stefanmaric/a5043c0998d9fc35483d
Just copy and paste the code in your css.
I recently encountered this issue with .eot and .otf fonts producing the CSS3114 and CSS3111 errors in the console when loading. The solution that worked for me was to use only .woff and .woff2 formats with a .ttf format fallback. The .woff formats will be used before .ttf in most browsers and don't seem to trigger the font embedding permissions issue (css3114) and the font naming incorrect format issue (css3111). I found my solution in this extremely helpful article about the CSS3111 and CSS3114 issue, and also reading this article on using @font-face.
note: This solution does not require re-compiling, converting or editing any font files. It is a css-only solution. The font I tested with did have .eot, .otf, .woff, .woff2 and .svg versions generated for it, probably from the original .ttf source which did produce the 3114 error when i tried it, however the .woff and .woff2 files seemed to be immune to this issue.
This is what DID work for me with @font-face:
@font-face {
font-family: "Your Font Name";
font-weight: normal;
src: url('your-font-name.woff2') format('woff2'),
url('your-font-name.woff') format('woff'),
url('your-font-name.ttf') format('truetype');
}
This was what triggered the errors with @font-face in IE:
@font-face {
font-family: 'Your Font Name';
src: url('your-font-name.eot');
src: url('your-font-name.eot?#iefix') format('embedded-opentype'),
url('your-font-name.woff2') format('woff2'),
url('your-font-name.woff') format('woff'),
url('your-font-name.ttf') format('truetype'),
url('your-font-name.svg#svgFontName') format('svg');
}
This works for me:
@font-face {
font-family: FontName;
src: url('@{path-fonts}/FontName.eot?akitpd');
src: url('@{path-fonts}/FontName.eot?akitpd#iefix') format('embedded-opentype'),
url('@{path-fonts}/FontName.ttf?akitpd') format('truetype'),
url('@{path-fonts}/FontName.woff?akitpd') format('woff'),
url('@{path-fonts}/FontName.svg?akitpd#salvage') format('svg');
}
참고URL : https://stackoverflow.com/questions/5587956/make-adobe-fonts-work-with-css3-font-face-in-ie9
'Programing' 카테고리의 다른 글
| 언제 JavaScript에서 '거짓을 반환'해야합니까? (0) | 2020.07.01 |
|---|---|
| C ++에서 포인터를 참조로 캐스트 / 변환하는 방법 (0) | 2020.07.01 |
| 유형 삭제 기술 (0) | 2020.07.01 |
| Matlab에서 bsxfun을 사용하는 것이 언제 최적입니까? (0) | 2020.07.01 |
| Enter 키를 사용하여 MS-DOS 배치 파일 일시 중지 (0) | 2020.07.01 |