Подтвердить что ты не робот

Щебетать глифов-бутстрапов не отображаются в режиме выпуска 404

Я работаю над проектом в ASP.NET MVC 4, и я сделал следующие шаги:

  • Загруженный загрузочный твиттер из http://blog.getbootstrap.com/2013/12/05/bootstrap-3-0-3-released/

  • Установите действие сборки файлов шрифтов в Content (файлы находятся в папке ~/Content/font)

    glyphicons-halflings-regular.eot
    glyphicons-halflings-regular.svg
    glyphicons-halflings-regular.ttf
    glyphicons-halflings-regular.woff
    
  • Добавлен в RouteConfig.cs

    routes.IgnoreRoute( "{folder}/{* pathInfo}", new {folder = "Content" });

  • Добавлены следующие элементы в Web.config

    <?xml version="1.0" encoding="UTF-8"?>
    <system.webServer>
       <staticContent>
           <remove fileExtension=".eot" />
           <remove fileExtension=".ttf" />
           <remove fileExtension=".otf"/>
           <remove fileExtension=".woff"/>
           <mimeMap fileExtension=".eot" mimeType="application/vnd.ms-fontobject" />
           <mimeMap fileExtension=".ttf" mimeType="font/ttf" />
           <mimeMap fileExtension=".otf" mimeType="font/otf" />
          <mimeMap fileExtension=".woff" mimeType="font/x-woff" />
       </staticContent>
    </system.webServer>
    
  • Включен следующий код в BundleConfig.cs

    bundles.Add(new StyleBundle("~/bundles/maincss")
                        .Include("~/Content/bootstrap/bootstrap.css")
                        .Include("~/Content/bootstrap/bootstrap-theme.css")
                        .Include("~/Content/hbl-full.css"));
    

    Также судимый со следующим кодом

    IItemTransform cssFixer = new CssRewriteUrlTransform();
    
    bundles.Add(new StyleBundle("~/bundles/maincss")
                        .Include("~/Content/bootstrap/bootstrap.css", cssFixer)
                        .Include("~/Content/bootstrap/bootstrap-theme.css", cssFixer)
                        .Include("~/Content/hbl-full.css", cssFixer));
    
  • Вызывается в основном Layout.cshtml

    @Styles.Render( "~/пучки/maincss" )

Изображения в локальном хосте отображаются нормально, но когда я нажимаю код для выпуска сервера, я могу видеть только квадрат, а не значок, а на вкладке "Консоль Chrome" я получаю

GET http://domain.apphb.com/fonts/glyphicons-halflings-regular.woff 404 (не найдено): 1

GET http://domain.apphb.com/fonts/glyphicons-halflings-regular.ttf 404 (не найдено): 1

GET http://domain.apphb.com/fonts/glyphicons-halflings-regular.svg 404 (не найдено): 1

Спасибо.

4b9b3361

Ответ 1

У меня была эта проблема, и я обнаружил, что это происходит из-за минимизации при создании в режиме выпуска.

Вместо того, чтобы загружать файлы вручную с сайта начальной загрузки и настраивать пакет, я использую пакет nuget, который делает это для меня.

Если вы хотите сделать это, выполните следующие шаги.

Выполните следующую команду для установки Bootstrap:

Install-Package Twitter.Bootstrap.MVC

Загружает все файлы загрузочных файлов и включает в себя предопределенную конфигурацию пакета Bootstrap:

public class BootstrapBundleConfig
{
    public static void RegisterBundles()
    {
        // Add @Styles.Render("~/Content/bootstrap") in the <head/> of your _Layout.cshtml view
        // For Bootstrap theme add @Styles.Render("~/Content/bootstrap-theme") in the <head/> of your _Layout.cshtml view
        // Add @Scripts.Render("~/bundles/bootstrap") after jQuery in your _Layout.cshtml view
        // When <compilation debug="true" />, MVC4 will render the full readable version. When set to <compilation debug="false" />, the minified version will be rendered automatically
        BundleTable.Bundles.Add(new ScriptBundle("~/bundles/bootstrap").Include("~/Scripts/bootstrap.js"));
        BundleTable.Bundles.Add(new StyleBundle("~/Content/bootstrap").Include("~/Content/bootstrap.css"));
        BundleTable.Bundles.Add(new StyleBundle("~/Content/bootstrap-theme").Include("~/Content/bootstrap-theme.css"));
    }
}

