ไม่สามารถถอดรหัสแบบอักษรที่ดาวน์โหลด

นี่เป็นข้อผิดพลาดที่ฉันได้รับใน Chrome และน่าเสียดายที่การค้นหาไม่ได้ให้ผลลัพธ์ที่มากนัก ตัวอักษรปรากฏอย่างถูกต้อง อย่างไรก็ตามฉันยังคงได้รับข้อผิดพลาด / คำเตือนนี้ โดยเฉพาะอย่างยิ่งนี่คือคำเตือนแบบเต็ม:

"ไม่สามารถถอดรหัสแบบอักษรที่ดาวน์โหลด: http: // localhost: 8000 / แอพ / แบบอักษร / Lato / "

CSS ของฉันคือ:

@font-face {
    font-family:"Lato";
    src: url("../fonts/Lato/");
}

html, body {
    font-family:'Lato';
}

ฉันไม่เข้าใจ มีการใช้แบบอักษรอย่างถูกต้อง แต่มีการเตือนอยู่เสมอ ความพยายามในการใช้Sans-Serifทำให้แบบอักษรเปลี่ยนกลับเป็นแบบอักษรเบราว์เซอร์ปกติดังนั้นอาจเป็นได้ แต่ฉันไม่แน่ใจและแม้หลังจากการค้นหาฉันไม่พบอะไรเลย ขอบคุณ!

แก้ไข

มีไฟล์ตัวอักษรต่าง ๆ ทั้งหมดนี้มาจากตระกูลเดียวกัน ฉันกำลังพยายามโหลดทั้งหมด .ttfไฟล์ตัวอักษรเป็น ฉันกำลังโหลดพวกเขาจากโฟลเดอร์ท้องถิ่นและมีตัวอักษรไฟล์ต่างๆเช่นLato-Black.ttf, Lato-Bold.ttf, Lato-Italic.ttfฯลฯ

ในกฎ css คุณต้องเพิ่มนามสกุลของไฟล์ ตัวอย่างนี้ด้วยการสนับสนุนที่ลึกที่สุดที่เป็นไปได้:

