Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Spring Boot not returning correct MIME type

I'm trying to make a Spring MVC app with Spring boot, Spring Security and Thymeleaf.

The problem is - when i'm requesting a page with it's html and css, i'm not getting the correct MIME type for my css file, thus why Chrome cannot load it with status "canceled" and the message "Refused to apply style from 'http://localhost:8080/login' because its MIME type ('text/html') is not a supported stylesheet MIME type, and strict MIME checking is enabled."

I'm linking the css file correctly: " "

The css file is contained in:

resources -> static -> css - > style.css

I've allowed all resouces from the resources folder in the Security config file:

    package org.isp.configuration;

import org.isp.services.api.UserService;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.context.annotation.Bean;
import org.springframework.context.annotation.Configuration;
import org.springframework.http.MediaType;
import org.springframework.security.authentication.dao.DaoAuthenticationProvider;
import org.springframework.security.config.annotation.authentication.builders.AuthenticationManagerBuilder;
import org.springframework.security.config.annotation.web.builders.HttpSecurity;
import org.springframework.security.config.annotation.web.configuration.EnableWebSecurity;
import org.springframework.security.config.annotation.web.configuration.WebSecurityConfigurerAdapter;
import org.springframework.security.crypto.bcrypt.BCryptPasswordEncoder;
import org.springframework.web.servlet.config.annotation.ContentNegotiationConfigurer;

@Configuration
@EnableWebSecurity
public class WebSecurityConfig extends WebSecurityConfigurerAdapter {

    @Autowired
    private UserService userService;

    @Override
    protected void configure(AuthenticationManagerBuilder auth)
            throws Exception {
        auth.authenticationProvider(authenticationProvider());
    }

    @Bean
    public DaoAuthenticationProvider authenticationProvider() {
        DaoAuthenticationProvider authProvider
                = new DaoAuthenticationProvider();
        authProvider.setUserDetailsService(this.userService);
        authProvider.setPasswordEncoder(getBCryptPasswordEncoder());
        return authProvider;
    }

    @Override
    protected void configure(HttpSecurity http) throws Exception {
        String[] permitted = new String[]{
                "/", "/home","/register","/about","/png/**",
                "/css/**","/icons/**","/img/**","/js/**","/layer/**"
        };

        http
                .authorizeRequests()
                .antMatchers(permitted).permitAll()
                .anyRequest().authenticated()
                .and()
                .formLogin().loginPage("/login").permitAll()
                .defaultSuccessUrl("/dashboard")
                .usernameParameter("username")
                .passwordParameter("password")
                .and()
                .logout().logoutSuccessUrl("/login?logout").permitAll()
                .and()
                .exceptionHandling().accessDeniedPage("/unauthorized")
                .and()
                .csrf().disable();
    }

    @Bean
    public BCryptPasswordEncoder getBCryptPasswordEncoder(){
        return new BCryptPasswordEncoder();
    }
}

This is my html page:

<!DOCTYPE html>
    <html lang="en" xmlns="http://www.w3.org/1999/xhtml" 
         xmlns:th="http://www.thymeleaf.org" >
    <head>
        <title>Index</title>
        <meta charset="utf-8">
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
        **<link rel="stylesheet" href="../static/css/style.css" type="text/css">**
    </head>
    <body>
        <div th:include="~{fragments/navbar :: navbar}"></div>

        <div class="container">
            <h3>Home</h3>
            <p>This is the home page of the project!</p>
        </div>

        <div th:include="~{fragments/footer :: footer}" class="footer"></div>
    </body>
    </html>

Any ideas how can i fix the incorrect MIME type? Is there any configuration im missing?

like image 218
Simona Simeonova Avatar asked Mar 04 '18 12:03

Simona Simeonova


1 Answers

I've just been struggling with the same issue, and I finally realized that it was a red herring - the real problem was 404, and the MIME type error came from Spring's handling of it. As explained in the Spring Boot docs, its built-in error handling automatically redirects to /error and outputs the error details as JSON. When I checked my logs, I saw a 404 in my webserver access log and the following in my application log:

DEBUG DispatcherServlet:869 - DispatcherServlet with name 'dispatcherServlet' processing GET request for [/error]
DEBUG RequestMappingHandlerMapping:310 - Looking up handler method for path /error
DEBUG RequestMappingHandlerMapping:317 - Returning handler method [public org.springframework.http.ResponseEntity<java.util.Map<java.lang.String, java.lang.Object>> org.springframework.boot.autoconfigure.web.BasicErrorController.error(javax.servlet.http.HttpServletRequest)]
DEBUG HttpEntityMethodProcessor:234 - Written [{timestamp=Fri Apr 06 14:06:54 PDT 2018, status=404, error=Not Found, message=No message available, path=/css/style.css}] as "application/json" using [org.springframework.http.converter.json.MappingJackson2HttpMessageConverter@5ef96137]

So, your real problem is that Spring is not finding your static resources. You'll want to make sure the resources folder is in your classpath, or explicitly set the locations using the spring.resources.static-locations property.

like image 199
htompkins Avatar answered Oct 23 '22 00:10

htompkins