CSS失效 Resource interpreted as Stylesheet but transferred with MIME type text/html

10 篇文章 1 订阅
8 篇文章 0 订阅

前段时间系统从JDK1.6升到了1.8,tomcat也从6.0换到了8.5,但用着用着发现前端样式没了!

浏览器点开F12看到控制台输出了Resource interpreted as Stylesheet but transferred with MIME type text/html的报错。

奇怪,代码没动,怎么升级就不行。搜索了资料发现,后端如果使用servlet,编码格式是text/html的话,CSS文件会无法解析。猜测可能是tomcat升级的原因。

解决办法:

1、新增一个专门给css文件读取和解析的过滤器,里面就是很简单的只定义了编码格式,和响应编码是text/css:

public class CssFilter implements Filter{

	@Override
	public void destroy() {}

	@Override
	public void doFilter(ServletRequest req, ServletResponse resp, FilterChain chain) throws IOException, ServletException {
		req.setCharacterEncoding("utf-8");
		resp.setContentType("text/css; charset = utf-8");
		chain.doFilter(req, resp);
	}

	@Override
	public void init(FilterConfig arg0) throws ServletException {}
}

2、在前端web.xml中加入css的过滤器

    <filter>
		<filter-name>CssFilter</filter-name>
		<filter-class>com.CssFilter</filter-class>
	</filter>
	<filter-mapping>
        <filter-name>CssFilter</filter-name>
        <url-pattern>*.css</url-pattern>
	</filter-mapping>

替换之后重启服务,好看的前端样式回来了!

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值