ডাউনলোড করা ফন্টটি ডিকোড করতে ব্যর্থ হয়েছে, ওটিএস পার্সিং ত্রুটি: অবৈধ সংস্করণ ট্যাগ + রেলস 4 4

Question

আমি সম্পদের প্রাক-সংকলন করছি এবং উত্পাদন মোডে অ্যাপ্লিকেশন চালাচ্ছি। সংকলনের পরে যখন আমি আমার সূচী পৃষ্ঠাটি লোড করি তখন আমি ক্রোম কনসোলটিতে অনুসরণের সতর্কতা পেয়েছি:

Failed to decode downloaded font: http://localhost:3000/fonts/ionicons.ttf?v=2.0.0
prospects:1 OTS parsing error: invalid version tag
Failed to decode downloaded font: http://localhost:3000/fonts/ionicons.woff?v=2.0.0
prospects:1 OTS parsing error: invalid version tag

ইস্যুটি এটির স্কোয়ারগুলি দেখানোর পরিবর্তে আইকনগুলি লোড করছে না ।

আমরা কাস্টম ফন্ট ব্যবহার করেছি এবং কোডটি হ'ল:

@font-face {
  font-family: 'icomoon';
  src: font-url('icomoon.eot');
  src: font-url('icomoon.eot?#iefix') format('embedded-opentype'),
       font-url('icomoon.ttf') format('truetype'),
       font-url('icomoon.woff') format('woff'),
       font-url('icomoon.svg#icomoon') format('svg');
  font-weight: normal;
  font-style: normal;
}

আমি জানি না আমার শেষ থেকে কি অনুপস্থিত। আমি অনেক অনুসন্ধান করেছি এবং সমাধানের চেষ্টাও করেছি কিন্তু কোনও সাফল্য পাইনি development বিকাশ মোডে এটির কাজটি ঠিক আছে তবে কেন জানি না এটির প্রডাকশন মোডে বর্গক্ষেত্রটি প্রদর্শিত হচ্ছে।

Comments

এটি বেশ কয়েকটি জিনিস হতে পারে: চরিত্রের এনকোডিংটি ভুল হতে পারে বা হরফ নিজেই দূষিত হতে পারে। আপনি ফন্ট বুক বা অনুরূপ ফন্ট খুলতে পারেন? একটি দ্রুত গুগল ক্রোমিয়াম ব্রাউজার সংস্করণ 45: কোড. google.com/p/chromium/issues/detail?id=545924

— ক্রেগ

আপনি কি সমস্যার সমাধান করতে পেরেছিলেন?

— কোডার

আমার ক্ষেত্রে, আমাকে ক্লাউডফ্লেয়ার ক্যাশে শুদ্ধ করতে হবে এবং সময়টি সমস্যার সমাধান করতে কয়েক মিনিট অপেক্ষা করতে হবে!

— হোসেইনঘনবাড়ি

আমারও একই সমস্যা ছিল এবং আমি জানতে পেরেছিলাম যে ক্রোমের জন্য ওয়াফ করার আগে আমার woff2 ফন্ট থাকা দরকার।

— jcubic

Answer 1

আমি ঠিক একই ত্রুটি পেয়েছি, এবং আমার ক্ষেত্রে এটি @font-faceঘোষণার জন্য একটি ভুল পথ বলে প্রমাণিত হয়েছে । ওয়েব ইন্সপেক্টর কখনই কোনও 404 এর সাথে অভিযোগ করেনি যেহেতু আমরা যে ডিভ সার্ভারটি ব্যবহার করছি (লাইভ-সার্ভার) কোনও 404: এর ডিফল্ট সূচক html পরিবেশন করার জন্য কনফিগার করা হয়েছিল। আপনার সেটআপ সম্পর্কে কোনও বিবরণ না জেনে এটি সম্ভবত অপরাধী হতে পারে।

Comments

যদি এটি পুনঃনির্দেশের কারণ হয় তবে আপনি ফাইল এক্সটেনশান দ্বারা এটি ফিল্টার করতে পারবেন রিরাইটরুল! \। (Js | gif | css | jpg | otf | eot | png) red / redirect [R = 301, L]

— خوف থেকে

