[WEB]对于"Refused to execute script from 'http://xx.xx.xx/yy/zz.js' because its MIME type ('') is not executable, and strict MIME type checking is enabled."问题的解决办法
问题由来
前因:对nginx的header设置了安全头
本周安全同事反馈有响应头的X-Content-Type-Options
设置不合理,我看了下是nginx配置问题多了一个冒号,于是就打算全部修改正确。
后果:技术反馈有一服务报错"Refused to execute script from 'http://xx.xx.xx/yy/zz.js' because its MIME type ('') is not executable, and strict MIME type checking is enabled."
上午全部修改完,下午技术就群里反馈web服务通过js的ajax请求发出的动态式加载的静态文件加载不出来了。经过一番排查,发现浏览器报了这个错,顺便还给吊了一顿,行吧接锅小能手可不是吹的。
原因分析
那么,是什么原因导致的?咱们先翻译翻译下面这段报错信息:
Refused to execute script from 'http://xx.xx.xx/yy/zz.js' because its MIME type ('') is not executable, and strict MIME type checking is enabled.
javascript请求的内容返回的MIME类型为'',不是可执行的文件,目前已启用了严格的MIME类型检查。(故而,该文件加载失败)
通过使用gpt查询得出:
错误信息"'X-Content-Type-Options: nosniff' 导致 MIME 类型为 ('') 的资源不可执行,并且启用了严格的 MIME 类型检查",表示出现了与 "X-Content-Type-Options" 头部和资源的 MIME 类型相关的问题。让我详细解释一下。
"X-Content-Type-Options" 是一个 HTTP 响应头部,用于保护 Web 浏览器免受对某些资源的 MIME 类型错误解释。当将此头部设置为 "nosniff" 时,它指示浏览器不要推断 MIME 类型,而是依赖于提供的 Content-Type 头部。
你提到的错误信息"'X-Content-Type-Options: nosniff' 导致 MIME 类型为 ('') 的资源不可执行,并且启用了严格的 MIME 类型检查" 表明服务器响应未为所请求的资源提供有效的 MIME 类型。
当浏览器接收到未指定 MIME 类型或具有无效 MIME 类型的资源时,它可能会假设默认的 MIME 类型。在这种情况下,似乎默认的 MIME 类型为空字符串(''),而空字符串是不可执行的。
此外,错误消息指示浏览器启用了严格的 MIME 类型检查。严格的 MIME 类型检查意味着浏览器只会执行被认为安全且符合给定上下文的资源的 MIME 类型。由于 MIME 类型不可执行且启用了严格检查,浏览器拒绝执行该资源。
要解决此问题,你应确保服务器为所请求的资源正确设置 Content-Type 头部。Content-Type 头部指定资源的正确 MIME 类型。通过提供正确的 MIME 类型,你可以确保浏览器正确解释资源并避免遇到的错误。
例如,如果你正在提供 JavaScript 文件,服务器应将 Content-Type 头部设置为 "application/javascript"。类似地,对于 CSS 文件,Content-Type 应设置为 "text/css"。通过设置正确的 MIME 类型,你可以确保浏览器正确解释资源并避免遇到的错误。
值得注意的是,配置服务器以正确设置 Content-Type 头部的具体步骤可能因所使用的 Web 服务器软件而异。你可能需要查阅文档或寻求 Web 服务器管理员或托管提供商的帮助,以获取进一步的指导。
说人话就是与文件类型本身(application/javascript; text/css)不匹配,被禁止加载。
解决方案
方案1: Nginx取消 X-Content-Options:nosniff 配置
就是取消add_header X-Content-Type-Options "nosniff" always;
配置
方案2:给HTTP通信中的html/js/css等文件的响应头header中主动添加文件类型
HTTPServletResponse.setContentType(String mimetype); //"text/html;charset=UTF-8"
HTTPServletResponse.addHeader(String name;String value); //"content-type", "text/javascript; charset=uft-8"
HTTPServletResponse.response.setHeader(String name;String value); //"content-type", "text/javascript; charset=uft-8"