@font-face {
  font-family: 'MyWebFont';
  src: url('webfont.eot'); /* IE9 Compat Modes */
  src: url('webfont.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('webfont.woff2') format('woff2'), /* Super Modern Browsers */
       url('webfont.woff') format('woff'), /* Pretty Modern Browsers */
       url('webfont.ttf')  format('truetype'), /* Safari, Android, iOS */
       url('webfont.svg#svgFontName') format('svg'); /* Legacy iOS */
}

แก้ไข:

"ไม่สามารถถอดรหัสแบบอักษรที่ดาวน์โหลดได้" หมายความว่าแบบอักษรเสียหายหรือไม่สมบูรณ์ (ตัวชี้วัดที่ขาดหายไปตารางที่จำเป็นบันทึกการตั้งชื่อรายการสิ่งที่เป็นไปได้หลายล้านรายการ)

บางครั้งปัญหานี้เกิดจากตัวอักษรเอง แบบอักษร Google ให้แบบอักษรที่ถูกต้องที่คุณต้องการ แต่ถ้าจำเป็นต้องใช้แบบอักษรฉันต้องใช้Transfonterเพื่อสร้างรูปแบบตัวอักษรทั้งหมด

บางครั้งไคลเอนต์ FTP ที่ทำให้ไฟล์เสียหาย (ไม่ใช่ในกรณีนี้เพราะอยู่ในพีซีในระบบ) ต้องแน่ใจว่าโอนไฟล์เป็นไบนารี่และไม่ใช่ใน ASCII

ฉันประสบปัญหาคล้ายกันใน Visual Studio ซึ่งเกิดจากurl()เส้นทางที่ไม่ถูกต้องไปยังแบบอักษรที่เป็นปัญหา

ฉันหยุดรับข้อผิดพลาดนี้หลังจากเปลี่ยน (เช่น):

@@font-face{
    font-family: "Example Font";
    src: url("/Fonts/ExampleFont.eot?#iefix");

สำหรับสิ่งนี้:

@@font-face{
    font-family: "Example Font";
    src: url("../fonts/ExampleFont.eot?#iefix");

เปลี่ยนจากรูปแบบ ('woff') เป็นรูปแบบ ('font-woff') ช่วยฉันแก้ปัญหานี้ได้แล้วตอนนี้

เพียงแค่เปลี่ยนการเปลี่ยนแปลงเล็กน้อยที่นี่จากคำตอบของ Germano Plebani

 @font-face {
  font-family: 'MyWebFont';
  src: url('webfont.eot'); /* IE9 Compat Modes */
  src: url('webfont.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('webfont.woff2') format('woff2'), /* Super Modern Browsers */
       url('webfont.woff') format('font-woff'), /* Pretty Modern Browsers */
       url('webfont.ttf')  format('truetype'), /* Safari, Android, iOS */
       url('webfont.svg#svgFontName') format('svg'); /* Legacy iOS */
}

โปรดตรวจสอบว่าแหล่งที่มาของเบราว์เซอร์ของคุณสามารถเปิดได้หรือไม่และเป็นประเภทใด

ตรวจสอบให้แน่ใจว่าเซิร์ฟเวอร์ของคุณกำลังส่งไฟล์ฟอนต์ที่มีmime / ประเภทที่ถูกต้องต้อง

ฉันเพิ่งมีปัญหาเดียวกันโดยใช้nginxเพราะบางตัวอักษร mime บางประเภทหายไปจากวานิลลา/etc/nginx/mime.typesไฟล์

ฉันแก้ไขปัญหาการเพิ่มประเภท mime ที่หายไปในตำแหน่งที่ฉันต้องการสิ่งเหล่านี้:

location /app/fonts/ {

  #Fonts dir
  alias /var/www/app/fonts/;

  #Include vanilla types
  include mime.types;

  #Missing mime types
  types  {font/truetype ttf;}
  types  {application/font-woff woff;}
  types  {application/font-woff2 woff2;}
}

คุณสามารถตรวจสอบสิ่งนี้เพื่อขยาย mime.types ใน nginx: การ ขยายไฟล์ nginx mime.types เริ่มต้น

ฉันต้องเพิ่มtype="text/css"ไปยังลิงค์แท็กของฉัน ฉันเปลี่ยนจาก:

<link href="https://fonts.googleapis.com/css?family=Roboto+Condensed:300,400,700" rel="stylesheet">

ถึง:

<link href="https://fonts.googleapis.com/css?family=Roboto+Condensed:300,400,700" rel="stylesheet" type="text/css">

หลังจากที่ฉันเปลี่ยนมันข้อผิดพลาดหายไป

ฉันเพิ่งมีปัญหาเดียวกันและแก้ไขได้โดยการเปลี่ยน

src: url("Roboto-Medium-webfont.eot?#iefix")

ถึง

src: url("Roboto-Medium-webfont.eot?#iefix") format('embedded-opentype')

สำหรับฉันข้อผิดพลาดนี้เกิดขึ้นเมื่อฉันอ้างอิงแบบอักษร Google โดยใช้ https เมื่อฉันเปลี่ยนเป็น http ข้อผิดพลาดก็หายไป (และใช่ฉันลองหลายครั้งเพื่อยืนยันว่าเป็นสาเหตุ)

ดังนั้นฉันจึงเปลี่ยน:

@import url(https://fonts.googleapis.com/css?family=Roboto:300,400,100,500,900);

ถึง:

@import url(http://fonts.googleapis.com/css?family=Roboto:300,400,100,500,900);

บางครั้งปัญหานี้เกิดขึ้นเมื่อคุณอัพโหลด / ดาวน์โหลดแบบอักษรโดยใช้วิธี FTP ที่ไม่ถูกต้อง แบบอักษรต้องเป็น FTP-ed โดยใช้วิธีไบนารีไม่ใช่ ASCII (ขึ้นอยู่กับอารมณ์ของคุณมันอาจจะรู้สึกว่าใช้งานไม่ได้ฮ่า ๆ ) หากคุณ ftp ไฟล์ฟอนต์โดยใช้วิธี ASCII คุณจะได้รับข้อความแสดงข้อผิดพลาดนี้ หากคุณ ftp ไฟล์ของคุณด้วยวิธี 'อัตโนมัติ' และคุณได้รับข้อความแสดงข้อผิดพลาดนี้ให้ลอง ftp บังคับใช้วิธีไบนารี

ฉันมีปัญหาเดียวกันกับตัวอักษร Awesome v4.4 และฉันแก้ไขโดยลบรูปแบบ woff2 ฉันได้รับคำเตือนใน Chrome เท่านั้น

@font-face {
  font-family: 'FontAwesome';
  src: url('../fonts/fontawesome-webfont.eot?v=4.4.0');
  src: url('../fonts/fontawesome-webfont.eot?#iefix&v=4.4.0') format('embedded-opentype'), url('../fonts/fontawesome-webfont.woff?v=4.4.0') format('woff'), url('../fonts/fontawesome-webfont.ttf?v=4.4.0') format('truetype'), url('../fonts/fontawesome-webfont.svg?v=4.4.0#fontawesomeregular') format('svg');
  font-weight: normal;
  font-style: normal;
}

ในกรณีของฉันมันเกิดจากไฟล์เส้นทางที่ไม่ถูกต้องใน. htaccess โปรดตรวจสอบความถูกต้องของเส้นทางไฟล์ของคุณ

สำหรับฉันความผิดพลาดคือลืมใส่ FTP ไปยังโหมดไบนารีก่อนที่จะอัปโหลดไฟล์ฟอนต์

แก้ไข

คุณสามารถทดสอบสิ่งนี้ได้โดยการอัปโหลดข้อมูลไบนารีประเภทอื่นเช่นรูปภาพ หากพวกเขาล้มเหลวในการแสดงนั่นอาจเป็นปัญหาของคุณ

ฉันมีปัญหาเดียวกัน แต่ฉันแก้ไขได้ด้วยการเพิ่ม 'Content-Type': 'application / x-font-ttf' ในส่วนหัวการตอบกลับสำหรับไฟล์. ttf ทั้งหมด

ในกรณีของฉันนี้เกิดจากการสร้างไฟล์แก้ไข SVN ที่รวมการเพิ่มไฟล์ฟอนต์ ชอบมาก

1. เพิ่มไฟล์ฟอนต์จากระบบไฟล์โลคัลลงใน trunk แบบโค่นล้ม
2. ลำต้นทำงานตามที่คาดไว้
3. สร้าง SVN patch ของ trunk trunk เพื่อรวมการเพิ่มไฟล์ฟอนต์
4. นำ patch มาใช้กับสาขาอื่น
5. ไฟล์ฟอนต์ถูกเพิ่มเข้ากับสาขาย่อยที่ถูกโค่นล้ม (และสามารถยอมรับได้) แต่เกิดความเสียหายทำให้เกิดข้อผิดพลาดใน OP

วิธีแก้ไขคืออัพโหลดไฟล์ฟอนต์ลงในสาขาโดยตรงจากระบบไฟล์โลคอลของฉัน ฉันถือว่าสิ่งนี้เกิดขึ้นเพราะไฟล์ปะแก้ SVN ต้องแปลงทุกอย่างเป็นรูปแบบ ASCII และไม่จำเป็นต้องเก็บไบนารีสำหรับไฟล์ฟอนต์ แต่นั่นเป็นเพียงการเดา

ในกรณีของฉัน - ใช้ React กับ Gatsby - ปัญหาได้รับการแก้ไขด้วยการตรวจสอบเส้นทางของฉันอีกครั้ง ฉันใช้ React / Gatsby กับ Sass และไฟล์ต้นฉบับ Gatsby กำลังมองหาแบบอักษรในที่ที่แตกต่างจากไฟล์ที่คอมไพล์ เมื่อฉันทำซ้ำไฟล์ในแต่ละเส้นทางปัญหานี้ก็หายไป

ในกรณีของฉันเมื่อดาวน์โหลดเทมเพลตไฟล์ฟอนต์เป็นไฟล์ที่ว่างเปล่า อาจมีปัญหากับการดาวน์โหลด Chrome ให้ข้อผิดพลาดทั่วไปเกี่ยวกับเรื่องนี้ ตอนแรกฉันคิดว่าวิธีแก้ปัญหาของการเปลี่ยนจากwoffเป็นการfont-woffแก้ไข แต่ทำให้ Chrome เพิกเฉยต่อแบบอักษร วิธีการแก้ปัญหาของฉันคือการค้นหาแบบอักษรทีละคนและดาวน์โหลด / แทนที่พวกเขา

หากคุณใช้ express คุณต้องอนุญาตการแสดงเนื้อหาแบบคงที่โดยเพิ่มสิ่งที่ต้องการ: var server = express (); server.use (express.static ( './ สาธารณะ')); // โดยที่ public คือโฟลเดอร์ root ของแอปที่มีแบบอักษรอยู่ในทุกระดับเช่นสาธารณะ / แบบอักษรหรือสาธารณะ / dist / แบบอักษร ... // หากคุณใช้การเชื่อมต่อ google สำหรับการกำหนดค่าที่คล้ายกัน

ฉันใช้. Net Framework 4.5 / IIS 7

เพื่อแก้ไขมันฉันใส่ไฟล์ Web.config ในโฟลเดอร์ที่มีไฟล์ตัวอักษร

เนื้อหาของ Web.config:

<?xml version="1.0"?>
<configuration>
  <system.web>
    <authorization>
      <allow users="*" />
    </authorization>
  </system.web>
</configuration>

สำหรับฉันมันเป็นปัญหากับไฟล์ lfs ที่ไม่ได้ดาวน์โหลด

git lfs fetch --all

แก้ไขปัญหา

ดูhttps://github.com/git-lfs/git-lfs/issues/325

หากอยู่บนเซิร์ฟเวอร์ (ไม่ใช่ใน localhost) ให้ลองอัปโหลดแบบอักษรด้วยตนเองเพราะบางครั้งไคลเอนต์ FTP (ตัวอย่างเช่น FileZilla) ทำให้ไฟล์เสียหายและอาจทำให้เกิดปัญหาได้ สำหรับฉันฉันอัปโหลดด้วยตนเองโดยใช้อินเทอร์เฟซ Cpanel

กรณีของฉันดูคล้ายกัน แต่แบบอักษรเสียหาย (และไม่สามารถถอดรหัสได้) มันเกิดจากการกำหนดค่าใน Maven การเพิ่ม nonFilteredFileExtension สำหรับส่วนขยายแบบอักษรภายในmaven-resources-pluginช่วยฉันได้:

<plugin>
    <groupId>org.apache.maven.plugins</groupId>
    <artifactId>maven-resources-plugin</artifactId>
    <configuration>
        <nonFilteredFileExtensions>
            <nonFilteredFileExtension>ttf</nonFilteredFileExtension>
            <nonFilteredFileExtension>otf</nonFilteredFileExtension>
            <nonFilteredFileExtension>woff</nonFilteredFileExtension>
            <nonFilteredFileExtension>woff2</nonFilteredFileExtension>
            <nonFilteredFileExtension>eot</nonFilteredFileExtension>
        </nonFilteredFileExtensions>
    </configuration>
</plugin>