আমার ক্ষেত্রে, এএসপি.এনইটি এমভিসি বান্ডিলিং এবং মিনিফিকেশন মূলত সিএসএসের অবস্থানের আপেক্ষিক পথগুলি পরিবর্তন না করে পরিবর্তন করেছে। ইতিমধ্যে- CssRewriteUrlTransformমিনফাইড ফাইলটি মুছতে এবং একটি বান্ডেলকনফিগ ব্যবহার করতে হয়েছিল।

— সিনজাই

Answer 2

আইআইএস-এ সার্ভার এবং .NET 4 / 4.5 হিসাবে চলতে থাকলে এটি ওয়েবকনফিগের মাইম / ফাইল এক্সটেনশন সংজ্ঞা অনুপস্থিত থাকতে পারে - এর মতো:

<system.webServer>
	<staticContent>
      <remove fileExtension=".eot" />
      <mimeMap fileExtension=".eot" mimeType="application/vnd.ms-fontobject" />
      <remove fileExtension=".ttf" />
      <mimeMap fileExtension=".ttf" mimeType="application/octet-stream" />
      <remove fileExtension=".svg" />
      <mimeMap fileExtension=".svg" mimeType="image/svg+xml" />
      <remove fileExtension=".woff" />
      <mimeMap fileExtension=".woff" mimeType="application/font-woff" />
    </staticContent>
</system.webServer>

Answer 3

আমি একই সমস্যা ছিল।, OTS parsing error: Failed to convert WOFF 2.0 font to SFNT (index):1 Failed to decode downloaded font: http://dev.xyz/themes/custom/xyz_theme/fonts/xyz_rock/rocksansbold/Rock-SansBold.woff2

আপনার ফন্টটি প্রতিশ্রুতি দেওয়ার সময় যদি আপনি এই ত্রুটি বার্তাটি পেয়ে থাকেন তবে এটি .gitattributes " warning: CRLF will be replaced by LF" এর সাথে একটি সমস্যা is

এর সমাধানটি হ'ল .gitattributes এর সাথে যে কোনও ফন্ট যুক্ত করে

*.ttf     -text diff
*.eot     -text diff
*.woff    -text diff
*.woff2   -text diff

তারপরে আমি দূষিত ফন্ট ফাইলগুলি মুছলাম এবং নতুন ফন্ট ফাইলগুলি পুনরায় প্রয়োগ করেছি এবং দুর্দান্ত কাজ করছি।

Comments

সেই ফাইলটি কোথায় থাকে? এমনকি ব্রাউজারটিও জানতে পারবে যে এটি বিদ্যমান? কিভাবে?

— ওমর

@ ওমর ফাইলটি আপনার মূল ডিরেক্টরিতে থাকা উচিত এবং ব্রাউজারের সাথে তার কোনও সম্পর্ক নেই। এটি বর্ণনা করে যে গিটটি বিভিন্ন ফাইল ফর্ম্যাটে লাইন এন্ডিং পরিচালনা করতে চলেছে। গিট লাইনের শেষগুলি পরিবর্তন করার চেষ্টা করে কিছু ফাইল টাইপগুলি দূষিত করতে পারে।

— এলিয়ট্রেগান

Answer 4

চেষ্টা

@font-face {
  font-family: 'icomoon';
  src: asset-url('icomoon.eot');
  src: asset-url('icomoon.eot?#iefix') format('embedded-opentype'),
       asset-url('icomoon.ttf') format('truetype'),
       asset-url('icomoon.woff') format('woff'),
       asset-url('icomoon.svg#icomoon') format('svg');
  font-weight: normal;
  font-style: normal;
}

এবং আপনার ফাইলটির নাম পরিবর্তন করুন application.css.scss

Answer 5

আমার একটি দূষিত ফন্ট ছিল, যদিও এটি সমস্যা ছাড়াই লোড হচ্ছে বলে মনে হয়েছিল এবং ক্রোম ডেভোটোলগুলির উত্সগুলির অধীনে প্রদর্শিত হয়েছিল, বাইট গণনাটি সঠিক ছিল না, তাই আমি আবার ডাউনলোড করেছি এবং এটি সমাধান করেছে resolved

