Why css, js do not connect to html in Spring MVC project?

Question

Why styles and js are not connected to the page? When displaying a page, I get an error at these files.

Failed to load resource: the server responded with a status of 404

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link rel="stylesheet" href="/sources/css/styles.css">

</head>
<body >
<h1>Hey there</h1>
<a href="/departments">click here</a>

<script src="/sources/scripts/initial_service.js"></script>
</body>
</html>

The project structure:

The Web Config:

@EnableWebMvc
@Configuration
@ComponentScan(basePackages = {"controller"})
public class WebConfig  extends WebMvcConfigurerAdapter {

    @Bean
    public ViewResolver internalResourceViewResolver() {
        InternalResourceViewResolver bean = new InternalResourceViewResolver();
        bean.setViewClass(JstlView.class);
        bean.setPrefix("/WEB-INF/");
        bean.setSuffix(".html");
        return bean;
    }

    @Override
    public void addResourceHandlers(ResourceHandlerRegistry registry) {
        registry.addResourceHandler("/css/**").addResourceLocations("/sources/css/");
        registry.addResourceHandler("/image/**").addResourceLocations("/sources/image/");
        registry.addResourceHandler("/scripts/**").addResourceLocations("/sources/scripts/");
        registry.addResourceHandler("/*.html").addResourceLocations("/WEB-INF/");
    }

    @Override
    public void addViewControllers(ViewControllerRegistry registry) {
        registry.addViewController("/").setViewName("forward:/main.html");
    }
}

What could be wrong?

you add the resource handler, but you don't use it. remove /sources in your HTML — Philipp Sander
– Philipp Sander, Commented Oct 17, 2018 at 11:59

Avijit Barua · Accepted Answer · 2018-10-17 12:05:45Z

3

I think this one will reduce your code

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

answered Oct 17, 2018 at 12:05

Avijit Barua

3,0965 gold badges18 silver badges38 bronze badges

Sign up to request clarification or add additional context in comments.

9 Comments

Philipp Sander Over a year ago

I like this approach more than mine

Avijit Barua Over a year ago

@PhilippSander My pleasure !

Vladislav Solopov Over a year ago

@AvijitBarua But after changing on the page and in the config, I get the same error: Failed to load resource: the server responded with a status of 404 ()

Avijit Barua Over a year ago

@VladislavSolopov If you use my code you would not need to change your jsp page. Just keep it as it was. like <link rel="stylesheet" href="/sources/css/styles.css">

Avijit Barua Over a year ago

@VladislavSolopov Pleasure buddy !

|

Philipp Sander · Accepted Answer · 2018-10-17 12:05:36Z

1

you add resource handlers but you do not use them. remove /sources from the paths where you load your resources.

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link rel="stylesheet" href="/css/styles.css">

</head>
<body >
<h1>Hey there</h1>
<a href="/departments">click here</a>

<script src="/scripts/initial_service.js"></script>
</body>
</html>

answered Oct 17, 2018 at 12:05

Philipp Sander

10.3k7 gold badges49 silver badges80 bronze badges

Collectives™ on Stack Overflow

Why css, js do not connect to html in Spring MVC project?

2 Answers 2

9 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

9 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related