开发喵星球

国际化是指将产品、服务、企业或组织的活动适应不同国家、不同文化背景和不同语言环境的过程。它包括将产品或服务适应不同的市场需求、文化习惯和法律法规等方面的工作。国际化的目的是拓展企业或组织的市场，提高竞争力和盈利能力。

一、前端国际化流程

1、html使用国际化

格式：#{资源文件key}

<form id="signupForm">
    <h4 class="no-margins">登录：</h4>
    <p class="m-t-md">你若不离不弃，我必生死相依</p>
    <input type="text"     name="username" class="form-control uname"  th:placeholder="#{user.login.username}"   />
    <input type="password" name="password" class="form-control pword"  th:placeholder="#{user.login.password}"   />
    <div class="row m-t" th:if="{captchaEnabled==true}">
        <div class="col-xs-6">
            <input type="text" name="validateCode" class="form-control code" th:placeholder="#{user.login.code}" maxlength="5" autocomplete="off">
        </div>
        <div class="col-xs-6">
            <a href="javascript:void(0);" title="点击更换验证码">
                <img th :src="@{captcha/captchaImage(type={captchaType})}" class="imgcode" width="85%"/>
            </a>
        </div>
    </div>
    <div class="checkbox-custom" th:classappend="${captchaEnabled==false} ? 'm-t'">
        <input type="checkbox" id="rememberme" name="rememberme"> <label for="rememberme" th:text="#{user.login.remember}">记住我</label>
    </div>
    <button class="btn btn-success btn-block" id="btnSubmit" data-loading="正在验证登录，请稍后..." th:text="#{user.login.submit}">登录</button>
</form>

2、js使用国际化 首先在文件引入jquery-i18n-properties依赖

然后在初始化后即可通过JS函数获取对应国际化文件的内容。

<!--jQuery国际化插件-->
<script src="../static/js/jquery.i18n.properties.min.js" th:src="@{/js/jquery.i18n.properties.min.js}"></script>

<script th:inline="javascript">
    //获取应用路径
    var ROOT = [[{#servletContext.contextPath}]];

    //获取默认语言
    var LANG_COUNTRY = [[{#locale.language+'_'+#locale.country}]];

    //初始化i18n插件
    .i18n.properties({
        path: ROOT + '/i18n/',//这里表示访问路径
        name: 'messages',//文件名开头
        language: LANG_COUNTRY,//文件名语言 例如en_US
        mode: 'map'//默认值
    });

    //初始化i18n函数
    function i18n(msgKey) {
        try {
            return.i18n.prop(msgKey);
        } catch (e) {
            return msgKey;
        }
    }

    //获取国际化翻译值
    console.log(i18n('user.login.username'));
    console.log(i18n('user.login.password'));
    console.log(i18n('user.login.code'));
    console.log(i18n('user.login.remember'));
    console.log(i18n('user.login.submit'));
</script>

3、界面定义切换语言

<a href="?lang=en_US"> 英语 </a>  
<a href="?lang=zh_CN"> 中文 </a>  

二、后端国际化流程

1、修改I18nConfig设置默认语言

如默认使用中文。

// 默认语言，英文可以设置Locale.US
slr.setDefaultLocale(Locale.SIMPLIFIED_CHINESE);

2、修改配置application.yml中的basename国际化文件

默认是i18n路径下messages文件（比如现在国际化文件是xx_zh_CN.properties、xx_en_US.properties，那么basename配置应为是i18n/xx

spring:
  # 资源信息
  messages:
    # 国际化资源文件路径
    basename: static/i18n/messages

3、i18n目录文件下定义资源文件

美式英语 messages_en_US.properties

user.login.username=User name
user.login.password=Password
user.login.code=Security code
user.login.remember=Remember me
user.login.submit=Sign In

中文简体 messages_zh_CN.properties

user.login.username=用户名
user.login.password=密码
user.login.code=验证码
user.login.remember=记住我
user.login.submit=登录

4、java代码使用MessageUtils获取国际化

MessageUtils.message("user.login.username")
MessageUtils.message("user.login.password")
MessageUtils.message("user.login.code")
MessageUtils.message("user.login.remember")
MessageUtils.message("user.login.submit")