配置国际化页面

时间 2020-06-11

标签配置国际化页面繁體版

原文原文链接

配置国际化页面 css

1．编写多语言国际化配置文件html

在项目的类路径resources下建立名称为i18n的文件夹，并在该文件夹中根据须要编写对应的多语言国际化文件login.properties、login_zh_CN.properties和login_en_US.properties文件前端

login.tip=请登陆

login.username=用户名

login.password=密码

login.rememberme=记住我

login.button=登陆

login_zh_CN.propertiesweb

login.tip=请登陆

login.username=用户名

login.password=密码

login.rememberme=记住我

login.button=登陆

login_en_US.propertiesspring

login.tip=Please sign in

login.username=Username

login.password=Password

login.rememberme=Remember me

login.button=Login

须要说明的是，Spring Boot默认识别的语言配置文件为类路径resources下的messages.properties；其余语言国际化文件的名称必须严格按照“文件前缀名_语言代码_国家代码.properties”的形式命名浏览器

本示例中，在项目类路径resources下自定义了一个i18n包用于统一配置管理多语言配置文件，并将项目默认语言配置文件名自定义为login.properties，所以，后续还必须在项目全局配置文件中进行国际化文件基础名配置，才能引用自定义国际化文件app

2．编写配置文件ide

打开项目的application.properties全局配置文件，在该文件中添加国际化文件基础名设置，内容如文件

# 配置国际化文件基础名

       spring.messages.basename=i18n.login

spring.messages.basename=i18n.login”设置了自定义国际化文件的基础名。其中，i18n表示国际化文件相对项目类路径resources的位置，login表示多语言文件的前缀名。若是开发者彻底按照Spring Boot默认识别机制，在项目类路径resources下编写messages.properties等国际化文件，能够省略国际化文件基础名的配置

3.制区域信息解析器

在完成上一步中多语言国际化文件的编写和配置后，就能够正式在前端页面中结合Thymeleaf模板相关属性进行国际化语言设置和展现了，不过这种实现方式默认是使用请求头中的语言信息（浏览器语言信息）自动进行语言切换的，有些项目还会提供手动语言切换的功能，这就须要定制区域解析器了

在项目中建立名为com.lagou.config的包，并在该包下建立一个用于定制国际化功能区域信息解析器的自定义配置类MyLocalResovel

package com.lagou.config;

 

import
org.springframework.context.annotation.Bean;

import org.springframework.context.annotation.Configuration;

import org.springframework.lang.Nullable;

import
org.springframework.util.StringUtils;

import
org.springframework.web.servlet.LocaleResolver;

 

import
javax.servlet.http.HttpServletRequest;

import javax.servlet.http.HttpServletResponse;

import java.util.Locale;

 

 

@Configuration

public class MyLocaleResovel implements
LocaleResolver {

   
// 自定义区域解析方式

   
@Override

   
public Locale resolveLocale(HttpServletRequest httpServletRequest) {

       
// 获取页面手动切换传递的语言参数l

       
String l = httpServletRequest.getParameter("l");

       
// 获取请求头自动传递的语言参数Accept-Language

       
String header =
httpServletRequest.getHeader("Accept-Language");

       
Locale locale=null;

       
// 若是手动切换参数不为空，就根据手动参数进行语言切换，不然默认根据请求头信息切换

       
if(!StringUtils.isEmpty(l)){

           
String[] split = l.split("_");

           
locale=new Locale(split[0],split[1]);

       
}else {

           
// Accept-Language: en-US,en;q=0.9

         
,zh-CN;q=0.8,zh;q=0.7

           
String[] splits = header.split(",");

           
String[] split = splits[0].split("-");

           
locale=new Locale(split[0],split[1]);

       
}

       
return locale;

    }

   
@Override

   
public void setLocale(HttpServletRequest httpServletRequest, @Nullable

       
    HttpServletResponse
httpServletResponse, @Nullable Locale locale) {

    }

   
// 将自定义的MyLocalResovel类从新注册为一个类型LocaleResolver的Bean组件

   
@Bean

   
public LocaleResolver localeResolver(){

       
return new MyLocalResovel();

    }

}

