Spring Boot中静态资源访问的默认配置

╰+哭是因爲堅強的太久メ 2022-05-18 02:25 342阅读 0赞

传统的Java Web项目中,所有的静态文件和页面都是放在WebContent目录下。但在Spring Boot项目中,静态资源和页面文件都统一放在src/main/resources/static或者src/main/resources/public目录下对应的文件夹中。一般src/main/resources/static目录用于存放各类静态资源文件,例如css、js和image等。src/main/resources/templates用于存放页面文件,例如html,jsp等。如果我们不使用thyleleaf、FreeMaker、Velocity、JSP等, 默认的静态资源访问情况如下文所示。

完整的代码在这里,欢迎加星、fork。

1, 配置
因为我们不使用thyleleaf、FreeMaker、Velocity、JSP等,所以pom文件非常简单。本示例工程使用spring boot 2.0.0。pom文件中最重要的是spring-boot-starter-web依赖。其余的依赖都是额外附属的。例如webjars-locator-core,bootstrap,jquery是为了在html使用一些bootstrap和jquery的东西,但是又不想直接访问这些类库的对应资源URL,而是在java程序中包含了一份。lombok依赖是为了省略set get方法。

  1. <dependencies>
  2. <dependency>
  3. <groupId>org.springframework.boot</groupId>
  4. <artifactId>spring-boot-starter-web</artifactId>
  5. </dependency>
  6. <dependency>
  7. <groupId>org.webjars</groupId>
  8. <artifactId>webjars-locator-core</artifactId>
  9. </dependency>
  10. <dependency>
  11. <groupId>org.webjars</groupId>
  12. <artifactId>bootstrap</artifactId>
  13. <version>3.3.7</version>
  14. </dependency>
  15. <dependency>
  16. <groupId>org.webjars</groupId>
  17. <artifactId>jquery</artifactId>
  18. <version>3.1.0</version>
  19. </dependency>
  20. <dependency>
  21. <groupId>org.springframework.boot</groupId>
  22. <artifactId>spring-boot-starter-test</artifactId>
  23. <scope>test</scope>
  24. </dependency>
  25. <!-- springboot 热部署 -->
  26. <dependency>
  27. <groupId>org.springframework.boot</groupId>
  28. <artifactId>spring-boot-devtools</artifactId>
  29. <optional>true</optional>
  30. </dependency>
  31. <dependency>
  32. <groupId>org.projectlombok</groupId>
  33. <artifactId>lombok</artifactId>
  34. <optional>true</optional>
  35. </dependency>
  36. </dependencies>

2, 通过html访问
静态资源文件放在src/main/resources/static下对应得目录中。如图所示。

这里写图片描述

如果不使用thyleleaf、FreeMaker、Velocity,不讲将index.html页面放在在src/main/resources/templates,只能放在src/main/resources/static目录下面或者src/main/resources/public目录下面

  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset="UTF-8" />
  5. <title>Hello 静态资源访问演示程序</title>
  6. <!--<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>-->
  7. <link href="/css/main.css" rel="stylesheet">
  8. <link href="/webjars/bootstrap/css/bootstrap.min.css" rel="stylesheet">
  9. <script src="/webjars/jquery/jquery.min.js"></script>
  10. <script src="/hello.js"></script>
  11. </head>
  12. <body>
  13. <div>
  14. <img src="/img/cloud01.jpg"></img>
  15. <p class="user-id">The user id is </p>
  16. <p class="user-name">The user name is </p>
  17. </div>
  18. </body>
  19. </html>

3, 效果演示

访问css和js文件的效果
这里写图片描述

访问jpg图片的效果
这里写图片描述

4, 源代码分析

我们通过查看sping boot的源代码可以发现。系统默认我们配置了static和public路径。重点是”classpath:/META-INF/resources/”, “classpath:/resources/”, “classpath:/static/”, “classpath:/public/”

  1. public class ResourceProperties {
  2. private static final String[] CLASSPATH_RESOURCE_LOCATIONS = new String[]{
  3. "classpath:/META-INF/resources/", "classpath:/resources/", "classpath:/static/", "classpath:/public/"};
  4. private String[] staticLocations;
  5. private boolean addMappings;
  6. private final ResourceProperties.Chain chain;
  7. private final ResourceProperties.Cache cache;
  8. ...

启动日志图(index.html文件放在public目录下面了)
这里写图片描述

发表评论

表情:
评论列表 (有 0 条评论,342人围观)

还没有评论,来说两句吧...

相关阅读