通过国际化操作可以设置网页的语言属性。
使用国际化
1、创建语言配置文件
通过HTML页面需要设置国际化的标签的内容来设置中文和英文俩个版本
1、在当前项目的resource文件夹下创建 i20n (可自定义)文件夹,在i20n 下创建login.properties配置文件,然后再创建一个login_zh_CN.properties配置文件,创建完这个文件,IDEA会自动识别该文件夹为国际化配置文件,就会生成一个 Resource Boundle ‘login’ 文件夹,上面的俩个配置文件被包含在其中,然后右击该文件夹,addPropertise files
创建英文配置文件
最后会生成如下图文件夹
2、设置配置文件
打开login.properties 进行如下图操作
同时,在默认的application.properties配置文件中绑定配置
注意:properties会出现乱码,需要设置一下步骤来在编译时编成UTF-8编码
spring.messages.basename=i20n.login
3、将对应的HTML文件,即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">
<meta name="description" content="">
<meta name="author" content="">
<title>Signin Template for Bootstrap</title>
<!-- Bootstrap core CSS -->
<link href="asserts/css/bootstrap.min.css" rel="stylesheet">
<!-- Custom styles for this template -->
<link href="asserts/css/signin.css" rel="stylesheet">
</head>
<body class="text-center">
<form class="form-signin" action="dashboard.html">
<img class="mb-4" src="asserts/img/bootstrap-solid.svg" alt="" width="72" height="72">
<h1 class="h3 mb-3 font-weight-normal" th:text="#{login.tip}">Please sign in</h1>
<label class="sr-only" th:text="#{login.userName}">Username</label>
<input type="text" class="form-control" th:placeholder="#{login.userName}" required="" autofocus="">
<label class="sr-only" th:text="#{login.password}">Password</label>
<input type="password" class="form-control" th:placeholder="#{login.password}" required="">
<div class="checkbox mb-3">
<label>
<input type="checkbox" value="remember-me"> [[#{login.remember}]]
</label>
</div>
<button class="btn btn-lg btn-primary btn-block" type="submit" th:text="#{login.btn}">Sign in</button>
<p class="mt-5 mb-3 text-muted">© 2017-2018</p>
<!-- 此处设置超链接地址,后面自定义设置语言有用-->
<a class="btn btn-sm" th:href="@{/index.html(l='zh_CN')}">中文</a>
<a class="btn btn-sm" th:href="@{/index.html(l='en_US')}">English</a>
</form>
</body>
</html>
做完这一步,即可通过浏览器的默认设置来切换语言。
谷歌为例:在设置将中文语言置顶就会显示中文,将英文语言置顶就会显示英文。
4、创建MyLocalResolver.java 类
实现页面上的切换中文、英文的按钮来实现切换,具体解释看代码注释
package com.mcs.springboot05web.componet;
import com.sun.corba.se.spi.resolver.LocalResolver;
import org.springframework.web.servlet.LocaleResolver;
import org.thymeleaf.util.StringUtils;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import java.util.Locale;
// 我们需要通过我们通过当前页面的手动设置来调整语言
// 就需要我们写我们自己的判断语言的LocalResolver的实现类
// 使用springBoot 配置好的只会根据浏览器的默认语言来判断
public class MyLocalResolver implements LocaleResolver {
@Override
public Locale resolveLocale(HttpServletRequest httpServletRequest) {
// 获取链接中 l 的内容
String l = httpServletRequest.getParameter("l");
// 获取默认的区域语言设置,即通过浏览器设置的语言
Locale locale = Locale.getDefault();
// 如果 l 的值不为空,即我们手动点击了切换语言
if (!StringUtils.isEmpty(l)) {
// 将 l 字符串通过‘_' 进行分隔
String[] sp = l.split("_");
// 手动设置了语言信息,那就获取我们设置的信息来设置当前页面的语言
locale = new Locale(sp[0],sp[1]);
}
return locale;
}
@Override
public void setLocale(HttpServletRequest httpServletRequest, HttpServletResponse httpServletResponse, Locale locale) {
}
}
5、在自定义的配置类文件中
自定义完LocaleResolver实现类后,我们还需要new该类,并将其添加到容器中去来替代默认配置
package com.mcs.springboot05web.config;
import com.mcs.springboot05web.componet.MyLocalResolver;
import org.springframework.context.annotation.Bean;
import org.springframework.context.annotation.Configuration;
import org.springframework.web.servlet.LocaleResolver;
@Configuration
public class MyMvcConfig implements WebMvcConfigurer{
// 返回我们自定义的LocalResolver 类,将其添加到容器中
@Bean
public LocaleResolver localeResolver() {
return new MyLocalResolver();
}
}
运行结果