i18n을 java 및 angular js에 적용

i18n 이란 

Edit

국제화라는 뜻으로 작게 웹에서 보면 각 나라 언어에 맞게 메시지를 출력하도록 도와주는 것이다.  internationalization의 약잔데 i와 n사이에 18글자가 있다는 뜻이다.

i18n 환경설정

Edit

• /webapp/WEB-INF/spring/appServlet/servlet-context.xml 설정

  <!-- 사용자의 브라우져의 Locale 정보를 이용하지 않고 사용자가 선택하여 언어를 직접 선택할 수 있도록  CookieLocaleResolver로 구현한다. -->  <bean id="localeResolver"  class="org.springframework.web.servlet.i18n.CookieLocaleResolver" >  <property name="cookieName" value="lang"/>  <property name="cookieMaxAge" value="100000"/>  <property name="cookiePath" value="/"/>  <property name="defaultLocale" value="en"/>  </bean> <!-- 특정 Locale 의 요청을 가로채서 파라미터에 넘어온 값으로 Locale 을 알아낸다. -->  <bean id="localeChangeInterceptor" class="org.springframework.web.servlet.i18n.LocaleChangeInterceptor">  <property name="paramName" value="lang" /> <!-- 다국어를 지원해야 하므로 메세지를 MessageSource 로 추출하여 구현한다. -->  <bean id="messageSource" class="org.springframework.context.support.ReloadableResourceBundleMessageSource">  <property name="basenames">  <list>  <value>/resources/i18n/messages</value> <!-- js 파일에서도 읽어들일 수 있도록 webapp 경로로 변경 -->  </list>  </property>  <property name="fallbackToSystemLocale" value="false"/>  <property name="defaultEncoding" value="UTF-8" />  <property name="cacheSeconds" value="180"/>  </bean> ...

  
  
• /webapp/resources/app/i18n.js 생성

  var siteI18n = angular.module('site.i18n', []); siteI18n.service('i18n', function () {  ...  this.setLanguage = function (language) {  $.i18n.properties({  name: 'messages',  path: '/resources/i18n/', //webapp 경로 설정  ....  ...

  
  
• /webapp/resources/app/site.js 에 i18n.js 등록

  var Site = angular.module('Site', [ 'site.services','site.directives','ui.bootstrap','ngAtmosphere','ngNvd3', 'ngActivity','site.i18n' ]);

  
  

• /webapp/WEB-INF/views/includes/_footer.jsp 에 다국어 선택 시 Action (쿠키값 설정)  

  < script src="/resources/js/jquery/jquery.cookie.js"></ script >  < script type="text/javascript">  function changeLanguage (lang) {  $.cookie('lang' , lang, { expires : 30, path : '/' });  location.reload();  } </script>

  
  

i18n 사용

Edit

• angularJs 에서 i18n을 사용하기 위한 설정
  • 사용할 controller js 수정
    ex) monitoringController.js
    function MonitoringListCtrl($scope, $http, alertService, nvd3Factory, i18n) { //i18n 사용
    
    
• jsp, html 파일
  • spring tag 사용 : <spring:message code="Login" /> OR <spring:message code="Login" text="Repositories" />
  • angularJs 사용 : <msg key="Login" />
    
    
• js 파일
• $.i18n.prop("Login")
  
  
• java 파일
  • Controller 에서 사용  

    public class HomeController { ... @Resource(name="messageSource") private MessageSource messageSource; ... public boolean test() { messageSource.getMessage(" Login ", null, LocaleContextHolder.getLocale()); }

    
    
  • Controller 이외에서 사용
    -  Controller 에서 파라미터로 MessageSource를 넘겨서 사용함
    ex)  MessageUtils messageUtils = new MessageUtils(messageSource);