Ресурс интерпретируется как таблица стилей, но передается с типом MIME text / html (кажется, не связан с веб-сервером)

С Помощью Угловых?

Это очень важное предостережение, чтобы помнить.

базовый тег должен быть не только в голове, но и в нужном месте.

У меня был мой базовый тег в неправильном месте в голове, он должен быть перед любыми тегами с url-запросами. В основном размещение его в качестве второго тега под заголовком решило это для меня.

<base href="/">

Я написал небольшой пост на нем здесь

У меня также была проблема с этой ошибкой, и я нашел решение. Это не объясняет, почему произошла ошибка, но, похоже, в некоторых случаях она исправлена.

включить косую черту / перед путем к файлу css, например:

<link rel="stylesheet" href="/css/bootstrap.min.css">

попробуй такое <link rel="stylesheet" type="text/css" href="../##/yourcss.css">

здесь ## ваша папка, в которой находится ваш .CSS - файл

не забывайте: .. (две точки).

Я также столкнулся с той же проблемой. И после этого некоторые R&D, я обнаружил, что проблема была с именем файла. Имя фактического файла было "lightgallery.css" но при связывании я набрал "lightGallery.css".

Подробнее:

Он хорошо работал на моем localhost (OS: Windows 8.1 & Server: Apache). Но когда я загрузил свое приложение на удаленный сервер (другой OS & Web-сервер, чем мой localhost), это не работай, дай мне ту же ошибку, что и тебе.

таким образом, проблема заключалась в чувствительности к регистру (в отношении имен файлов) сервера.

@Роб Седжвик дал мне указатель, однако, в моем случае мое приложение была Приложение Spring Boot. Поэтому я просто добавил исключения в свою конфигурацию безопасности для путей к соответствующим файлам...

Примечание - это решение на основе SpringBoot... То, что вам может понадобиться, может отличаться в зависимости от того, какой язык программирования вы используете и/или какой фреймворк вы используете

, однако, отметить, есть;

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

Итак, скажем, некоторые пути к моему статическому контенту, которые вызывали ошибки, следующие;

путь под названием "Плагины"

http://localhost:8080/plugins/styles/css/file-1.в CSS

http://localhost:8080/plugins/styles/css/file-2.в CSS

http://localhost:8080/plugins/js/script-file.js

и путь под названием "страницы"

http://localhost:8080/pages/styles/css/style-1.в CSS

http://localhost:8080/pages/styles/css/style-2.в CSS

http://localhost:8080/pages/js/scripts.js

затем я просто добавляю исключения следующим образом в моей конфигурации безопасности Spring Boot;

@Configuration
@EnableGlobalMethodSecurity(prePostEnabled = true)
@Order(SecurityProperties.ACCESS_OVERRIDE_ORDER)
public class SecurityConfig extends WebSecurityConfigurerAdapter {

    @Override
    protected void configure(HttpSecurity http) throws Exception {
        http.authorizeRequests()
            .antMatchers(<comma separated list of other permitted paths>, "/plugins/**", "/pages/**").permitAll()
            // other antMatchers can follow here
    }

}

Ура!

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

наш сайт загружает CSS-файлы из дистрибутива AWS Cloudfront,который использует ведро S3 в качестве источника. Это конкретное ведро S3 было синхронизировано с сервером Linux под управлением Jenkins. The через s3cmd устанавливает тип содержимого для объекта S3 автоматически на основе того, что говорит ОС (предположительно, на основе расширения файла). По какой-то причине, на нашем сервере, все типы были установлены правильно, кроме .css файлы, которые он дал типа text/plain. В S3, когда вы проверяете метаданные в свойствах файла, вы можете установить тип на все, что хотите. Установка его в text/css позволил нашему сайту правильно интерпретировать файлы как CSS и правильно загружать.

Используя Angular

в моем случае, используя ng-href вместо href решил это за меня.

Примечание :

Я работаю с laravel в качестве бэк-энда

установка анонимных учетных данных аутентификации в Идентификатор Пула Приложений сделал трюк для меня.

мой вопрос был проще, чем все ответы в этом посте.

Мне пришлось настроить IIS для включения статического содержимого.

у меня есть аналогичная проблема в MVC4 с использованием проверки подлинности форм. Проблема была в этой строке в интернете.config,

<modules runAllManagedModulesForAllRequests="true">

Это означает, что каждый запрос, в том числе для статического содержимого, аутентификации.

измените эту строку:

<modules runAllManagedModulesForAllRequests="false">

я столкнулся с тем же самым, с тем же самым .htaccess файл для создания красивых URL-адресов. после нескольких часов поисков и экспериментов. я узнал, что ошибка была из-за относительно связывания файлов.

