I am using thymleaf engine.
I can get environment variable in .html file. But I failed to get environment variable in .js file. How to get environment variable in .js file not .html ?
The following code shows result when I defined environment variable in .js and .html
application.properties
huge=huge
When I defined environment variable in foo.html
<script type="text/javascript">
hugeOfHtml = "[[${#environment.getProperty('huge')}]]";
</script>
The result in chrome F12
<script type="text/javascript">
hugeOfHtml = "huge";
</script>
In contrast to When I defined environment variable in foo.js
hugeOfJs = "[[${#environment.getProperty('huge')}]]";
The result in chrome F12
hugeOfJs = "[[${#environment.getProperty('huge')}]]";
How to get environment variable in .js file not .html ?
I am assuming you are using spring boot 2 and thymeleaf 3. Most probably the externalized js file is located in the src/resources/static/ path and if so, then thymeleaf will not process it. Now say you move it to another directory src/resources/templates/js/, thymeleaf should process the externalized js file and give the result which you were expecting as you asked.
However given the externalized js file is not a static resource anymore, you will have to expose a get method in your controller to load the externalized js file. The method will look like so;
#Controller
public class FooController {
#GetMapping("/js/foo.js")
public String loadFooDotJs(){
return "/js/foo.js";
}
}
The method above will load the externalized js file, process it using thymeleaf and return it accordingly.
If you are using just spring; not spring boot, I believe you will have to create the template resolver and template engine as well. Here is a good article by Baeldung.
Related
I have a spring boot project where ‘/’ will be redirected to ‘/home’ in HomeController bcz of the setting in WebConfig class and from there the return string is “home” so the thymeleaf template engine will look for home.html inside the templates folder but instead of it is looking for mainLayout.html which is inside the layout folder which is inside the template folder.
I have seen some blogs on how to use thymleaf with spring but didn't get the solution.
This is the link for complete project:
https://github.com/sivaprasadreddy/jcart
Go to jcart-site then look for WebConfig class then look for HomeController class and then look for templates folder there check mainLayout.html
Do this in your index.html file
<script>
window.location="/home";
</script>
it will redirect to your homecontroller.
How can I keep links in my UI templates (e.g. Thymeleaf templates) in sync with the corresponding request mappings in my Spring application?
I've seen that e.g. the Play framework uses the #router-Object within its templates. How is it solved by Spring?
One example:
Spring Controller - simple
#Controller
public class UserController {
#GetMapping("/users/{username}")
public String getUser(#PathParam String username) {
// do some stuff....
return "user";
}
}
HTML-Page
<body>
User details
</body>
Now I want to change "/users" to "/accounts". I'm pretty sure that I've got to update every html page by hand to update the link. Is there an easier solution for this?
As far as I know, there is no simple way to do this with built-in tools from Spring. However, I don't think that this would be too hard to build. You would need the following:
A YAML file with all of your URL templates defined
A Properties Spring bean that contains your URL mappings (read from the YAML file)
All of your #RequestMapping annotations would have to be prop values; i.e.
#GetMapping("${urls.users.byUsername}")
A custom tag that knows about the Properties bean and can create URLs from the templates that were defined in your YAML file.
I have a Spring Boot 2.0 application that I'm trying to deploy as a WAR file. This means that it will have a custom context path. To test as a Java application I added
server.servlet.context-path=/MyApplication
to the application.properties. In my index.html (located in src/main/resources/static) I try to include Javascript using something like this:
<script src="dist/main.js"</script>
Regardless of whether I am using the context path, this always tries to load the file from http://localhost:8080/dist/main.js completely ignoring the context path I have specified. The same is true if I try to deploy my application as a WAR. The file is really at http://localhost:8080/MyApplication/dist/main.js.
What do I need to change in my configuration to make Spring Boot use the context path when serving static content?
I just figured it out. In my index.html I had set a base href:
<base href="/">
I converted index.html to a JSP and set the base href using a JSP tag:
<base href='<c:url value="/" />'>
Modify the <base href="/"> in index.html to the following,
<base href="./">
This will try to load all the scripts from the context path that is specified and it fixed the issue for me.
Updated: to describe the question more clearly
I create a web applicaiton with spring boot and thymeleaf, everything works fine if I open the login page, then login, then head for the management module or reports module sequently.
The proleam occurs when I type the url locahost:8080/send/kf/index(needs to authenticate, but I have open access to all in customized filter) in the browser, the page loads without js and css. In debug mode, I saw /send/kf was unexpectly put into the path like the following. I can get the resource if I access localhost:8080/assets/avatars/avatar.png.
The following is the folder structure I put my static resources. How could /send/kf automatically added into the url, please help me solve this problem. Thanks!
you can use spring.resources.static-locations in your application.properties file
spring.resources.static-locations=classpath:/resources/css/
spring.mvc.static-path-pattern=/resources/**
this is taken form documentation
Note:Static resources, like JavaScript or CSS, can easily be served from your Spring Boot application just be dropping them into the right place in the source code. By default Spring Boot serves static content from resources in the classpath at "/static" (or "/public")
Using /assets/ instead of assets/ fixes the issue, as otherwise it's a relative url that's supposed to get added to the end of existing url.
I find a solution for this question. I don't know how /send/kf is put into the url for the static resources, but I think if I put the controller mapping under the root path, this problem should avoid. As I think, the url is correct and resources can load successfully.
#Controller
public class ManualMessageController {
#Autowired
private MsgTemplateRepository msgTemplateRepository;
#RequestMapping("/manualMsg")
public String manualMsg(Model model){
model.addAttribute("msgTemplateList", msgTemplateRepository.findByStatus(1));
return "manualMessage";
}
}
updated:
The right solution is to use absolute path rather than relative path in the project. So change assets/css to /assets/css works.
I am using Spring Boot 2.0.0 M1 with WebFlux to build my sample web application. After succeeding with REST endpoints I've decided to add some views to my application. I've decided to use Thymeleaf 3.x version. I know that Spring serves static content from 4 default location:
/META-INF/resources/
/resources/
/static/
/public/
I've decided to go with second example so my css file is in /resources/static/css/. However after loading my page .css file was not found.
This is a screenshot from my IDE:
I am not providing my own configuration for static directory I just want to use default one. What might be important is the fact that templates are loading just fine from the /resources/templates/ directory.
Css file is loaded like this:
<link data-th-href="#{css/bootstrap.min.css}" rel="stylesheet">
App is not using normal Controller class instead I've provided function as a Bean to define my router:
#Bean
RouterFunction<?> router(final GeneratorHandler generatorHandler) {
return route(GET("/generate"), handler::render);
}
Any ideas what's wrong here?
I've found the right solution. In your RouterFunction you need to use:
return resources("/**", new ClassPathResource("/static/"))
This will set your static directory to:
:classpath/static