스프링부트 1 을 사용하던 엔터프라이즈 앱을 MSA 적용 작업을 통해 여러 앱으로 분리하면서 스프링부트 2로 업그레이드를 진행했습니다.

이 과정에서 다른 회사와 API 연동하고 있던 부분에서 인코딩 문제가 발생했습니다.

소스 이전을 진행하면서 빼먹은 부분이 있어서였죠.

이슈가 발생한 회사측에서 원인으로 얘기한 것은 응답 헤더의 Content-Type에 utf-8 인코딩 설정이 빠져있다는 것이었습니다.

그래서 확인해보니 스프링부트 1 기반 앱에서는 아래와 같은 설정이 있었습니다.

	@Bean
	public HttpMessageConverter<String> responseBodyConverter() {
		return new StringHttpMessageConverter(Charset.forName("UTF-8"));
	}

	@Bean
	public Filter characterEncodingFilter() {
		CharacterEncodingFilter characterEncodingFilter = new CharacterEncodingFilter();
		characterEncodingFilter.setEncoding("UTF-8");
		characterEncodingFilter.setForceEncoding(true);
		return characterEncodingFilter;
	}

그리고 테스트 결과 응답헤더의 Content-Type에 application/json;charset=utf-8 이라고 되어있는 것을 확인할 수 있었습니다.

하지만 신규 앱에서는 charset 정보가 빠져있었습니다.

그래서 위 설정을 그대로 스프링부트 2 기반의 신규로 개발한 앱쪽에 넣으려 했더니 앱 기동 시 오류가 발생했습니다.

***************************
APPLICATION FAILED TO START
***************************

Description:

The bean 'characterEncodingFilter', defined in class path resource [org/springframework/boot/autoconfigure/web/servlet/HttpEncodingAutoConfiguration.class], could not be registered. A bean with that name has already been defined in com.yanolja.affiliate.out.api.AffiliateOutApiApplication and overriding is disabled.

Action:

Consider renaming one of the beans or enabling overriding by setting spring.main.allow-bean-definition-overriding=true

이미 동일한 이름의 빈이 존재하니 오버라이드 할 수 있도록 설정을 변경하라는 얘기였죠.

근데 생각해보니 굳이 이렇게 해야하나 라는 생각이 들어 좀 찾아보니,

자바 소스에 저렇게 추가하지 않고 스프링 설정 만으로도 헤더의 인코딩 설정은 가능했습니다.

바로 server.servlet.encoding.charset 설정을 추가해주면 되었습니다. 

하위 버전에서는 이 설정이 spring.http.encoding.charset 으로 사용되었었습니다.

자바 소스에서 characterEncodingFilter 빈 생성로직을 제거하고, application.yml 파일에 아래와 같이 설정을 추가합니다.

server:
  servlet:
    encoding:
      charset: UTF-8

그리고 앱을 재부팅 해주면 응답헤더의 Content-Type 값이 application/json;charset=utf-8 으로 변경된 것을 확인할 수 있습니다.

만약 값이 바뀌지 않는다면 server.servlet.encoding.force-response 또는 server.servlet.encoding.force 설정값을 true로 설정해서 다시 해보시기 바랍니다.

참고문서: docs.spring.io/spring-boot/docs/current/reference/htmlsingle/#server.servlet.encoding.charset 

이번 포스팅에서는 @ 규칙에 대해서 알아보도록 하겠습니다.

문서에 다른 CSS파일을 import할 때 @import를 쓰게 됩니다.  

이런 규칙들이 몇가지 있는데 이번에는 다음 네가지에 대해서만 알아보도록 하겠습니다. 

• @import 외부 CSS파일을 현재 CSS파일에 import합니다.

• @charset CSS파일의 캐릭터셋을 지정합니다.

• @font-face 문서에서의 문서체를 지정합니다.

• !important 다른 스타일을 오버라이드 합니다.

NOTE: 위 네가지 이외에도 다른 규칙들도 있지만 여기서는 다루지 않습니다. 

The @import rule

이 규칙은 아래 두가지 방법중 한가지 방법으로 사용하시면 됩니다.

로컬파일을 import하는 방법과 url을 이용하여 원격파일을 import하는 방법이 있습니다. 

<style tyle="text/css">
<!--
@import "mystyle.css";
or
@import url("mystyle.css");
.......other CSS rules .....
-->
</style>

CSS를 모듈화 할 수 있게끔 해주는 규칙이므로 중요한 규칙이고 자주 사용하시게 될겁니다. 

The @charset Rule

캐릭터셋을 정의하는 규칙이죠. 별거 없습니다.

<style tyle="text/css">
<!--
@charset "iso-8859-1"
.......other CSS rules .....
-->
</style>

The @font-face Rule

문서내에서 사용될 문서체를 정의하는 규칙입니다. 또한 다운로드할 폰트의 위치를 지정해주기 위한 규칙이기도 합니다.

일반적으로 @font-face 규칙은 매우 복잡하고 폰트 전문가가 아닌 이상 사용을 권장하지도 않습니다.

다음 예제를 보시죠. 

<style tyle="text/css">
<!--
@font-face {
  font-family: "Scarborough Light";
 src: url("http://www.font.site/s/scarbo-lt");
}
@font-face {
 font-family: Santiago;
 src: local ("Santiago"),
 url("http://www.font.site/s/santiago.tt")
 format("truetype");
 unicode-range: U+??,U+100-220;
 font-size: all;
 font-family: sans-serif;
}
-->
</style>

The !important Rule

CSS가 브라우저에 적용될 때 순서대로 적용이 되도록 되어있습니다. 따라서 앞에서 정의했던 것이 적용이 된 뒤에 마지막에 정의한 것이 적용이 되는데 이때 동일한 요소에 대해서 다른 값을 정의해버리면 마지막에 정의한 값이 적용되고 앞에서 정의한 값은 적용이 되지 않습니다. 

만약 어떤 속성이 정말 중요해서 이건 실수로 오버라이드 되면 안된다 싶을때 사용하는것이 바로 이 !important 규칙입니다.  

이 규칙을 적용한 스타일은 문서의 어느곳에나 있어도 적용이 됩니다. 

다음 예제를 한번 보시죠.

<style tyle="text/css">
<!--
p { color: #ff0000; }
p { color: #000000; }
-->
</style>

동일한 요소에 서로다른 색상을 적용시키는 스타일이 선언되어있습니다. 앞에꺼는 빨간색, 뒤에꺼는 검은색이죠. 그러면 후자인 검정색만 적용이 됩니다. 이때 빨간색 속성이 중요한 속성이다라고 아래처럼 선언을 해주시면....

<style tyle="text/css">
<!--
p { color: #ff0000 !important; }
p { color: #000000; }
-->
</style>

뒤에 검은색 속성을 정의했다고 하더라도 빨간색이 적용되어지게 됩니다.

Reference : http://www.tutorialspoint.com/css/css_at_rules.htm