由于 MIME 类型不匹配，无法加载 JavaScript 文件

Posted 2023-03-15

【中文标题】由于 MIME 类型不匹配，无法加载 JavaScript 文件

【英文标题】：Unable to load JavaScript file due to a MIME type mismatch

【发布时间】：2021-10-31 07:00:23

【问题描述】：

我有一个网页正在拉入一些外部 JS 文件。脚本标签非常简单，只是普通的旧

<script type="text/javascript" src="https://oursite.com/a-valid-file.js"></script>

最近一次服务器更新后，所有这些文件都无法加载并出现以下错误：

The resource from “https://oursite.com/a-valid-file.js” was blocked due to MIME type (“application/unknown”) mismatch (X-Content-Type-Options: nosniff).

我试过了：

通过将 JS 附加到标签来拉入 JS，并像这样显式更改类型：

var jsfile = document.createElement("script");
jsfile.src = "https://oursite.com/a-valid-file.js";
jsfile.async = true;
jsfile.type = "application/javascript";  //have tried several here
var head = document.getElementsByTagName('head')[0];
head.appendChild(jsfile);

将 JS 文件的编码更改为 UTF-8、ANSI 和其他编码（没有区别）

尝试不同的浏览器（Edge、Chrome 和 Firefox 都给出相同的结果）

我不控制服务器 - 它由另一个团队托管和管理。我的问题是：

为什么会出现这个错误？

我可以通过以某种方式更改我的文件来自行解决此问题吗？

如果我必须要求服务器团队进行配置更改，我需要要求哪些更改？

【问题讨论】：

这能回答你的问题吗？ Resource blocked due to MIME type mismatch (X-Content-Type-Options: nosniff)

【参考方案1】：

您从中检索脚本的服务器正在响应 Content-Type 标头值，该值与 JavaScript 文件不对应。因此，您的浏览器将拒绝加载它，因为您的浏览器没有实际理由尝试执行它认为实际上不是 JavaScript 的内容。

除非您可以在中间放置一个代理来接收响应并在返回客户端之前修改此标头，否则管理服务器的团队有责任修复他们在响应中发送的标头。