由于 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).

这些错误出现在自动浏览器更新(MozillaFirefox)之后 你知道有什么办法可以解决这个问题吗 问题?

260206 次浏览

这个问题可以通过改变 URL 使用镜像/代理来解决,而不是使用 GitHub:

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

二零一八年以来,GitHub 的缓存代理服务 曾经是已经关闭。请参阅其常见问题解答

检查文件路径是否正确,文件是否存在——在我的例子中,这就是问题所在——当我修复它时,错误消失了

这可能是因为浏览器无法访问文件。我在使用 node.js 创建应用程序时遇到了这种类型的错误。您可以尝试直接请求脚本文件(复制和粘贴 url) ,并查看是否可以检索它。到时候你就知道真正的问题是什么了。这可能是由于文件所在文件夹的权限,或浏览器只是无法找到它由于不正确的路径。在 node.js 中,在指定路由到文件之后,所有工作。

通过将 js-files 中的字符集从没有 BOM 的 UTF-8更改为 Notepad + + 中的简单 UTF-8,我已经解决了这个问题

对于 WordPress

在我的例子中,我只是错过了 get _ template _ direct _ 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' );

检查您的路径,如果文件不存在于给定的路径,这个错误将会出现。

你用快递吗?

检查你的路径(注意/public/后面的“ /”) :

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

//注意: 你不需要在“ css”前面加上“/”,因为它已经包含在上面了:

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

希望这个能帮上忙

请参阅 HTTPS 和 HTTP 协议

有时候,如果使用混合协议(这种情况通常发生在 JSONP 回调中) ,您可能会出现这种错误。

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

在我们的 DevOps 团队通过添加 X-Content-Type-Options: nosniff改变了 webserver 配置之后,我们开始在生产中面临这个错误。现在,由于这个原因,浏览器被迫解释在响应头的 content-type参数中提到的资源。

现在,从一开始,我们的应用服务器就显式地将 js 文件的 content-type 设置为 text/plain。由于没有在 webserver 中设置 X-Content-Type-Options: nosniff,浏览器自动将 js 文件解释为 JavaScript 文件,尽管内容类型被提到为 text/print。这被称为 MIME 嗅探。现在,在设置 X-Content-Type-Options: nosniff 之后,浏览器被迫停止 MIME 嗅探,而是采用响应头中提到的内容类型。由于这个原因,它确实将 js 文件解释为纯文本文件,并拒绝执行它们或阻止它们。在您的错误中也显示了同样的情况。

解决方案: 让服务器将 JS 文件的 content-type设置为

application/javascript;charset=utf-8

这样,它将正常加载所有 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 文件复制的内容类型为 text/plain; charset=utf-8,我改变了内容类型为 application/javascript

起作用了。

我在 django 服务器中也遇到了同样的问题,所以我在 setings.py 文件中修改了 DEBUG = True

我错误地在 link标签中添加了 js 文件。

例子: (错误的一个)

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

通过使用 javascript的正确标记解决了这个问题。例如:

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

当在 url 参数(firefox68)中有一个函数名时,我遇到了这个问题。

例如,https://.../test.html?concat()test.html所在的位置

<!DOCTYPE html>
<html>
<script src="https://unpkg.com/mathjs/lib/browser/math.js"></script>
</html>

concatmath.js中的一个函数。

我不知道为什么会这样。这个函数出现的次数最少,而其他一些函数没有效果。

concat和括号 https://.../test.html?concat ()之间的一个空格解决了这个问题。