1. 코드 구성
@Configuration
public class WebMvcConfig implements WebMvcConfigurer {
@Override
public void configureViewResolvers(ViewResolverRegistry registry) {
MustacheViewResolver resolver = new MustacheViewResolver();
resolver.setPrefix("classpath:/templates/");
resolver.setSuffix(".html");
registry.viewResolver(resolver);
}
}
- Mustache 템플릿 엔진을 사용해서 html 파일을 읽도록 설정을 해줬습니다.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<h1>로그인 페이지입니다.</h1>
</body>
</html>
- login.html 페이지는 이렇게 구성했습니다.
@GetMapping("/login")
public String login() {
return "login";
}
- Controller 메서드는 다음과 같이 구성했습니다.
2. 문제 발생
localhost:8080/login 요청 시 랜더링 결과
- 한글이 ?로 깨져서 나오는 것을 확인했습니다.
개발자 도구 확인
- 개발자 도구에 들어가서 확인해보니 UTF-8로 되어있는 것이 아니라 ISO-8859-1로 되어있었습니다.
3. 문제 분석
- 아마도 MustacheViewResolver에서 html 파일을 읽게하는 부분에서 charset, Content-Type을 따로 설정해주지 않은 것이 문제로 보였습니다.
4. 문제 해결
@Configuration
public class WebMvcConfig implements WebMvcConfigurer {
@Override
public void configureViewResolvers(ViewResolverRegistry registry) {
MustacheViewResolver resolver = new MustacheViewResolver();
resolver.setPrefix("classpath:/templates/");
resolver.setSuffix(".html");
resolver.setCharset("UTF-8");
resolver.setContentType("text/html;charset=utf-8");
registry.viewResolver(resolver);
}
}
- charset과 ContentType에 대한 설정 코드를 추가해줬습니다.
한글 설정 완료
- 개발자 도구에서도 Content-Type이 변경된 것을 확인해볼 수 있습니다.
