Ресурс заблокирован из-за несоответствия типа MIME (X-Content-Type-Options: nosniff)

90

Я разрабатываю веб-страницу с использованием JavaScript и HTML, все работало хорошо, когда я получил этот список ошибок со своей HTML-страницы:

The resource from “https://raw.githubusercontent.com/dataarts/dat.gui/master/build/dat.gui.min.js”
  was blocked due to MIME type mismatch (X-Content-Type-Options: nosniff).
The resource from “https://raw.githubusercontent.com/mrdoob/three.js/dev/build/three.js” was
  blocked due to MIME type mismatch (X-Content-Type-Options: nosniff).
The resource from “https://raw.githubusercontent.com/mrdoob/three.js/master/examples/js/renderers/CanvasRenderer.js”
  was blocked due to MIME type mismatch (X-Content-Type-Options: nosniff).
The resource from “https://raw.githubusercontent.com/mrdoob/three.js/master/examples/js/renderers/Projector.js”
  was blocked due to MIME type mismatch (X-Content-Type-Options: nosniff).
The resource from “https://raw.githubusercontent.com/mrdoob/three.js/dev/build/three.js” was
  blocked due to MIME type mismatch (X-Content-Type-Options: nosniff).

Эти ошибки появились после автоматического обновления браузера (Mozilla Firefox), возможно, что-то было изменено в настройке. Вы знаете, как решить эту проблему?

Sim81
источник
10
Не загружайте файлы с GitHub. Вместо этого используйте CDN.
SLaks

Ответы:

72

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

Дав
источник
Я также столкнулся с той же проблемой, и файла также нет в каталоге pub. Что я должен делать? Это настраиваемый файл темы.
Saiid 06
@SaiidatRLTSquare, если файл не существует, вы должны найти его откуда-то и поместить его туда - или, если этот файл не важен - просто удалите строку, которая включает его (или создайте пустой файл), чтобы он не выдал ошибку
dav
Использование Passenger с Node отбросило мои пути сборки, обновление путей исправило это. Спасибо!
Аарон Белчембер,
28

Это можно исправить, изменив URL-адрес, например, плохой:

https://raw.githubusercontent.com/svnpenn/bm/master/yt-dl/yt-dl.js
Content-Type: text/plain; charset=utf-8

Пример хороший:

https://cdn.rawgit.com/svnpenn/bm/master/yt-dl/yt-dl.js
content-type: application/javascript;charset=utf-8

rawgit.com - это кеширующий прокси-сервер для github. Вы также можете перейти туда и в интерактивном режиме получить соответствующий URL-адрес для исходного URL-адреса raw.githubusercontent.com . Смотрите его FAQ

Стивен Пенни
источник
3
В адресе raw.githubusercontent.comзаменяется на cdn.rawgit.comкоторый будет отвечать правильным типом пантомимы.
Axel Guilmin 06
спас мою жизнь. Спасибо!!
Меган Байерс
rawgit закрывается. вы можете использовать jsdeliver, как описано в следующем ответе - stackoverflow.com/a/64456518/9640177
mayank1513
14

Мы начали сталкиваться с этой ошибкой на производстве после того, как наша команда DevOps изменила конфигурацию веб-сервера, добавив X-Content-Type-Options: nosniff. Теперь из-за этого браузер был вынужден интерпретировать ресурсы так, как это было указано в content-typeпараметре заголовков ответа.

Теперь, с самого начала, наш сервер приложений явно устанавливал тип содержимого js-файлов как text/plain. Поскольку, X-Content-Type-Options: nosniffне было установлено на веб-сервере, браузер автоматически интерпретировал файлы js как файлы JavaScript, хотя тип содержимого был упомянут как text / plain. Это называется MIME-сниффингом. Теперь, после установки X-Content-Type-Options: nosniff, браузер был вынужден не выполнять MIME-сниффинг и принимать тип содержимого, как указано в заголовках ответов. Из-за этого он интерпретировал файлы js как простые текстовые файлы и отказывался выполнять их или блокировал их. То же самое и в ваших ошибках.

Решение: сделать так, чтобы ваш сервер устанавливал content-typeфайлы JS как

application/javascript;charset=utf-8

Таким образом, он загрузит все файлы JS как обычно, и проблема будет решена.

Маниш Бансал
источник
Когда мне нужно установить тип содержимого сервера, я имею в виду, какой файл мне нужно сохранить, я использую сервер tomcat 8.5
Бхаскара Арани,
Все зависит от архитектуры приложения. В нашем случае это было простое старое монолитное приложение на основе сервлетов. Следовательно, он устанавливался прямо здесь, в служебном методе.
Manish Bansal
А как насчет изменения HTML вместо этого?
Аарон Франке
Сожалею. Я тебя не понял. Здесь не было html. У нас было приложение на основе сервлетов. Какие изменения вы предлагаете в html?
Manish Bansal
12

