python脚本写好了,第一次执行Upupor网站样式就消失了 | Refused to apply style .... strict MIME checking is enabled
156 ·
0 ·
27天前
最新编辑时间: 27天前
最新编辑原因:

先看结果

enter image description here

错误日志

Refused to apply style from 'xxx.css' because its MIME type ('application/octet-stream') is not a supported stylesheet MIME type, and strict MIME checking is enabled.
Refused to execute script from 'xxx.js' because its MIME type ('application/octet-stream') is not executable, and strict MIME type checking is enabled.

背景

5月23号之前,upupor网站还在使用阿里的oss来做对象存储,但是它的费用太高,半年需要400多元,只是下行流量。这个阿里oss的费用包含下行流量、上行流量、oss存储空间,这三部分。我没有使用cdn,如果使用cdn那费用就更高了。所以,为了减少这一块的支出,决定使用自建的对象存储。
自建的对象存储使用的是minio开源版本,google和亚马逊他们都在使用,所以稳定性和质量对于upupor这样的小网站是足够的。
网站的css和js文件在项目中,发布的时候要上传到minio,目的是服务器只返回服务端渲染好的html页面,其他资源全部从oss上获取。这样职责划分更清晰。后期oss也可以单独部署(使用阿里的oss实际上就是单独部署,不走upupor服务器的带宽。使用minio自建后又走自己服务器的带宽了,原因是),然后加cdn就飞快。
为了方便上传所以就写了python脚本来维护。那么问题就出在阿里的oss接口和minio的接口不一样上面。

具体原因

阿里的oss接口内部自动帮我们处理了content type,而minio的接口需要自己指定参数,因为前面不知道这回事,就导致上传的文件全部是application/octet-stream

看现象排查出原因

在加载js和css文件时,响应是nosniff:
enter image description here
设置为nosniff这个响应头则可以禁用浏览器的类型猜测行为,使用服务端指定的content type来解析。那么此时就要对上传的css和js指定好content type,这是服务器再获取的时候就不会去嗅探和校验,就可以正常加载了。

代码解决

enter image description here
重新上传静态资源文件后,upupor样式也就恢复了

X-Content-Type-Options
作用:禁用浏览器的Content-Type猜测行为。
背景:
浏览器通常会根据响应头Content-Type字段来分辨资源类型。有些资源的Content-Type是错的或者未定义。这时,浏览器会启用MIME-sniffing来猜测该资源的类型,解析内容并执行。
利用这个特性,攻击者可以让原本应该解析为图片的请求被解析为JavaScript。
使用方法:
X-Content-Type-Options: nosniff

更加直观的解释
一些浏览器非常聪明,会猜测默认的数据传输内容,比如即使服务器说这是一个普通文本文件,浏览器也会当成一个HTML文件渲染输出显示,这会被黑客用来导向不信任的Javacript代码,设置X-Content-Type-Options为nosniff ,就是强迫浏览器尊重服务器端指定的文件类型

本作品系原创,采用《署名-非商业性使用-禁止演绎4.0 国际》许可协议.转载请说明出处
本文链接:https://www.upupor.com/u/22052913580834729984 复制

无内容

推荐阅读
暗淡蓝点 · 响应时间: 68ms · 版本:2022-06-22T08:41:16.737 · 备案号: 皖ICP备17015935号-2 · upupor.com©2022 · 项目始于2019