解决QQ浏览器的兼容性问题:Failed to load module script: The server responded with a non-JavaScript MIME type of “text/html”

本文预计阅读时间3分钟。

上个月在测试顺手写的PsychoJS平台的兼容性时遇到了一个问题。在QQ浏览器下会触发一个非常奇怪的问题:Failed to load module script: The server responded with a non-JavaScript MIME type of “text/html”. Strict MIME type checking is enforced for module scripts per HTML spec.

由于我常年使用Chrome(和CentBrowser),在程序上线前一定会检查Firefox的兼容性,出现这样的问题我是万万想不到的。我打开虚拟机安装了QQ浏览器,发现也是一样的问题。

我以为这是假的,ddadan但它确实存在了

F12打开开发者工具,发现Network面板下得到的JS文件的文件类型是text/html。用Firefox,Chrome都无法复现这个问题。

使用Fiddler抓包,也发现得到的HTTP请求是有问题的。但是,Firefox和Chrome抓的包没有问题。

我于是要求返回一个新头,X-NeiRong。QQ浏览器无法获取到这个头。

但是有个新问题出现了。我在新的标签页中打开这个JS文件,发现它的Content-Type是对的,X-NeiRong头也出现了。

奇了怪了。这可能是个BUG吧。

我用了半个下午写出来这个平台,但是解决这个BUG用了两天。

突然我想到了sleep()……

var script = document.createElement("script");
var script_name = $.getScript("/metaphor.js");
setTimeout(function(){
    var script_mini = script_name.responseText.replace(/\s*\/\/.*$/mg, "").replace(/(?:\\[rn]|[\r\n]+)+/g, "");
    var t = document.createTextNode(script_mini);
    script.type = 'module';
    script.appendChild(t);
    document.body.appendChild(script);
}, 10000);

大功告成!

发表评论

您的电子邮箱地址不会被公开。 必填项已用*标注

此站点使用Akismet来减少垃圾评论。了解我们如何处理您的评论数据