Carregando imagens estaticas no projeto | Spring MVC: autenticação com Spring Security, API Rest e AJAX

Bom dia,

Estava aplicando os conceitos que aprendi no curso em um projeto pessoal. Nesse projeto, precisei fazer algo simples e bastante comum, mas que não é feito no curso em questão: o uso de arquivos estáticos, no caso de imagens do meu PC (no curso, todas as imagens são carregadas a partir da web). Eu tentei por a imagem nos arquivos templates e no arquivo static do meu projeto e carregá-la utilizando o seguinte HTML:

<div class="card" style="width: 18rem;">
      <img src="Paris.jpg" class="card-img-top" alt="...">
      <div class="card-body">
        <p class="card-text">Some quick example text to build on the card title and make up the bulk of the card's content.</p>
      </div>
    </div>

No entanto, a imagem não é carregada na página web. O meu SpringSecurity está configurado da seguinte maneira:

@Configuration
@EnableWebSecurity
public class WebSecurityConfig extends WebSecurityConfigurerAdapter{

    @Autowired
    private DataSource dataSource;

    @Override
    protected void configure(HttpSecurity http) throws Exception{
        http
            .authorizeRequests()
            .antMatchers("/lifemanager/**").permitAll()
            .anyRequest().authenticated()
            .and().csrf().disable();
    }

    @Override
    protected void configure(AuthenticationManagerBuilder auth) throws Exception{
        BCryptPasswordEncoder encoder = new BCryptPasswordEncoder();
        auth.jdbcAuthentication()
            .dataSource(dataSource)
            .passwordEncoder(encoder);
    }

}

Onde "/lifemanager" é o path root da minha aplicação (ou seja, todos as outras URLs mapeadas são "/lifemanager/algumacoisa". Alguém pode me dizer o que está faltando para que as imagens sejam carregadas ?

Olá Humberto, tudo bem?

Pelo que entendi, você está tentando carregar imagens estáticas em seu projeto Spring MVC, mas elas não estão aparecendo na página web.

Ao utilizar o código HTML que você postou, a imagem não será carregada porque o caminho que você definiu para a imagem é relativo ao local onde a página HTML está sendo exibida, e não ao local onde a imagem está armazenada em seu projeto.

Para corrigir isso, você pode utilizar uma tag HTML que permite carregar recursos estáticos de forma absoluta. Por exemplo:

<img src="/static/images/Paris.jpg" class="card-img-top" alt="...">

Nesse caso, a imagem "Paris.jpg" deve estar armazenada na pasta "static/images" do seu projeto.

Outra coisa que você pode verificar é se a pasta "static" está sendo configurada corretamente em seu projeto. Para isso, você pode adicionar o seguinte código em sua classe de configuração:

@Override
public void addResourceHandlers(ResourceHandlerRegistry registry) {
    registry
        .addResourceHandler("/static/**")
        .addResourceLocations("classpath:/static/");
}

Espero ter ajudado e bons estudos!