본문 바로가기

더 나은 엔지니어가 되기 위해/지금은 안쓰는 자바

[스프링 부트 개념과 활용] 웹 MVC 설정 2. 정적 리소스와 웹 JAR

인프런에서 백기선님의 스프링부트 개념과 활용 강의를 듣고, 개인적으로 공부하며 핵심만 정리한 글입니다.

정적 리소스 지원

1) 기본 리소스 위치

기본 리소스 위치는 다음과 같다.

  • classpath:/static
  • classpath:/public
  • classpath:/resources/
  • classpath:/META-INF/resources

예를 들어, resources/static/hello.html 을 만들면 http://localhost:8080/hello.html 로 접근할 수 있다.

2) 접근 url path 설정

기본 리소스 위치에 대한 접근 url 설정은 application.properties 에서 spring.mvc.static-path-pattern 을 통해서 바꾸면 된다.

예를 들어, spring.mvc.static-path-pattern = /static/** 으로 설정하면,
http://localhost:8080/static/hello.html 으로 접근해야 한다.

3) 리소스 핸들러 커스터마이징

기존 스프링 부트의 리소스 핸들러에, 추가적인 커스터마이징을 할 수 있다.

config/WebConfig.java 를 만들고 다음 내용을 입력하자.

@Configuration
public class WebConfig implements WebMvcConfigurer {

  @Override
  public void addResourceHandlers(ResourceHandlerRegistry registry) {
    registry.addResourceHandler("/m/**")
      .addResourceLocations("classpath:/m/")
      .setCachePeriod(20);
  }
}

WebMvcConfigurer 를 커스터마이징하기 위해 인터페이스로 구현한 클래스를 선언하고, addResourceHandlers 로 리소스 핸들러를 추가한다.

위 코드는 /m/ 으로 시작하는 리소스 요청이 오면, classpath:/m/ 위치에서 해당 리소스를 찾겠다는 의미이다.
예를 들어, http://localhost:8080/m/hello.html 요청이 오면 resources/m/hello.html 을 찾아서 보내준다.

웹 JAR

Maven Repository 에 올라와있는 웹 JAR 형태의 파일을 활용할 수 있다.
웹 JAR 란, 클라이언트에서 사용하는 웹 라이브러리를 JAR 파일 안에 패키징 한 것이다.

예를 들어, jQuery 의 웹 JAR 를 사용한다고 해보자.
먼저 Maven Repository 를 참고하여 pom.xml 에 다음을 추가한다.

<dependency>
  <groupId>org.webjars.bower</groupId>
  <artifactId>jquery</artifactId>
  <version>3.4.1</version>
</dependency>

이제 html 파일에서 다음과 같이 활용할 수 있다.

<body>
<script src="/webjars/jquery/3.4.1/dist/jquery.min.js"></script>
<script type="text/javascript">
    $(function () {
        console.log("jQuery ready");
    });
</script>
</body>

만약 버전을 생략하고 사용하고 싶으면, webjars-locator-corepom.xml 에 추가하자.

<dependency>
  <groupId>org.webjars</groupId>
  <artifactId>webjars-locator-core</artifactId>
  <version>0.43</version>
</dependency>

이제 html 내에서 다음과 같이 버전을 명시해주지 않아아도 된다.

  • /webjars/jquery/3.4.1/dist/jquery.min.js
  • /webjars/jquery/dist/jquery.min.js 로 수정한다.

인덱스 페이지, 파비콘 설정

둘 다 resources/ 내에 index.html, favicon.ico 의 이름으로만 존재하면 된다.
스프링 부트 설정이 찾아서 알아서 바인딩 해줌.