복붙노트

[SPRING] 스프링 부트 프로젝트에서 CSS와 같은 정적 파일을 어디에 둘까요?

SPRING

스프링 부트 프로젝트에서 CSS와 같은 정적 파일을 어디에 둘까요?

현재 사용중인 스프링 부트 프로젝트에서 필자의 견해는 다음과 같습니다.

<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)

어떤 유형의 파일을 저장할 수 있습니까?

해결법

  1. ==============================

    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 / 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를 응용 프로그램에서 사용하지 않았는지 확인하십시오. 그러면 스프링 부트의 스프링 MVC 자동 구성이 비활성화됩니다.

  2. ==============================

    2.Thymeleaf http://www.thymeleaf.org/를 사용할 수 있습니다.

    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>
    

    xmlns 및 xmlns : th를 html 태그에 추가해야합니다.

    application.properties를 확인하십시오.

    spring.resources.add-mappings=true
    

    이 키가 false로 설정되면, 스프링 부팅 응용 프로그램은 어떤 리소스도로드하지 않습니다.

  3. ==============================

    3.@EnableWebMvc를 비활성화하면 문제를 해결하는 데 도움이되었습니다.

    @EnableWebMvc를 비활성화하면 문제를 해결하는 데 도움이되었습니다.

  4. ==============================

    4.src / main / resources / static 아래에 @EnableWebMvc를 사용하지 않고 다른 곳에 두는 것 외에 classpath에 spring-boot-security가있는 경우 js 또는 css 폴더에 대한 액세스 권한을 부여해야합니다. 다음과 같이 추가합니다.

    src / main / resources / static 아래에 @EnableWebMvc를 사용하지 않고 다른 곳에 두는 것 외에 classpath에 spring-boot-security가있는 경우 js 또는 css 폴더에 대한 액세스 권한을 부여해야합니다. 다음과 같이 추가합니다.

    @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>
    
  5. ==============================

    5.내가 src / main / resources / META-INF / resources / static / css / signin.css 아래에 signin.css를 놓으면 /css/signin.css를 사용하여 액세스 할 수 있다는 것을 알았다.

    내가 src / main / resources / META-INF / resources / static / css / signin.css 아래에 signin.css를 놓으면 /css/signin.css를 사용하여 액세스 할 수 있다는 것을 알았다.

    왜 그래도.

  6. ==============================

    6.나는 Spring-Boot 2.0.2를 사용한다.

    나는 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>
    

    그것이 당신을 돕기를 바랍니다.

  7. ==============================

    7.제 경우에는 다음과 같이 css 및 js 폴더 안의 파일을 참조하십시오 :

    제 경우에는 다음과 같이 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 폴더에 폴더를 배치해야했습니다. 다음과 같은 폴더 구조가 있습니다.

    Myapp

    -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>
    

    정적 폴더 (리소스 아래)에 배치하면 작동하지 않습니다.

  8. from https://stackoverflow.com/questions/27170772/where-to-put-static-files-such-as-css-in-a-spring-boot-project by cc-by-sa and MIT license