браузер начнет получать один и тот же исходный html-файл для всех css, js и файлов изображений, когда я буду просматривать несколько шагов вглубь сервера.

чтобы противостоять этому, вы можете использовать <base> тег на вашем html источник

<base href="http://localhost/assets/">

и ссылка на такие файлы, как,

<link rel="stylesheet" type="text/css" href="css/style.css" />
<script src="js/script.js"></script>

или использовать абсолютные ссылки для всех ваших файлов.

<link rel="stylesheet" type="text/css" href="http://localhost/assets/css/style.css" />
<script src="http://localhost/assets/js/script.js"></script>
<img src="http://localhost/assets/images/logo.png" />

Я также сталкиваюсь с этой проблемой в последнее время на chrome. Я просто даю абсолютный путь к решению проблемы с файлом CSS.

<link rel="stylesheet" href="<?=SS_URL?>arica/style.css" type="text/css" />

Если вы находитесь на JSP, эта проблема может возникнуть из вашего сопоставления сервлетов. если ваше отображение принимает url по умолчанию, как это:

@WebServlet("/")

затем контейнер интерпретирует Ваш url css и переходит к сервлету вместо перехода к файлу css.

У меня была такая же проблема, я поменял свое отображение и теперь все работает

в случае, если кто-то приходит на этот пост и имеет аналогичную проблему. Я только что испытал подобную проблему, но решение было довольно простым.

разработчик по ошибке уронил копию интернета.config в каталог CSS. После удаления все ошибки были устранены и страница отображена правильно.

я столкнулся с той же проблемой при возобновлении работы над старым проектом среднего стека. Я использовал nodemon как мой локальный сервер разработки и получил ту же ошибку Resource interpreted as stylesheet but transferred with MIME type text/html. Я изменился с nodemon до http-server где можно найти здесь. Это сразу же сработало для меня.

Это потому,что вы должны установить тип контента как text/html вместо text/css для вашей страницы сервера (php, node.с JS и т. д.)

Это произошло, когда я удалил протокол из ссылки css для таблицы стилей css, обслуживаемой Google CDN.

это не дает никакой ошибки:

<link rel="stylesheet" href="//fonts.googleapis.com/css?family=Architects+Daughter">

но это дает ошибку ресурс интерпретируется как таблица стилей, но передается с помощью типа MIME text / html :

<link rel="stylesheet" href="fonts.googleapis.com/css?family=Architects+Daughter">

Я столкнулся с аналогичной проблемой. И изучение решений на этой фантастической странице переполнения стека.

ответ user54861 (несоответствие имен в случае сенситивности) заставляет меня любопытно проверить мой код снова и понял, что"Я не загрузил два JS-файла, которые я загрузил в head tag". :-)

когда я загрузил их проблема убегает ! И код запускается и страница отображается без каких-либо других ошибок!

Итак, мораль истории-не забывайте чтобы убедиться, что все ваши JS файлы загружаются где на странице их искать.

Я столкнулся с той же проблемой с приложением .NET, открытым исходным кодом CMS под названием MojoPortal. В одной из моих тем и кожи для конкретного сайта, при просмотре или тестировании он будет измельчать и замедляться, как будто он задыхается.

моя проблема не была атрибутом " type "для CSS, но это была"та другая вещь". Мое точное изменение было в Web.Config. Я изменил все значения на FALSE для MinifyCSS, CacheCssOnserver и CacheCSSinBrowser.

раз это было установлено, что веб-сайт был быстрым еще раз в производстве.

Я хочу расширить точку Тодда R в OP. В asp.net страницы,web.config file определяет разрешения, необходимые для доступа к каждому файлу или папке в приложении. В нашем случае папка CSS-файлов не допускала доступа для неавторизованных пользователей, что приводило к сбою на странице входа до авторизации пользователя. Изменение необходимых разрешений в web.config разрешил несанкционированным пользователям доступ к CSS-файлам и решил эту проблему.

была такая же ошибка, потому что я забыл отправить правильный заголовок первого

header("Content-type: text/css; charset: UTF-8");
print 'body { text-align: justify; font-size: 2em; }';

используя ReactJs, когда я добавляю файл стиля в индекс.html, используя относительную ссылку, такую как

<link rel="stylesheet" href="./css/style.css">

и тогда я перейду к маршруту, скажем;localhost:3000/artist и обновить, я получаю ошибку.

ошибка исчезла после того, как Я заменил относительную ссылку абсолютной ссылкой, скажем;

<link rel="stylesheet" href="http://localhost/project/public/css/style.css".

ответ может быть дан выше. У меня была та же проблема, но я не мог ее решить. Обязательно добавьте как

<script src="main.js"></script>