为什么我得到一个“df.worker.min.js”被加载，即使它的 MIME 类型（“text/html”）不是一个有效的 JavaScript MIME 类型”

Question

我尝试在一个带有 parceljs 作为捆绑器的小型打字稿应用程序中使用 pdfjs，但是当我加载 worker 时：

pdfjsLib.GlobalWorkerOptions.workerSrc = '../../node_modules/pdfjs-dist/build/pdf.worker.min.js';

我在 Firefox 控制台中收到此错误：

pdf.worker.min.js” was loaded even though its MIME type (“text/html”) is not a valid JavaScript MIME type

并且工人没有被加载。

如果我这样加载工人：

pdfjsLib.GlobalWorkerOptions.workerSrc = `https://cdnjs.cloudflare.com/ajax/libs/pdf.js/${(pdfjsLib as any).version}/pdf.worker.min.js`;

一切正常。

我查看了错误的 MDN 描述，听起来像是服务器端的东西，所以这是包裹服务器的限制吗？有解决方法吗？

Answer 1

这是由于错误的内容类型响应标头而发生的。

您的服务器正在响应内容类型为“text/html”的 javascript 文件，这是错误的。

将内容类型更改为“text/javascript”。

它应该可以正常工作。

更新（2019 年 4 月 11 日）：

我假设您正在使用 http-server 的 express 框架。 可以使用中间件设置 content-type。

app.use('*.js', (req, res, next) => {
    res.set('Content-Type', 'text/javascript')
    next();
})

在静态文件服务中间件之前添加这个。

Answer 2

在您的网络服务器上检查该 .js 文件的文件权限。

我有一个类似的问题，加载我的一个 .js 文件失败并且 Firefox 打印了消息：

“https://my.website.com/file.js”中的脚本已加载，即使其 MIME 类型（“text/html”）不是有效的 JavaScript MIME 类型。

来源为“https://my.website.com/file.js”的<script> 加载失败。

所有其他 .js 文件都使用正确的内容类型“application/javascript”发送，但这个文件使用“text/html”发送。

问题是，在将文件传输到我的网络服务器（使用 FileZilla）时，文件的权限设置为 600。将文件权限设置为 705 修复了它。 .js 文件是现在以正确的内容类型发送，Firefox 消息消失了。