Comments

Woff2 ব্যবহার করে, অনলাইন রূপান্তরকারী ব্যবহার করার পরে আমার এই সমস্যা হয়েছিল। কমান্ড লাইন woff2 রূপান্তরকারী ব্যবহার করার প্রয়োজন ( হোমব্রিউয়ের মাধ্যমে উপলব্ধ)

— রব-

Answer 6

@ ফন্ট-ফেস এ স্রেফ স্টেট ফর্ম্যাট নীচে হিসাবে:

@font-face {
  font-family: 'Some Family';
  src: url('/fonts/fontname.ttf') format('ttf'); /* and this for every font */
}

Answer 7

আমার একই সমস্যা ছিল এবং তা হ'ল এই ফাইলটি টেক্সট হিসাবে গিরিটি আচরণ করে। সুতরাং বিল্ড এজেন্টগুলিতে ফাইলগুলি পরীক্ষা করার সময়, বাইনারি রক্ষণ করা হয়নি।

এটি আপনার .gitattributesফাইলে যুক্ত করুন এবং চেষ্টা করুন।

*.eot binary
*.ttf binary
*.woff binary
*.woff2 binary

Answer 8

ব্যবহার করার সময় angular-cli, এটি আমার পক্ষে কাজ করে:

<?xml version="1.0" encoding="utf-8"?>
<configuration>
    <system.webServer>
        <staticContent>
            <remove fileExtension=".eot" />
            <mimeMap fileExtension=".eot" mimeType="application/vnd.ms-fontobject" />
            <remove fileExtension=".ttf" />
            <mimeMap fileExtension=".ttf" mimeType="application/octet-stream" />
            <remove fileExtension=".svg" />
            <mimeMap fileExtension=".svg" mimeType="image/svg+xml" />
            <remove fileExtension=".woff" />
            <mimeMap fileExtension=".woff" mimeType="application/font-woff" />
            <remove fileExtension=".woff2" />
            <mimeMap fileExtension=".woff2" mimeType="application/font-woff2" />
            <remove fileExtension=".json" />
            <mimeMap fileExtension=".json" mimeType="application/json" />
        </staticContent>
        <rewrite>
            <rules>
                <rule name="AngularJS" stopProcessing="true">
                    <match url="^(?!.*(.bundle.js|.bundle.js.map|.bundle.js.gz|.bundle.css|.bundle.css.gz|.chunk.js|.chunk.js.map|.png|.jpg|.ico|.eot|.svg|.woff|.woff2|.ttf|.html)).*$" />
                    <conditions logicalGrouping="MatchAll">
                    </conditions>
                    <action type="Rewrite" url="/"  appendQueryString="true" />
                </rule>
            </rules>
        </rewrite>
    </system.webServer>
</configuration>

Comments

আপনি যদি বলতে পারেন যে এটি দুর্দান্ত হবে তবে আপনি কোন ফাইলের জন্য এগুলি যুক্ত করবেন?

— সাইয়্যাফ ফারুক

— ওয়েবকনফিগটি

আমি কৌণিক-ক্লাইপ প্রকল্পে একটি ওয়েব কোডফিগ ফাইল ফাইল করতে পারিনি। সংস্করণটি 1.3.0 ব্যবহার করে। কোন সুত্র?

— সাইয়্যাফ ফারুক

আপনি যখন আপনার ক্লায়েন্ট অ্যাপ্লিকেশনটি আইআইএস-এ অন্তর্ভুক্ত করেন তখন ওয়েবকনফিগটি কেবলমাত্র ব্যবহৃত হয় (ইনজুরি ওয়েব সার্ভিসেস)।

— Skorunka František

Answer 9

আমি নিম্নলিখিত ত্রুটিগুলি পেয়েছিলাম:

Failed to decode downloaded font: [...]/fonts/glyphicons-halflings-regular.woff2
OTS parsing error: invalid version tag

যা সরাসরি থেকে কাঁচা ফাইল ডাউনলোড করার পরে ঠিক করা হয়েছিল:
https://github.com/twbs/bootstrap/blob/master/fouts/glyphicons-halflings-regular.woff2

