I'm not the first one with this problem here, but nothing I've found on this site has helped me. Maybe someone can explain with my own example where the error is and why the styles and scripts are not loading into the HTML? When I first created and linked the files, the scripts and styles were loading without configuration settings. Then suddenly they stopped (if I'm not mistaken, after a commit to GitHub), even though I made no changes to these files. What is the reason and how can I fix it?
import org.springframework.context.annotation.Configuration;
import org.springframework.web.servlet.config.annotation.EnableWebMvc;
import org.springframework.web.servlet.config.annotation.ResourceHandlerRegistry;
import org.springframework.web.servlet.config.annotation.WebMvcConfigurer;
@Configuration
@EnableWebMvc
public class MvcConfig implements WebMvcConfigurer {
@Override
public void addResourceHandlers(ResourceHandlerRegistry registry) {
registry
.addResourceHandler("/styles/css/**")
.addResourceLocations("classpath:/static/css/");
}
}
@Configuration
@RequiredArgsConstructor
@EnableWebSecurity
@Slf4j
public class WebSecurityConfig {
private final JWTTokenConfig jwtTokenConfig;
@Bean
public SecurityFilterChain securityFilterChain(HttpSecurity http) throws Exception {
http.csrf().disable()
.cors().disable()
.authorizeRequests(authorize -> authorize
.antMatchers("/register","/host_page", "/login", "/music_files").permitAll()
.antMatchers("/static/**","/background.jpg").permitAll()
.antMatchers("/swagger-ui/**", "/swagger-resources/*", "/v3/api-docs/**", "/swagger-ui.html").permitAll()
.antMatchers("/personal_office/**").authenticated()
.antMatchers(HttpMethod.GET, "/main").permitAll()
.antMatchers("/free_subscription").hasAnyRole("FREE", "OPTIMAL", "MAXIMUM", "ADMIN")
.antMatchers("/optimal_subscription").hasAnyRole("MAXIMUM", "OPTIMAL", "ADMIN")
.antMatchers("/maximum_subscription").hasAnyRole("MAXIMUM", "ADMIN")
.antMatchers("/admin_office/**").hasRole("ADMIN")
.anyRequest().authenticated()
)
.sessionManagement().sessionCreationPolicy(SessionCreationPolicy.STATELESS)
.and()
.addFilterBefore((Filter) jwtTokenConfig, UsernamePasswordAuthenticationFilter.class);
return http.build();
}
}
<!DOCTYPE html>
<html lang="en" >
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Host Page</title>
<link rel="stylesheet" href="/styles/css/host_page.css" type="text/css" />
</head>
import org.springframework.boot.SpringApplication;
import org.springframework.boot.autoconfigure.SpringBootApplication;
import org.springframework.scheduling.annotation.EnableScheduling;
@SpringBootApplication
@EnableScheduling
public class PetMusicStorageApplication {
public static void main(String[] args) {
SpringApplication.run(PetMusicStorageApplication.class, args);
}
}
Why did the styles and script load initially even without configuration settings, and then the linkage disappeared?
Code after correction
@Configuration
@EnableWebMvc
public class MvcConfig implements WebMvcConfigurer {
@Override
public void addResourceHandlers(ResourceHandlerRegistry
registry) {
registry
.addResourceHandler("/styles/css/**")
.addResourceLocations("classpath:/static/css/");
registry
.addResourceHandler("/images/images/**")
.addResourceLocations("classpath:/static/images/");
registry
.addResourceHandler("/js/script/**")
.addResourceLocations("classpath:/static/script/");
}
}
@Bean
public WebSecurityCustomizer webSecurityCustomizer() {
return (web) -> web.ignoring().antMatchers("/static/**",
"/styles/**", "/images/**", "/js/**");
}
body {
background-image: url("/images/background.jpg");
background-size: cover;
background-position: center -100px;
background-repeat: no-repeat;
background-attachment: fixed;
}
or another style option
body {
background-image: url("/background.jpg");
background-size: cover;
background-position: center -100px;
background-repeat: no-repeat;
background-attachment: fixed;
}
@Configuration @RequiredArgsConstructor @EnableWebSecurity @Slf4j public class WebSecurityConfig { private final JWTTokenConfig jwtTokenConfig;
@Bean
public SecurityFilterChain securityFilterChain(HttpSecurity http) throws Exception {
http.csrf().disable()
.cors().disable()
.authorizeRequests(authorize -> authorize
.antMatchers("/register","/host_page", "/login", "/music_files").permitAll()
.antMatchers("/static/**","/images/background.jpg").permitAll()
.antMatchers("/swagger-ui/**", "/swagger-resources/*", "/v3/api-docs/**", "/swagger-ui.html").permitAll()
.antMatchers("/personal_office/**").authenticated()
.antMatchers(HttpMethod.GET, "/main").permitAll()
.antMatchers("/free_subscription").hasAnyRole("FREE", "OPTIMAL", "MAXIMUM", "ADMIN")
.antMatchers("/optimal_subscription").hasAnyRole("MAXIMUM", "OPTIMAL", "ADMIN")
.antMatchers("/maximum_subscription").hasAnyRole("MAXIMUM", "ADMIN")
.antMatchers("/admin_office/**").hasRole("ADMIN")
.anyRequest().authenticated()
)
.sessionManagement().sessionCreationPolicy(SessionCreationPolicy.STATELESS)
.and()
.addFilterBefore((Filter) jwtTokenConfig, UsernamePasswordAuthenticationFilter.class);
return http.build();
}
@Bean
public WebSecurityCustomizer webSecurityCustomizer() {
return (web) -> web.ignoring().antMatchers("/static/**", "/styles/**", "/images/**", "/js/**");
}
}
The reason is Spring Security dependency (that you added when it all stopped working) that by default blocks unauthorized access to any static files as well.
In your MvcConfic class just override the following method to allow access to static files:
@Override
public void configure(WebSecurity web) throws Exception {
web.ignoring().antMatchers("/statics/**", "/styles/**");
}
I suggested this approach since you are still using WebMvcConfigurer - you should however consider the new approach of defining it as a Spring Bean instead to easier migrate to latest Spring Version:
@Bean
public WebSecurityCustomizer webSecurityCustomizer() {
return (web) -> web.ignoring().antMatchers("/static/**", "/styles/**", "/images/**", "/js/**");
}