Andy Ho
Andy Ho

Reputation: 1074

spring boot + thymeleaf 3+bootStrap, Configuration bootstrap return 404 error

I can't import Bootstrap static resources when I configure thymeleaf and Bootstrap in Spring-boot. I know there are many similar problems, but I can't solve them for me.

if i use web resources like

<link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet">

,it work for me ,but i need to use static resources, When I made the following configuration,and it give me 404 error

the web page like this,
book.html:

<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.w3.org/1999/xhtml" >
<head>
    <meta charset="UTF-8"/>
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>book</title>
    <link th:href="@{/css/bootstrap.css}" rel="stylesheet"/>
</head>
<body>

<div class="container" style="max-width: 700px;">
    <h2 class="page-header" style="margin-top: 70px;">note</h2>
<div class="well" th:object="${book2}">
    <p>
        <strong>at:</strong><span th:text="*{at}">default</span>
    </p>
    <p>
        <strong>name:</strong><span th:text="*{name}">default</span></p>
    <p>
        <strong>number:</strong><span th:text="*{number}">default</span></p>
    <p>
        <strong>retest:</strong><span th:text="*{retest}">default</span></p>
</div>
</div>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/jquery.min.js">
</script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.min.js"></script>




</body>
</html>

Maven setting
pom.xml:

<?xml version="1.0" encoding="UTF-8"?>
<project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
         xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/xsd/maven-4.0.0.xsd">
    <modelVersion>4.0.0</modelVersion>
    <parent>
        <groupId>org.springframework.boot</groupId>
        <artifactId>spring-boot-starter-parent</artifactId>
        <version>2.1.4.RELEASE</version>
        <relativePath/> <!-- lookup parent from repository -->
    </parent>
    <groupId>com.ahua</groupId>
    <artifactId>springdemo</artifactId>
    <version>0.0.1-SNAPSHOT</version>
    <name>springdemo</name>
    <description>Demo project for Spring Boot</description>

    <properties>
        <java.version>11</java.version>
    </properties>

    <dependencies>
        <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-starter-web</artifactId>
        </dependency>

        <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-starter-test</artifactId>
            <scope>test</scope>
        </dependency>
        <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-starter-thymeleaf</artifactId>
        </dependency>
        <dependency>
            <groupId>org.mariadb.jdbc</groupId>
            <artifactId>mariadb-java-client</artifactId>
        </dependency>
        <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-starter-data-jpa</artifactId>
        </dependency>
    </dependencies>
    <build>
        <plugins>
            <plugin>
                <groupId>org.springframework.boot</groupId>
                <artifactId>spring-boot-maven-plugin</artifactId>
            </plugin>
        </plugins>
    </build>

</project>

spring-boot yml setting,I had used "context-path: /path",

I don't know if it will affect the resource path.
application-uat.yml:

server:
  port: 8081
  servlet:
    context-path: /path    
logging:
  level:
    root: WARN
    com:
      ahua:
        springdemo: Debug
  file: log/mylog
book:
  name: 測試參數UAT
  number: 77777
  at: at參數${random.uuid}
  retest: ${book.name},try it
spring:
  datasource:
    driver-class-name: org.mariadb.jdbc.Driver
    url: jdbc:mariadb://127.0.0.1:3306/book?useUnicode=true&characterEncoding=utf-8
    username: fansofcheer
    password: cheerstyle

  jpa:
    hibernate:
      ddl-auto: update
    show-sql: true

![project configuration]: https://drive.google.com/open?id=1MPti9SzDdllsGsipVtnpHCeZQtSgFgmk

![error page]:https://drive.google.com/open?id=1qWghnGlyCV4lG0684-1kj_scIyX2dFaM

Upvotes: 0

Views: 1682

Answers (1)

Avijit Barua
Avijit Barua

Reputation: 3086

Try changing

<link th:href="@{/css/bootstrap.css}" rel="stylesheet"/>

to

<link href="/css/bootstrap.css" rel="stylesheet" th:href="@{/css/bootstrap.css}">

Upvotes: 1

Related Questions