সমস্যাটি ছিল ফাইলটি ডাউনলোড করার সময় একটি প্রক্সি ত্রুটি হয়েছিল (এটিতে HTML ত্রুটি বার্তা রয়েছে)।

Comments

আমি নিজে ফাইলটি যাচাই করার জন্য ভাবি নি .. এই লিঙ্কটি সরাসরি ডাউনলোড না করার বিষয়টি নিশ্চিত করুন ("লিঙ্কটি সংরক্ষণ করুন"), তবে এটি প্রবেশ করুন এবং "ডাউনলোড" বোতামটি ব্যবহার করুন।

— ওমাডন

Answer 10

গিটহাবের নীচের ঠিকানায় যান এবং প্রতিটি ফন্টআউভিজ ফাইল ডাউনলোড করুন।

https://github.com/FortAwesome/font-awesome-sass/tree/master/assets/fonts/font-awesome

... তবে লিঙ্কটি ডান-ক্লিক ও সংরক্ষণের পরিবর্তে প্রতিটি ফাইলের উপর ক্লিক করুন এবং সেভ করার জন্য 'ডাউনলোড' বোতামটি ব্যবহার করুন।

আমি দেখতে পেয়েছি যে লিঙ্কটি একটি HTML পৃষ্ঠা ডাউনলোড করা হিসাবে সংরক্ষণ করা হচ্ছে এবং এটি ফন্টআউজিবল ফাইল বাইনারি নয়।

একবার আমার কাছে সমস্ত বাইনারি ছিল এটি আমার জন্য কাজ করেছিল।

Answer 11

আমার সমস্যাটি হ'ল আমি দুটি ফন্ট ঘোষণা করছি, এবং এসএসএস মনে হয় আপনি ফন্টের নামটি ঘোষণা করেন।

আপনার পরে @font-face{} আপনি ঘোষণা করতে হবে $my-font: "OpenSans3.0 or whatever";

এবং এটি প্রতিটি ফন্ট-মুখের জন্য।

:-)

Comments

আপনি ফন্ট-পরিবার সম্পর্কে কথা বলছেন?

— নাদভ বি

এখনই মনে করতে পারছি না, দুঃখিত :-)

— এন্টোইন

Answer 12

জন্য কৌণিক-CLI এবং webpack ব্যবহারকারীদের আমি সন্দেহভাজন কিছু সমস্যার নেই যখন, সিএসএস ফাইলে ফন্ট আমদানি তেমনি URL অবস্থানটি নিম্নলিখিত হিসাবে একক উদ্ধৃতি দিয়ে এনকোড প্রদান করুন -

@font-face {
font-family: 'some_family';
src: url('./assets/fonts/folder/some_family-regular-webfont.woff2') format('woff2'),
     url('./assets/fonts/folder/some_family-regular-webfont.woff') format('woff');
font-weight: normal;
font-style: normal;
}

এই পোস্টটি পুরানো হতে পারে, তবে এটিই আমার জন্য কার্যকর সমাধান।

Answer 13

আমি একই সমস্যা ছিল।

ফন্টের সংস্করণ (উদাঃ ?v=1.101) ফন্টের ইউআরএলএস যুক্ত করা কৌশলটি করা উচিত;)

