SpringBoot国际化步骤
1、编写国际化配置文件
首先创建一个文件夹i18n，并生成一个配置文件组：
idea扫描到文件名包含国家语言信息，自动分为一组配置文件
选择如下选项，可以在同一页面中编辑多个配置文件的不同属性。
这里创建了三个属性，分别是userID，password，btn
2、编写全局配置文件
在application.properties中配置国际化文件位置：
spring.messages.basename=i18n/login
若文件格式为Yaml文件，则进行如下配置：
spring:
messages:
basename: i18n/login
3、编写区域解析器
3.1、定义MyLocaleResolver并实现LocaleResolver接口，对区域信息进行解析：
package com.tracy.springbootdemo.component;
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;
/**
* @author Tracy
* @date 2020/4/26 13:53
*/
public class MyLocaleResolver implements LocaleResolver {
// public MyLocaleResolver() {
// System.out.println("MyLocaleResolver无参构造");
// }
@Override
public Locale resolveLocale(HttpServletRequest request) {
String l = request.getParameter("l"); //收到请求的参数
System.out.println(l);
Locale locale;
if (!StringUtils.isEmpty(l)) { //如果携带了参数
String[] s = l.split("_");
locale = new Locale(s[0], s[1]); //使用创建的locale对象进行解析
} else {
locale = request.getLocale(); //使用系统默认
}
return locale;
}
@Override
public void setLocale(HttpServletRequest httpServletRequest, HttpServletResponse httpServletResponse, Locale locale) {
}
}
3.2、在容器中添加组件
package com.tracy.springbootdemo.config;
import com.tracy.springbootdemo.component.LoginInterceptor;
import com.tracy.springbootdemo.component.MyLocaleResolver;
import org.springframework.context.annotation.Bean;
import org.springframework.stereotype.Component;
import org.springframework.web.servlet.LocaleResolver;
import org.springframework.web.servlet.config.annotation.InterceptorRegistry;
import org.springframework.web.servlet.config.annotation.ResourceHandlerRegistry;
import org.springframework.web.servlet.config.annotation.ViewControllerRegistry;
import org.springframework.web.servlet.config.annotation.WebMvcConfigurer;
/**
* Created by Tracy on 2020/3/20 12:26
*/
@Component
public class MySpringBootConfig implements WebMvcConfigurer {
@Bean
public LocaleResolver localeResolver() { //添加区域解析器对象
return new MyLocaleResolver();
}
}
3.3、测试容器中是否含有组件
打开测试类，文件位置如下图所示：
编写测试类：
package com.tracy.springbootdemo;
import com.tracy.springbootdemo.component.MyLocaleResolver;
import org.springframework.context.ApplicationContext;
import org.junit.jupiter.api.Test;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.boot.test.context.SpringBootTest;
@SpringBootTest
class SpringbootDemoApplicationTests {
@Autowired
ApplicationContext ioc;
@Test
void testLocale() { //判断容器中是否含有该组件
//注：若容器中加入了函数组件，则组件名就是方法名
System.out.println(ioc.containsBean("localeResolver"));
System.out.println(ioc.getBean(MyLocaleResolver.class));
}
}
运行测试函数：
运行结果：
组件加入容器成功！
4、页面元素抽取
登陆页面login.html：
<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Bootstrap Login Form Template</title>
<!-- CSS -->
<link rel="stylesheet" href="http://fonts.googleapis.com/css?family=Roboto:400,100,300,500" th:href="@{http://fonts.googleapis.com/css?family=Roboto:400,100,300,500}">
<link rel="stylesheet" href="assets/bootstrap/css/bootstrap.min.css" >
<link rel="stylesheet" href="assets/font-awesome/css/font-awesome.min.css" th:href="@{assets/font-awesome/css/font-awesome.min.css}">
<link rel="stylesheet" href="assets/css/form-elements.css" th:href="@{assets/css/form-elements.css}">
<link rel="stylesheet" href="assets/css/style.css" th:href="@{assets/css/style.css}">
<!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
<script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>
<![endif]-->
<!-- Favicon and touch icons -->
<link rel="shortcut icon" href="assets/ico/favicon.png" th:href="@{assets/ico/favicon.png}">
<link rel="apple-touch-icon-precomposed" sizes="144x144" >
<link rel="apple-touch-icon-precomposed" sizes="114x114" >
<link rel="apple-touch-icon-precomposed" sizes="72x72" >
<link rel="apple-touch-icon-precomposed" >
</head>
<body>
<!-- Top content -->
<div class="top-content">
<div class="inner-bg">
<div class="container">
<div class="row">
<div class="col-sm-8 col-sm-offset-2 text">
<h1><strong>Bootstrap</strong> Login Form</h1>
<div class="description">
<p>
This is a free responsive login form made with Bootstrap.
Download it on <a href="#"><strong>AZMIND</strong></a>, customize and use it as you like!
</p>
</div>
</div>
</div>
<div class="row">
<div class="col-sm-6 col-sm-offset-3 form-box">
<div class="form-top">
<div class="form-top-left">
<h3>Login to our site</h3>
<p>Enter your username and password to log on:</p>
</div>
<div class="form-top-right">
<i class="fa fa-lock"></i>
</div>
</div>
<div style="font-size: 20px" class="label label-danger" th:text="${msg}" th:if="${not #strings.isEmpty(msg)}"></div>
<div style="font-size: 20px" class="label label-danger" th:text="${NoUser}" th:if="${not #strings.isEmpty(NoUser)}"></div>
<div style="font-size: 20px" class="label label-danger" th:text="${Error}" th:if="${not #strings.isEmpty(Error)}"></div>
<div class="form-bottom">
<form role="form" action="show.html" th:action="@{/login}" method="post" class="login-form">
<div class="form-group">
<input type="text" name="id" th:placeholder="#{login.userID}" class="form-username form-control" id="form-username">
</div>
<div class="form-group">
<input type="password" name="password" th:placeholder="#{login.password}" class="form-password form-control" id="form-password">
</div>
<button type="submit" class="btn">[[#{login.btn}]]</button>
<div class="text-center">
<a class="btn btn-lg" th:href="@{/index.html(l='zh_CN')}">中文</a>
<a class="btn btn-lg" th:href="@{/index.html(l='en_US')}">English</a>
</div>
</form>
</div>
</div>
</div>
<div class="row">
<div class="col-sm-6 col-sm-offset-3 social-login">
<h3>...or login with:</h3>
<div class="social-login-buttons">
<a class="btn btn-link-2" href="#">
<i class="fa fa-facebook"></i> Facebook
</a>
<a class="btn btn-link-2" href="#">
<i class="fa fa-twitter"></i> Twitter
</a>
<a class="btn btn-link-2" href="#">
<i class="fa fa-google-plus"></i> Google Plus
</a>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- Javascript -->
<script src="assets/js/jquery-1.11.1.min.js" th:src="@{assets/js/jquery-1.11.1.min.js}"></script>
<script src="assets/bootstrap/js/bootstrap.min.js" th:src="@{assets/bootstrap/js/bootstrap.min.js}"></script>
<script src="assets/js/jquery.backstretch.min.js" th:src="@{assets/js/jquery.backstretch.min.js}"></script>
<script src="assets/js/scripts.js" th:src="@{assets/js/scripts.js}"></script>
<!--[if lt IE 10]>
<script src="assets/js/placeholder.js"></script>
<![endif]-->
</body>
</html>
国际化请求：
我们通过上图两个请求实现国际化，通过访问index.html使用thymleaf模板引擎进行参数传递。
上图为在登陆页面进行的页面元素抽取。
到这里我们完成了国际化的全部配置，下面运行程序：
打开页面，这里默认为抽取英文的配置文件，下面发送中文请求：
可以发现我们的国际化以及域名访问均成功，国际化功能实现！
5、乱码问题解决
点击idea左上角，并一次选择file->settings->File Encodings
并修改如下图标注位置参数（一般默认为GBK）：
设置完编码后，再重新编写国际化配置文件即可。
353
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