Вышеупомянутые также включают комментарии, описывающие, как отображать пакеты.

Я думаю, что исходная ошибка шрифта 404 была вызвана тем, что папка шрифтов находилась на другом уровне до того, что указано в minified css.

Если вы предпочитаете сохранить свое текущее решение, единственным способом исправить 404 было скопировать папку шрифтов в корень веб-приложения.

Чтобы протестировать его локально, просто удалите debug="true" из своей веб-конфигурации, чтобы сохранить развертывание в AppHarbor.

Ответ 2

Копирование папки шрифтов в корень веб-приложения и изменение типов mime в web.config на

<?xml version="1.0" encoding="UTF-8"?>
<system.webServer>
  <staticContent>
    <remove fileExtension=".eot" />
    <remove fileExtension=".ttf" />
    <remove fileExtension=".otf"/>
    <remove fileExtension=".woff"/>
    <mimeMap fileExtension=".eot" mimeType="application/vnd.ms-fontobject" />
    <mimeMap fileExtension=".ttf" mimeType="font/ttf" />
    <mimeMap fileExtension=".otf" mimeType="font/otf" />
    <mimeMap fileExtension=".woff" mimeType="application/font-woff" />
  </staticContent>
</system.webServer>

исправил проблему для меня. Обратите внимание, что .woff mimeType отличается от вопроса в вопросе.

Ответ 3

Вот как я это решил - я использую MVC5 и Bootstrap 3.1.1.

У меня есть мои файлы, организованные в проекте следующим образом:

/Content/Bootstrap/bootstrap.css
                   bootstrap.min.css
/Content/fonts/glyphicons-halflings-regular.eot
               glyphicons-halflings-regular.svg
               glyphicons-halflings-regular.ttf
               glyphicons-halflings-regular.woff

Затем я добавил еще один уровень для своего виртуального пути в конфигурации bundle config

bundles.Add(new StyleBundle("~/Content/site/css").Include(
    "~/Content/bootstrap/bootstrap.css",
    "~/Content/styles/site.css"
));

Раньше я использовал ~/Content/css

И в представлении ...

@Styles.Render("~/Content/site/css")

Это сработало, но у меня все еще есть 404 на одном из шрифтов... поэтому я добавил решение Giles.

<?xml version="1.0" encoding="UTF-8"?>
<system.webServer>
    <staticContent>
        <remove fileExtension=".eot" />
        <remove fileExtension=".ttf" />
        <remove fileExtension=".otf"/>
        <remove fileExtension=".woff"/>
        <mimeMap fileExtension=".eot" mimeType="application/vnd.ms-fontobject" />
        <mimeMap fileExtension=".ttf" mimeType="font/ttf" />
        <mimeMap fileExtension=".otf" mimeType="font/otf" />
        <mimeMap fileExtension=".woff" mimeType="application/font-woff" />
        <mimeMap fileExtension=".woff2" mimeType="application/font-woff2" />
    </staticContent>
</system.webServer>

Ответ 4

У меня была та же проблема, с использованием веб-сервера IIS 7.5.

Решение заключалось в том, чтобы добавить .woff в список расширений имени файла с приложением MIME-типа/октетом-потоком на веб-сервере.

Вы также можете добиться того же в web.config:

<staticContent>
    <remove fileExtension=".woff" />
    <mimeMap fileExtension=".woff" mimeType="application/octet-stream" />
</staticContent>

Ответ 5

У меня была такая же проблема. Я действительно не знаю, почему, но если я удалю файл bootstrap.min.css и установлю CssRewriteUrlTransform на комплекте, все работает. Я использую bootstrap v3.1.1

EDIT: После некоторого исследования решение определено здесь: CssRewriteUrlTransform не вызывается Таким образом, удаление bootstrap.min.css или ссылка на bootstrap.min.css вместо bootstrap.css заставят связать/минимизировать файл и поэтому он вызывается CssRewriteUrlTransform.

Ответ 6

В IgnoreRoute вы указали папку "Содержимое". Попробуйте также добавить один для шрифтов ", так как это то, что вы запрашиваете.

routes.IgnoreRoute("{folder}/{*pathInfo}", new { folder = "fonts" });

Ответ 7

У меня была та же проблема. Я обошел его, используя bootstrap CDN.