资源因MIME类型不匹配而被阻止（X-Content-Type-Options：nosniff）

我正在使用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）后出现的，可能是设置已更改。您知道解决这个问题的任何方法吗？

当我修复它时，检查文件路径是否正确以及文件是否存在（在我的情况下就是问题所在），错误消失了

可以通过更改URL来解决此问题，例如bad：

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的缓存代理服务。您也可以去那里，以交互方式为您的原始raw.githubusercontent.com URL派生一个对应的URL。查看其常见问题

在我们的devops团队通过添加更改Web服务器配置之后，我们开始在生产中遇到此错误X-Content-Type-Options: nosniff。现在，由于这个原因，浏览器被迫按照content-type响应头参数中提到的来解释资源。

现在，从一开始，我们的应用服务器就将js文件的content-type显式设置为text/plain。由于X-Content-Type-Options: nosniff未在Web服务器中进行设置，因此浏览器会自动将js文件解释为JavaScript文件，尽管内容类型被称为text / plain。这称为MIME嗅探。现在，在设置X-Content-Type-Options：nosniff之后，浏览器被迫不进行MIME嗅探，并按照响应标头中的说明采用内容类型。因此，它确实将js文件解释为纯文本文件，并拒绝执行它们或将其阻止。错误也显示相同的内容。

解决方案：是让您的服务器将content-typeJS文件设置为

application/javascript;charset=utf-8

这样，它将正常加载所有JS文件，问题将得到解决。

检查您的路径，如果给定路径中不存在文件，则会出现此错误。

您在使用快递吗？

检查您的路径（注意// public /之后的“ ”）：

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

//注意：您不需要在“ css”之前加上“ /”，因为上面已经包含了它：

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

希望这可以帮助

对于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' );

这可能是因为浏览器无法访问文件。当使用node.js创建应用程序时，我迷失了这种类型的错误。您可以尝试直接请求脚本文件（复制和粘贴URL），然后查看是否可以检索它。然后您可以看到真正的问题是什么。可能是由于文件所在文件夹的许可，或者浏览器由于路径错误而无法找到它。在node.js中，指定到文件的路由后，所有工作正常。

这可能是一条错误的道路。确保在主应用程序文件中具有：

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>

我已通过将js文件中的字符集从无BOM的UTF-8更改为Notepad ++中的简单UTF-8来解决了此问题

当我使用azure存储作为静态网站时，出现此错误，所复制的js文件的内容类型为，text/plain; charset=utf-8并且我将内容类型更改为application/javascript

它开始工作。

请参阅HTTPS和HTTP协议

有时，如果您使用混合协议[这主要发生在JSONP回调中]，您可能会遇到此错误。

确保网页和资源页面具有相同的HTTP协议。

我在django server中也遇到了同样的问题。所以我在settings.py文件中将DEBUG = True更改为工作

发生在我身上的标签错误。我误将js文件添加到link标记中。

示例：（错误的一个）

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

通过使用正确的标签来解决javascript。例：

<script src="plugins/timepicker/bootstrap-timepicker.min.js"></script>

https://cdn.rawgit.com正在关闭。因此，可以使用替代选项之一。JSDeliver是可以使用的免费CDN。

//加载任何GitHub版本，提交或分支

//注意：我们建议对支持npm的项目使用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