How to solve glyphicons-halflings-regular.woff2 Err_Aborted issue in ASP.Net MVC 5

Question

So I have a project where I want to change the theme of BootStrap. So, I took theme from BootSwatch and the theme is selected is Lumen. Now in my Bundle.Config file, I made below changes.

  bundles.Add(new StyleBundle("~/Content/css").Include(
                      //"~/Content/bootstrap.css",
                      "~/Content/bootstrap-lumen.css",
                      "~/Content/superslides.css",
                      "~/Content/site.css"));
        }

Now as soon as I start using the Lumen Theme, I get error (in dev tool) as below:

P.S: This does not happen when I use normal BootStrap theme. I looked into SO Answer. But it talks about making IIS changes and all. But my problem only occurs when I use LUMEN theme. How to get rid of this issue?

Reyan Chougle · Accepted Answer · 2017-11-22T10:31:49.057

49

I have downloaded the missing files from here and added those in fonts folder of my project.

Then added these lines within <system.webServer> section in web.config file of my project:

<staticContent>
  <remove fileExtension=".woff" />
  <mimeMap fileExtension=".woff" mimeType="application/x-font-woff" />
  <remove fileExtension=".woff2" />
  <mimeMap fileExtension=".woff2" mimeType="application/font-woff2" />
</staticContent>

In your case, download glyphicons-halflings-regular.woff2 file.

edited Nov 22 '17 at 10:31

answered Oct 01 '17 at 08:08

Reyan Chougle

4,917
2
30
57

2

Worked like a charm. Thanks! – Unbreakable Oct 03 '17 at 01:49
1

Perfect! Thanks! – monstro Oct 09 '17 at 14:11
1

smooth! we were getting this error almost for an year, nobody did anything, today I finally wanted to fix it and you fixed for me – ihavenokia Nov 23 '17 at 17:57
1

The current standard mime types are `application/font-woff` and `font/woff2`, see https://www.w3.org/TR/WOFF/#appendix-b and https://www.w3.org/TR/WOFF2/#IMT – Sacha K Mar 02 '18 at 11:09
This breaks my solution completely. – AtLeastTheresToast Aug 24 '21 at 11:59

score 15 · Answer 2 · answered Feb 05 '18 at 16:36

15

As an alternate to Reyan Chougle's answer, this can also be fixed through IIS:

Open IIS, click on your site.

In the middle section, under the grouping IIS, double-click MIME Types

Edit or add woff and/or woff2 extensions:
- .woff -> application/x-font-woff
- .woff2 -> application/font-woff2

NOTE: Tested on IIS 8.5 in the Chrome web browser

answered Feb 05 '18 at 16:36

TylerBUrquhart

307
3
12

2

I'm confused as to why I'm being down voted. Can anyone that is going to at least explain why? – TylerBUrquhart Feb 08 '18 at 12:58
2

It shouldn't be downvoted. It is a potential fix too. – johnny Mar 16 '18 at 17:16

score 1 · Answer 3 · answered May 16 '19 at 07:14

I was facing the same issue.

In first attempt, I have added the MIME type (font-woff2) directly at the IIS server, it worked. However after deployment(CI/CD) MIME type automatically got removed.

In Second attempt, I have added staticContent tags in web.config and it worked like a permanent fix.

score 1 · Answer 4 · answered Dec 09 '20 at 16:56

1

Try adding the missing file via CDN:

<link href="//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap-glyphicons.css" rel="stylesheet">

answered Dec 09 '20 at 16:56

Harita Ravindranath

390
5
7

score 0 · Answer 5 · answered Nov 08 '17 at 15:38

I had a similar issue with WordPress. I had a folder on the root of the directory with a path to the font, and for some reason, I got net::ERR_ABORTED and 404 (Not Found). So what I did was to move those fonts to wp-content/plugins where other fonts were defined such as FontAwesome... and it works!

How to solve glyphicons-halflings-regular.woff2 Err_Aborted issue in ASP.Net MVC 5

5 Answers5

Linked