CODEWITHSUNDEEP
htmlimagespring-boot
Vinci9
Vinci9

Reputation: 1

Can't Map <img> in Spring boot, thymeleaf

I'm looking for answer for too long. I started simple Spring boot maven project. I cannot display any img on my html files. I tried to put images in different locations like templates and static but non of these is working. Everything work correct (hibernate, postgre, bootstrap, thymeleaf) only images is thing i can't display. Looking for help :)

This is placed inside index.html 

<img th:src="@{/images/pruff.png}"
      src="../images/pruff.png" class="img-responsive"/>

Img is placed in /src/main/resources/static/images/pruff.png

Upvotes: 0

Views: 577

Answers (2)

Adina Rolea
Adina Rolea

Reputation: 2109

It should work with :

 <img src="/images/pruff.png" class="img-responsive"/>

I've created a sample maven project, because it looks like a common problem.

https://github.com/adinafometescu/tutorials/tree/master/spring-boot-image

Upvotes: 1

Michał
Michał

Reputation: 87

I think it isn't necessary to use th:src option. You should use th actions only for Spring/Java outputs.

EDIT: Maybe try to extend WebMvcConfigurerAdapter to configure static resource locations


    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.WebMvcConfigurerAdapter;

    @Configuration
    @EnableWebMvc
    public class WebConfig extends WebMvcConfigurerAdapter {

        @Override
        public void addResourceHandlers(ResourceHandlerRegistry registry) {
            registry.addResourceHandler(
                    "/webjars/**",
                    "/img/**",
                    "/css/**",
                    "/js/**")
                    .addResourceLocations(
                            "classpath:/META-INF/resources/webjars/",
                            "classpath:/static/img/",
                            "classpath:/static/css/",
                            "classpath:/static/js/");
        }

    }

and then call right file using th:src / th:href

Upvotes: 0

Related Questions