MyLocalResolver自定义区域解析器配置类实现了LocaleResolver接口，并重写了其中的resolveLocale()方法进行自定义语言解析，最后使用@Bean注解将当前配置类注册成Spring容器中的一个类型为LocaleResolver的Bean组件，这样就能够覆盖默认的LocaleResolver组件。其中，在resolveLocale()方法中，根据不一样需求（手动切换语言信息、浏览器请求头自动切换语言信息）分别获取了请求参数l和请求头参数Accept-Language，而后在请求参数l不为空的状况下就以l参数携带的语言为标准进行语言切换，不然就定制经过请求头信息进行自动切换。

须要注意的是，在请求参数l的语言手动切换组装时，使用的是下划线“_”进行的切割，这是由多语言配置文件的格式决定的（例如login_zh_CN.properties）；而在请求头参数Accept-Language的语言自动切换组装时，使用的是短横线“-”进行的切割，这是由浏览器发送的请求头信息样式决定的（例如Accept-Language: en-US,en;q=0.9,zh-CN;q=0.8,zh;q=0.7）

4.页面国际化使用

打开项目templates模板文件夹中的用户登陆页面login.html，结合Thymeleaf模板引擎实现国际化功能

<!DOCTYPE html>

<html lang="en"
xmlns:th="http://www.thymeleaf.org">

<head>

   
<meta http-equiv="Content-Type" content="text/html;
charset=UTF-8">

   
<meta name="viewport" content="width=device-width,
initial-scale=1,shrink-to-fit=no">

   
<title>用户登陆界面</title>

   
<link th:href="@{/login/css/bootstrap.min.css}"
rel="stylesheet">

   
<link th:href="@{/login/css/signin.css}"
rel="stylesheet">

</head>

<body class="text-center">

<!-- 
用户登陆form表单 -->

<form class="form-signin">

   
<img class="mb-4"
th:src="@{/login/img/login.jpg}" width="72"
height="72">

   
<h1 class="h3 mb-3 font-weight-normal"
th:text="#{login.tip}">请登陆</h1>

   
<input type="text" class="form-control"

          
th:placeholder="#{login.username}" required=""
autofocus="">

   
<input type="password" class="form-control"

          
th:placeholder="#{login.password}" required="">

   
<div class="checkbox mb-3">

       
<label>

           
<input type="checkbox" value="remember-me">
[[#{login.rememberme}]]

       
</label>

   
</div>

   
<button class="btn btn-lg btn-primary btn-block"
type="submit" th:text="#{login.button}">登陆</button>

   
<p class="mt-5 mb-3 text-muted">© <span
th:text="${currentYear}">2018</span>-<span
th:text="${currentYear}+1">2019</span></p>

   
<a class="btn btn-sm"
th:href="@{/toLoginPage(l='zh_CN')}">中文</a>

   
<a class="btn btn-sm" th:href="@{/toLoginPage(l='en_US')}">English</a>

</form>

</body>

</html>

使用Thymeleaf模板的#{}消息表达式设置了国际化展现的部分信息。在对记住我rememberme国际化设置时，须要国际化设置的rememberme在<input>标签外部，因此这里使用了行内表达式[[#{login.rememberme}]]动态获取国际化文件中的login.rememberme信息。另外，在<form>表单尾部还提供了中文、English手动切换语言的功能连接，在单击连接时会分别携带国家语言参数向“/”路径请求跳转，经过后台定制的区域解析器进行手动语言切换

5.整合效果测试

ish”连接进行语言国际化切换时携带了指定的“l=zh_CN”参数，后台定制的区域解析器配置类MyLocalResovel中的解析方法会根据定制规则进行语言切换，从而达到了手动切换国际化语言的效果这些内容，是从拉勾教育的《Java工程师高薪训练营》里学到的，课程内容很是全面，还有拉勾的内推大厂服务，推荐你也看看。