【问题标题】:Where to put static files such as CSS in a spring-boot project?在 spring-boot 项目中将 CSS 等静态文件放在哪里?
【发布时间】:2015-01-26 01:22:25
【问题描述】:

在我当前的 spring-boot 项目中,我的观点是这样的:

<link href="signin.css" rel="stylesheet"/>

引用静态 css 文件。当我运行项目并访问引用此文件的视图之一时,我会收到 404 未找到错误或 403 未授权错误,具体取决于我将文件放入项目中的位置。

到目前为止我尝试过这个:

src/main/resources/static/css (with this, I use css/signin.css instead of signin.css)

src/main/resources/templates/static/css (with this, I use css/signin.css instead of signin.css)

src/src/main/resources/templates/acesso (same folder of the html file)

存储此类文件的正确位置是什么?

【问题讨论】:

    标签: spring spring-boot


    【解决方案1】:

    src/main/resources/static 下方的任何位置都适合放置静态内容,例如 CSS、JavaScript 和图像。静态目录由/ 提供。例如,src/main/resources/static/signin.css 将从 /signin.css 提供,而 src/main/resources/static/css/signin.css 将从 /css/signin.css 提供。

    src/main/resources/templates 文件夹用于视图模板,这些模板将由 Thymeleaf、Freemarker 或 Velocity 等模板引擎转换为 HTML。您不应将静态内容放在此目录中。

    还要确保您没有在应用程序中使用@EnableWebMvc,因为这将禁用 Spring Boot 的 Spring MVC 自动配置。

    【讨论】:

    • 对我来说运气不好,这里发布的解决方案都不适合我:/
    • 是否需要进行任何配置才能使 spring boot 使用 src/main/resources/static 作为默认位置?除非我从带有完整 URL 的 CDN 加载它,否则它不会获取我的 CSS。
    • 不,这是默认位置。只要确保您没有在应用程序中使用@EnableWebMvc,因为这将禁用 Spring Boot 的 Spring MVC 自动配置。
    • 嗨 @AndyWilkinson,当我必须在我的 Spring Boot 应用程序中使用 EnableWebMvc 时,我可以知道如何处理这种情况。
    • 为什么必须使用@EnableWebMvc 而不是WebMvcConfigurerAdapter
    【解决方案2】:

    除了将它放在src/main/resources/static 下的任何位置并且不使用@EnableWebMvc 之外,您还需要授权访问您的jscss 文件夹,特别是如果您的类路径中有spring-boot-security。您将添加如下内容:

    @Configuration
    @EnableWebSecurity
    public class MainSecurityConfig extends WebSecurityConfigurerAdapter {
        @Override
        protected void configure(HttpSecurity http) throws Exception {
            http
                .authorizeRequests()
                    .antMatchers("/", "/home", "/js/**", "/css/**").permitAll()
                    .anyRequest().authenticated()
                    .and()
                .formLogin()
                    .loginPage("/login")
                    .permitAll()
                    .and()
                .logout()
                    .permitAll();
        }
    }
    

    然后在你的 HTML 中:

    <link rel="stylesheet"  href="/css/bootstrap.min.css">
    <script src="/js/bootstrap.min.js"></script>
    

    【讨论】:

    • 这对我有用。但这对安全 POV 来说不是不安全吗?
    • @SwapnilIngle 如果您希望某些资源是安全的,请修改您的 antMatchers。
    • 好的,谢谢!但是公开你的 js 和/或 CSS 资源是常见的/好的做法吗?
    【解决方案3】:

    你可以使用 Thymeleaf http://www.thymeleaf.org/

    例子

    <html xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.thymeleaf.org">
    <head>
        <link rel="stylesheet" th:href="@{/css/signin.css}"/>
    </head>
    <body>
    </body>
    </html>
    

    记得在你的 html 标签中添加 xmlns 和 xmlns:th。

    检查您的 application.properties:

    spring.resources.add-mappings=true
    

    如果该键设置为 false,spring boot 应用将不会加载任何资源。

    【讨论】:

    • 这不起作用。你必须把它放在这个文件夹中。 /src/main/resources/static/css/signing.css
    • 最佳答案
    【解决方案4】:

    禁用@EnableWebMvc 帮助我解决了问题。

    【讨论】:

      【解决方案5】:

      我使用 Spring-Boot 2.0.2

      我仍然在我的webConfig.java 中保留@EnableWebMvc 注释并覆盖addResourceHandlers() 方法以帮助浏览器通过http 请求访问css 和javascript 文件。

      这是 webapp 目录的结构

      .

      webConfig.java

      @Configuration
      @EnableWebMvc
      @ComponentScan(basePackages = "example.com")
      public class WebConfig implements WebMvcConfigurer {
      
          // =======================================
          // =             Bean Config             =
          // =======================================
      
          @Bean
          public InternalResourceViewResolver getInternalResourceViewResolver(){
              InternalResourceViewResolver resolver = new InternalResourceViewResolver();
              resolver.setPrefix("/WEB-INF/jsp/");
              resolver.setSuffix(".jsp");
      
              return resolver;
          }
      
      
          // =======================================
          // =          Override Methods           =
          // =======================================
      
          @Override
          public void addResourceHandlers(ResourceHandlerRegistry registry) {
              registry.addResourceHandler("/pdfs/**")
                      .addResourceLocations("/WEB-INF/pdfs/");
      
              registry.addResourceHandler("/css/**")
                      .addResourceLocations("/WEB-INF/css/");
      
              registry.addResourceHandler("/js/**")
                      .addResourceLocations("/WEB-INF/js/");
          }
      }
      

      index.jsp 头部标签:

      <head>
          <title>Title</title>
      
          <!-- Custom styles for this template -->
          <link href="css/cover.css" rel="stylesheet">
      </head>
      

      希望对你有帮助。

      【讨论】:

      • 现在可能没用了。 2014年提出的问题。尝试回答最近的问题。会帮助你和我......
      • @Ashish451 对不起,如果不是这样,但如果答案很好并且有贡献,那么回答老问题并没有错:)。 meta.stackexchange.com/questions/23996/…
      • 不工作。尝试使用这个registry.addResourceHandler("/WEB-INF/**").addResourceLocations("classpath:/WEB-INF/");
      【解决方案6】:

      我使用带有 Thymeleaf 的 Spring-Boot http://www.thymeleaf.org/

      这是目录的结构,类似于@Andy Wilkinson Response

      例子

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

      【讨论】:

      • 只是作为这个示例,如果您忘记了,请删除 thymleaf 声明中的 static 关键字。该示例运行良好。
      【解决方案7】:

      我发现如果我将我的 signin.css 放在 src/main/resources/META-INF/resources/static/css/signin.css 下,那么我可以使用 /css/signin.css 访问它

      不知道为什么。

      【讨论】:

        【解决方案8】:

        在我的例子中,像这样引用 css 和 js 文件夹中的文件:

        <script src="js/bootstrap.min.js"></script>
        <link href="css/bootstrap.min.css" rel="stylesheet">
        <link href="css/carousel.css" rel="stylesheet">
        

        我必须将文件夹放在 webapp 文件夹中。 我有以下文件夹结构:

        我的应用

        -src
             -main
                   -java
                   -resources
                            -static
                            -templates
                   -webapp
                          -resources
                          -WEB-INF
        

        我的意思是,如果我将 css 和 js 文件夹放在资源文件夹中(在 main 下),它会是:

        <link href="../resources/css/carousel.css" rel="stylesheet">
        <link href="../resources/css/bootstrap.min.css" rel="stylesheet">
        <script src="../resources/js/bootstrap.min.js"></script>
        

        如果我将它们放在静态文件夹中(在资源下)它不起作用。

        【讨论】:

        • 我真的有用吗?我不能让它与 bootstrap.min.css 或 bootstrap.min.js 之类的名称一起使用,而与基本名称中没有点的名称(例如 somestyle.css 或 somescript.js)完美搭配。见stackoverflow.com/questions/47722325/…
        【解决方案9】:

        当我使用时:

        src/main/resources/static/css.
        

        我的观点是这样的:

        <link rel="stylesheet" href="/css/signin.css" />
        

        【讨论】:

          【解决方案10】:
          • src/resource/static/css
          • src/resource/static/js
          • src/resource/static/images

          如果您使用的是 spring boot 并检查 spring sercurity,请不要使用 @EnableWebMvc。

          【讨论】:

            【解决方案11】:

            在 spring boot 中将所需文件放入 static 文件夹中。然后就可以直接访问jsp里面需要的文件了。

            希望它对我有用。

            【讨论】:

              猜你喜欢
              • 1970-01-01
              • 1970-01-01
              • 2023-04-10
              • 2015-12-24
              • 2017-10-20
              • 1970-01-01
              • 2015-05-22
              相关资源
              最近更新 更多