java web项目本地能正常跑，布置到Tomcat8.5以后， 浏览器控制台能拿到各种css文件 但是chrome等浏览器不能正确识别css、解析css并应用到html文件上

问题描述

开发了一个java web项目，开发环境为

• Tomcat7
• maven
• mybatis
• mysql
• idea
  java web项目本地能正常跑，布置到Tomcat8.5以后， 浏览器控制台能监控到各种css文件确实加载过来了，但是chrome等浏览器不能正确识别css、解析css并应用到html文件上，造成了样式错乱

问题原因

对比了一下我本地正常运行的项目中css在浏览器加载情况和部署到服务器的

• 正常运行的项目
  
  我们发现正常运行的项目中 Content-Type:text/css;charset=utf-8

• 部署到Tomcat后css不正确解析的项目
  
  我们发现其Content-Type:text/html;charset=utf-8

原因

返回的文档格式不正确

问题解决

在我的项目中，有一个filter

其内部又如下代码

    public void doFilter(ServletRequest servletRequest, ServletResponse servletResponse, FilterChain filterChain) throws IOException, ServletException {
    
    
        // 处理请求乱码
        HttpServletRequest httpServletRequest = (HttpServletRequest) servletRequest;
//        HttpServletRequest myRequest = new MyRequest(httpServletRequest);
         处理响应乱码
//        servletResponse.setContentType("text/json;charset=utf-8");
        servletResponse.setContentType("text/html;charset=utf-8");
        filterChain.doFilter(servletRequest,servletResponse);
    }

我这里给设置成了servletResponse.setContentType("text/html;charset=utf-8");

先把这里注释掉，问题得到解决

由于我们还需要解决乱码问题，所以我们修改代码如下所示

@Override
public void doFilter(ServletRequest servletRequest, ServletResponse servletResponse, FilterChain filterChain) throws IOException, ServletException {
    
    
    // 处理请求乱码
    HttpServletRequest httpServletRequest = (HttpServletRequest) servletRequest;
//        HttpServletRequest myRequest = new MyRequest(httpServletRequest);
     处理响应乱码
//        servletResponse.setContentType("text/json;charset=utf-8");
    String requestURI = ((HttpServletRequest) servletRequest).getRequestURI();
    if (requestURI.contains(".css")||requestURI.contains(".js")||requestURI.contains(".png")||requestURI.contains(".jpg")) {
    
    
        filterChain.doFilter(servletRequest,servletResponse);
        return;
    }else{
    
    
        servletResponse.setContentType("text/html;charset=utf-8");
        filterChain.doFilter(servletRequest,servletResponse);

    }
}

此处代码参考：https://blog.csdn.net/dmyin/article/details/107759691