проверьте свой путь, эта ошибка появится, если файл не существует по указанному пути.

Приянка Ачарья
источник
6

Вы пользуетесь экспрессом?

Проверьте свой путь (обратите внимание на " /" после / public /):

app.use(express.static(__dirname + "/public/"));

// примечание: вам не нужно "/" перед "css", потому что он уже включен выше:

rel="stylesheet" href="css/style.css

Надеюсь это поможет

JPaulino
источник
5

Для Wordpress

В моем случае я просто пропустил косую черту "/" после get_template_directory_uri (), поэтому полученный / сгенерированный путь был неправильным:

Мой неправильный код:

wp_enqueue_script( 'retina-js', get_template_directory_uri().'js/retina.min.js' ); 

Мой исправленный код:

wp_enqueue_script( 'retina-js', get_template_directory_uri().'/js/retina.min.js' );
Сабир Хуссейн
источник
3

Это может быть связано с тем, что браузер не может получить доступ к файлу. Я столкнулся с этой ошибкой при создании приложения с помощью node.js. Вы можете попробовать напрямую запросить файл сценария (копирование и вставка URL-адреса) и посмотреть, сможете ли вы его получить. Тогда вы можете увидеть, в чем настоящая проблема. Это может быть из-за разрешения папки, в которой находится файл, или браузер просто не может найти его из-за неправильного пути к нему. В node.js после указания маршрута к файлу все работает.

Вади
источник
Согласно этой странице MS, это проблема типа MIME. Но как указать MIMEтип в Node.js? (Не нужно указывать полные пути ко всем файлам, а только к каталогам ресурсов, не так ли?)
not2qubit
3

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

app.use(express.static(path.join(__dirname,"public")));

Пример ссылки на ваш CSS как:

<link href="/css/clean-blog.min.css" rel="stylesheet">

аналогично для ссылки на файлы js:

<script src="/js/clean-blog.min.js"></script>
Mwongera808
источник
2

Я решил эту проблему, изменив кодировку в js-файлах с UTF-8 без спецификации на простой UTF-8 в Notepad ++.

Сергей
источник
1

У меня была эта ошибка, когда я использовал хранилище Azure в качестве статического веб-сайта, скопированные файлы js имели тип содержимого, text/plain; charset=utf-8и я изменил тип содержимого наapplication/javascript

Это начало работать.

Картикеян В.К.
источник
0

См. Протоколы HTTPS и HTTP

Иногда, если вы используете смешанные протоколы [это происходит в основном с обратными вызовами JSONP], вы можете получить эту ОШИБКУ.

Убедитесь, что и веб-страница, и страница ресурса имеют одинаковые протоколы HTTP.

Клен Дсилва
источник
0

Я также столкнулся с той же проблемой на сервере django, поэтому я изменил DEBUG = True в файле settings.py, который работает

сатиш кумар
источник
0

Это случилось со мной из-за неправильного тега. По ошибке я добавляю js-файл в linkтег.

Пример: (Не тот)

<link rel="stylesheet" href="plugins/timepicker/bootstrap-timepicker.min.js">

Это было решено с помощью правильного тега для javascript. Пример:

<script src="plugins/timepicker/bootstrap-timepicker.min.js"></script>
смартрахат
источник
0

https://cdn.rawgit.com закрывается. Таким образом, можно использовать один из альтернативных вариантов. JSDeliver - это бесплатный компакт-диск, который можно использовать.

// загружаем любой выпуск, коммит или ветку GitHub

// примечание: мы рекомендуем использовать npm для проектов, которые его поддерживают

https://cdn.jsdelivr.net/gh/user/repo@version/file

// загружаем jQuery v3.2.1

https://cdn.jsdelivr.net/gh/jquery/jquery@3.2.1/dist/jquery.min.js

// использовать диапазон версий вместо конкретной версии

https://cdn.jsdelivr.net/gh/jquery/jquery@3.2/dist/jquery.min.js

https://cdn.jsdelivr.net/gh/jquery/jquery@3/dist/jquery.min.js

// полностью опускаем версию, чтобы получить последнюю

// вы НЕ должны использовать это в производстве

https://cdn.jsdelivr.net/gh/jquery/jquery/dist/jquery.min.js

// добавляем ".min" в любой файл JS / CSS, чтобы получить уменьшенную версию

// если его не существует, мы сгенерируем его для вас

https://cdn.jsdelivr.net/gh/jquery/jquery@3.2.1/src/core.min.js

// добавляем / в конце, чтобы получить список каталогов

https://cdn.jsdelivr.net/gh/jquery/jquery/

ссылка - https://www.jsdelivr.com/?docs=gh

майанк1513
источник