Menu
I want to make page using thymeleaf. But I have some problem with the static files. I've investigated questions(1,2,3) with similar problem, but it didn't help me.
I use Spring Boot framework in the application.
My files look like:
test.html
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
<script src="js/test.js" th:src="@{/test.js}"/>
</head>
<body>
<button onclick="testFunction('test value')">Button</button>
</body>
</html>
test.js
function testFunction(test) {
console.log(test);
}
Configuration class
@Configuration
@EnableWebMvc
public class WebMvcConfig extends WebMvcConfigurerAdapter {
@Override
public void addResourceHandlers(ResourceHandlerRegistry registry) {
registry.addResourceHandler("/**").addResourceLocations("classpath:/static/js/");
super.addResourceHandlers(registry);
}
}
And problem, when I load test.html file with javascript not loaded.
@GetMapping(value = "web/test")
public String getTestHtmlPage() {
return "test";
}
/api/v1 is a configuration in application.properties => server.servlet-path=/api/v1
What do I do wrong? Can you help me?
Thanks all!
485
For a better understanding of registry.addResourceHandler("/**").addResourceLocations("classpath:/static/js/");
I wrote a more thorough answer here that discusses invalid resource location mappings. It didn't receive any upvotes, so I hope it's not terrible. :-)
In short, with the way you're mapping classpath:/static/js/, and then accessing, /js/test.js, you're telling Spring to look in /static/js/js/test.js.
What you probably want is classpath:/static/. In that case, when you try to access /js/test.js, it's looking in /static/js/test.js for the file instead.
As for Thymeleaf, I've never used it, but docs indicate you should load scripts with th:src instead of th:href. th:href appears to only be for HTML content.
57
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
