1
votes

I am currently developing a web application of the spring boot and thymeleaf. I managed to set up in the web-front by calling the resources css and js from the folder "resources/static".

However, for user space in the "resources/template/app/index.html" folder, I can not call my css in "resources/static/app_css/bootstrap.css".

Here is the tree of my file:

enter image description here

My index.html from resources/templates/app/

    <!DOCTYPE html>
    <html lang="en" xmlns:th="http://www.w3.org/1999/xhtml">
    <head th:include="app_fragments/header :: header">
        <p>Header</p>
    </head>
    <body>
   <!-- Indicates a successful or positive action -->
<button type="button" class="btn btn-success">Success</button>
    </body>
    </html>

My header fragment from resources/templates/app_fragments/:

<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head th:fragment="header">
    <meta charset="utf-8"/>
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0"/>
    <meta name="description" content=""/>
    <meta name="author" content=""/>
    <link rel="shortcut icon" th:href="@{../resources/app_fonts/app_images/favicon.png}" href="../resources/static/app_fonts/app_images/favicon.png"  type="image/png"/>
    <title>Toto</title>
<!-- Plugins CSS -->
<link rel="stylesheet" type="text/css" media="all" th:href="@{../resources/static/app_css/bootstrap.min.css}" href="../resources/static/app_css/bootstrap.min.css" />
</head>
</html>

when I go into the user space, I can't load my Bootstrap file from http://localhost:8081/app/index.html enter image description here

How a can resolve it ?

Thanks in advance.

1

1 Answers

1
votes

You should read on "How to serve static content with Spring Boot".

I already answered this question here:

Spring Boot CSS Showing up blank / not loading after trying everything

To make a long story short, first move your static content to the proper folder, here's a quote from spring docs:

By default Spring Boot will serve static content from a directory called /static (or /public or /resources or /META-INF/resources) in the classpath or from the root of the ServletContext

after that, you'll need to make some configuration to bust your browser cache.

try first clean your browser cache, in google chrome you go to settings then clear browsing data.

Secondly, add these lines to your application.properties file in order to bust the cache:

spring.resources.chain.strategy.content.enabled=true
spring.resources.chain.strategy.content.paths=/**

or add this instead:

spring.resources.chain.strategy.fixed.enabled=true
spring.resources.chain.strategy.fixed.paths=/**
spring.resources.chain.strategy.fixed.version=v12