生产环境浏览器Strict MIME TYPE Checking问题解决

问题背景

最近在生产环境遇到了一个棘手的问题，很多促销页面的商品价格无法加载，且只有部分用户投诉和反馈，测试环境和内网环境均无法复现这个现象。

原因定位

发现报错的原因如下，动态加载js文件时返回Content-Type为text/html，与文件类型.js不匹配，禁止加载。

Refused to execute script from ‘XXXX’ because its MIME type (‘text/html’) is not executable, and strict MIME type checking is enabled.

由于开发没有注意过，我们所有json的请求的类型都是默认的text/html。但一直都是这样使用的，为什么最近才出现被禁止加载的情况呢？进一步分析请求的响应头，发现最近安全部门在响应头中增加了X-Content-Type-Options:nosniff字段。

互联网上的资源有各种类型，通常浏览器会根据响应头的Content-Type字段来分辨它们的类型。例如：”text/html”代表html文档，”image/png”是PNG图片，”text/css”是CSS样式文档。然而，有些资源的Content-Type是错的或者未定义。这时，某些浏览器会启用MIME-sniffing来猜测该资源的类型，解析内容并执行。
例如，我们即使给一个html文档指定Content-Type为”text/plain”，在IE8-中这个文档依然会被当做html来解析。利用浏览器的这个特性，攻击者甚至可以让原本应该解析为图片的请求被解析为JavaScript。通过下面这个响应头可以禁用浏览器的类型猜测行为：

X-Content-Type-Options: nosniff

现在原因可以解释了：安全头部X-Content-Type-Options: nosniff遇到了格式不正确的Content-Type格式，造成了请求的阻塞。

那如何解释内网和测试环境无法复现，不是所有用户都有，但价格一旦加载不出来就一直出不来的现象呢？

• 首先，安全部门在内网和测试环境没有加X-Content-Type-Options: nosniff；
• 其次，就算在外网环境也不是每次都加，当用户第一次请求时，会给用户Set一个Cookie并加上这个头部，下次用户再请求，如果有这个Cookie就不会加这个头部
• 最后，价格服务请求是很多个的，每个栏目会加载多个价格请求，一旦一个有问题，后面的请求会被阻塞，不会被种上Cookie，用户再刷新，后面的种Cookie，又因为X-Content-Type-Options: nosniff，价格还是出不来。

所以任何诡异问题的发生都是无数人为操作并行的结果，一方面，系统负责人没有注意规范自己的请求格式，另一方面，安全部门加X-Content-Type-Options: nosniff没有认真分析其可能对生产上造成的影响。

解决方案

涉及的系统比较多，不可能让所有系统马上发布新的版本，同时，安全部门改代码也需要时间，但生产环境中，用户的体验必须保证，因此，解决方案如下：

• 应急解决方案：CDN将安全部门加的X-Content-Type-Options头部去掉；

• 进一步解决方案：安全部门先将X-Content-Type-Options下线，或者配置开关。

• 最终解决方案：所有涉及系统标准化Content-type格式。参考
  http://tool.oschina.net/commons