@font-face {
    font-family: 'Open Sans';
    font-style: normal;
    font-weight: 600;
    src: url('../fonts/open-sans-v15-latin-600.eot?v=1.101'); /* IE9 Compat Modes */
    src: local('Open Sans SemiBold'), local('OpenSans-SemiBold'),
    url('../fonts/open-sans-v15-latin-600.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
    url('../fonts/open-sans-v15-latin-600.woff2?v=1.101') format('woff2'), /* Super Modern Browsers */
    url('../fonts/open-sans-v15-latin-600.woff?v=1.101') format('woff'), /* Modern Browsers */
    url('../fonts/open-sans-v15-latin-600.ttf') format('truetype'), /* Safari, Android, iOS */
    url('../fonts/open-sans-v15-latin-600.svg#OpenSans') format('svg'); /* Legacy iOS */
}

ফন্টের টিটিএফ সংস্করণে (ডান মাউস ক্লিক) ক্লিক করা এবং প্রসঙ্গ মেনুতে "তথ্য প্রাপ্ত করুন" (ম্যাক ওএসএক্স) "বৈশিষ্ট্য" (উইন্ডোজ) নির্বাচন করা ফন্ট সংস্করণ অ্যাক্সেসের জন্য পর্যাপ্ত হওয়া উচিত।

Answer 14

যদি আপনি ক্রোম ব্যবহার করে থাকেন তবে নীচে প্রদর্শিত হিসাবে আপনার ফন্টের একটি ওপেনটাইপ (ওটিএফ) সংস্করণ যুক্ত করার চেষ্টা করুন:

    ...
     url('icomoon.otf') format('opentype'),
    ...

চিয়ার্স!

Answer 15

আপনি যদি বুটস্ট্র্যাপ ব্যবহার করেন তবে বুটস্ট্র্যাপ সিএসএস ( bootstrap.min.css) ফাইল এবং ফন্ট ফাইল আপডেট করুন। আমি এই সমাধানটি দিয়ে আমার সমস্যার সমাধান করেছি।

Answer 16

আমি আইআইএস-এর সাথে এএসপি.এনইটি ব্যবহার করছি এবং এটি প্রমাণিত হয়েছে যে কেবল আইআইএস-এ আমার টাইপ যুক্ত করতে হবে: '.ওফফ 2' / 'অ্যাপ্লিকেশন / ফন্ট-ওফ'

Answer 17

প্রচুর অন্যান্য পন্থা, এবং প্রচুর পুনরায় ইনস্টল ও চেক করার চেষ্টা করার পরে, আমি ক্রোম (ক্যাশেড চিত্র এবং ফাইল) থেকে ব্রাউজিং ডেটা সাফ করে এবং তারপরে পৃষ্ঠাটি রিফ্রেশ করে সমস্যাটি ঠিক করেছি।

Answer 18

আমি যখন ওপেন এবং সংরক্ষণ করেছি .woffএবং তখন আমার একই সমস্যা হয়েছিল । বিকল্পের woff2সাথে সাব্লাইম টেক্সটের মাধ্যমে ফাইলগুলি । আমি কেবল ফাইলগুলিকে সাবলেটতে না খালি ফন্ট ফোল্ডারে অনুলিপি করেছি এবং সমস্যাটি সমাধান হয়ে গেছে।EditorConfigend_of_line = lf

Answer 19

অন্য উত্তরগুলি যদি কাজ না করে তবে:

1. .htaccess ফাইলটি পরীক্ষা করুন

   # Fonts
# Add correct content-type for fonts
   

   AddType application/vnd.ms-fontobject .eot
AddType application/x-font-ttf .ttf
AddType application/x-font-opentype .otf
AddType application/x-font-woff .woff
AddType application/x-font-woff2 .woff2
AddType image/svg+xml .svg
   

2. সাফ সার্ভার ক্যাশে

3. ব্রাউজার ক্যাশে ও পুনরায় লোড করুন

Answer 20

আপনার ফন্টের সিএসএস ফাইল পরীক্ষা করুন। (fontawesome.css / fontawesome.min.css) , আপনি এটি দেখতে পাবেন:

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

আপনি আপনার ফন্টের ফাইল এক্সটেনশনের নামের পরে সংস্করণ ট্যাগটি দেখতে পাবেন । ভালো লেগেছে:

-v = 4.6.3

আপনাকে কেবল এই সিএসএস ফাইল থেকে এই ট্যাগটি সরাতে হবে। এটি অপসারণের পরে, আপনার ফন্ট ফোল্ডারে যেতে হবে এবং আপনি দেখতে পাবেন:

এবং, এই ফন্টের ফাইলগুলি তৈরি করুন, আপনাকে কেবল ফাইলের নাম থেকে সংস্করণ ট্যাগ -v = 4.6.3 অপসারণ করতে হবে।

তারপরে, সমস্যাটি স্ল্যাভ হয়ে যাবে।

Answer 21

এই ক্ষেত্রে কারও জন্য প্রাসঙ্গিক। আমি ভিজুয়াল স্টুডিওতে ASP.NET এবং C # ব্যবহার করে ঠিক একই ত্রুটি পেয়েছি। আমি যখন ভিজ্যুয়াল স্টুডিওর মধ্যে থেকে অ্যাপটি শুরু করেছি তখন এটি কাজ করেছিল তবে আমি এই সমস্যাটি পেয়েছি। এরই মধ্যে, দেখা গেল যে আমার প্রকল্পের পথে "#" অক্ষর রয়েছে (সি: \ সি # # পরীক্ষামূলক প্রয়োগ)। এটি আইআইএস এক্সপ্রেসকে (সম্ভবত আইআইএসেও) বিভ্রান্ত বলে মনে হচ্ছে এবং এই সমস্যাটি সৃষ্টি করে। আমার ধারণা "#" এএসপি.এনইটি বা নীচে কোথাও একটি সংরক্ষিত চরিত্র। পথ পরিবর্তন করা সহায়তা করেছিল এবং এখন এটি প্রত্যাশার মতো কাজ করে।

ক্রিস্টোফ

Comments

পেয়েছিলাম কি ঠিক সমস্যা?

— নেলিস

codeডাউনলোড করা ফন্টটি ডিকোড করতে ব্যর্থ হয়েছে: লোকালহোস্ট: 52963 / সিএসএস /…

— রেজবাচের

Answer 22

আমাকে কী সাহায্য করেছিল তা হ'ল আমি আদেশটি পরিবর্তন করেছি। .Eot get এর প্রথমে লোড হয়েছে তবে আমার ত্রুটি .eot লোড করার সময় হয়েছিল। সুতরাং আমি woff2 এর জন্য প্রথম এসসিআর হিসাবে .eot কে আঁকলাম এবং ত্রুটিটি চলে গেল।

কোডটি এখন:

@font-face {
  font-family: 'icomoon';
  src:  url('assets/fonts/icomoon.woff2?9h1pxj') format('woff2');
  src:  url('assets/fonts/icomoon.eot?9h1pxj#iefix') format('embedded-opentype'),
    url('assets/fonts/icomoon.woff2?9h1pxj') format('woff2'),
    url('assets/fonts/icomoon.ttf?9h1pxj') format('truetype'),
    url('assets/fonts/icomoon.woff?9h1pxj') format('woff'),
    url('assets/fonts/icomoon.svg?9h1pxj#icomoon') format('svg');
  font-weight: normal;
  font-style: normal;
  font-display: block;
}

এবং হ'ল:

@font-face {
  font-family: 'icomoon';
  src:  url('assets/fonts/icomoon.eot?9h1pxj');
  src:  url('assets/fonts/icomoon.eot?9h1pxj#iefix') format('embedded-opentype'),
    url('assets/fonts/icomoon.woff2?9h1pxj') format('woff2'),
    url('assets/fonts/icomoon.ttf?9h1pxj') format('truetype'),
    url('assets/fonts/icomoon.woff?9h1pxj') format('woff'),
    url('assets/fonts/icomoon.svg?9h1pxj#icomoon') format('svg');
  font-weight: normal;
  font-style: normal;
  font-display: block;
}

Answer 23

For it is fixed by using below statement in app.web.scss
    $fa-font-path:   "../../node_modules/font-awesome/fonts/" !default;
    @import "../../node_modules/font-awesome/scss/font-awesome";

Comments

যদিও এই কোড স্নিপেট একটি ব্যাখ্যা সহ প্রশ্নটি সমাধান করতে পারে, সত্যিই আপনার পোস্টের মান উন্নত করতে সহায়তা করে। মনে রাখবেন যে আপনি ভবিষ্যতে পাঠকদের জন্য প্রশ্নের উত্তর দিচ্ছেন, এবং সেই লোকেরা আপনার কোড পরামর্শের কারণগুলি জানেন না।

— andreas

Answer 24

আমার একই সমস্যা ছিল, এটি আমার জন্য কাজ করেছে https://github.com/webpack/webpack/issues/1468

Comments

কেবল লিঙ্কগুলি পোস্ট করবেন না ... সমাধান সহ উত্তর পোস্ট করুন কারণ ভবিষ্যতে লিঙ্কগুলি হ্রাস পেতে পারে।

— অরনাভ এম