关于MIME TYPE报错

一、问题

已上线项目在生产环境和测试环境均出现报错，报错如图

MIME TYPE类型错误

大概意思是js文件返回的Content-Type为text/html，与文件类型不匹配禁止加载。

二、原因

项目已上线一段时间，排查原因暂时忽略了代码问题发现是安全部门在响应头中添加X-Content-Type-Options:nosniff。造成content-type类型不匹配，文件堵塞。

请求响应头

于是在MDN中看了下关于 X-Content-Type-Options:nosniff解释。

X-Content-Type-Options 响应首部相当于一个提示标志，被服务器用来提示客户端一定要遵循在 Content-Type 首部中对 MIME 类型 的设定，而不能对其进行修改。这就禁用了客户端的 MIME 类型嗅探行为，换句话说，也就是意味着网站管理员确定自己的设置没有问题。站点安全测试人员通常欢迎对这个首部进行设置。——来源MDN

找到原因回头看下代码，项目中使用jsonp获取地图，同时因为MIME TYPE报错，整个地图都挂了。其中type为text/javascript，实际获取content-type为text/plain。导致了类型不匹配。（项目最后没有使用这个解决方式）

      var script = document.createElement("script");
      script.type = "text/javascript";
      script.src =
        "https://map.qq.com/api/js?v=2.exp&key=XXXX&callback=init";
      script.onerror = reject;
      document.head.appendChild(script);

三、解决

• 安全部门去掉响应头中`X-Content-Type-Options:nosniff``（实际解决）
• 规范content-type