前段时间系统从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>
替换之后重启服务,好看的前端样式回来了!