i18n国际化登录页面

最新推荐文章于 2022-08-08 18:22:55 发布

小幻奏

最新推荐文章于 2022-08-08 18:22:55 发布

阅读量814

点赞数 1

分类专栏： java 文章标签： i18n java 国际化

本文链接：https://blog.csdn.net/weixin_44489400/article/details/117377987

版权

java 专栏收录该内容

2 篇文章 0 订阅

订阅专栏

国际化是啥，一开始我也是一脸懵逼。了解了之后才知道，原来它相当于网站的翻译按钮。毕竟世界上有很多不同的语言，不可能每个人都会中文嘛，所以它的作用就体现出来了。
国际化又被称为i18n，因为internationalization(国际化)这个单词从i到n之间有18个英文字母，i18n的名字由此而来。
国际化一般用在项目中那些固定的文本元素，比如：登录、菜单栏、导航条、各种的提示信息、日期等等。
接下来就让我们开始吧，先说一下，我用的是idea开发，然后springboot加thymeleaf模板引擎。开始之前我们要统一一下idea的编码防止后面出现乱码。
首先点击file然后下面的settings
在这里插入图片描述

然后搜索File Encoding，全部改为utf-8
在这里插入图片描述

设置好了我们就可以弄国际化了，我就用个登录来说明一下是怎么写的吧。
首先在resources文件下面建一个i18n文件夹，我们国际化要写的东西就放到里面去。
我们按照国际化配置命名规范建一个login.properties，完了后再建一个中文的properties名为login_zh_CN.properties
在这里插入图片描述

要注意的一点是这个properties文件的名字是有规范的，一般的命名规范是：自定义名_语言代码_国别代码.properties，
如果是默认的，直接写为：自定义名.properties
当在中文操作系统下，如果login_zh_CN.properties、login.properties两个文件都存在，则优先会使用login_zh_CN.properties，当login_zh_CN.properties不存在时候，会使用默认的login.properties。
新建完了之后你会发现两个文件合在了一个叫Resource Bundle的文件夹里了，它的意思是资源捆绑包"<基础名称>"
，这时候我们再建一个英文的properties名为login_en_US.properties就可以了。

这里说一下我们给它的名字是啥：
Zh_CN代表的是中文，中国的意思
En_US代表的是英语，美国的意思
其实除了直接创建properties文件我们还可以在Resource Bundle上new一个出来。
在这里插入图片描述

然后点击加号，把我们要添加的语言简写加进去，它就可以自动创建一个文件了
在这里插入图片描述

我们的文件创建好了之后就可以在idea写我们要国际化的东西了。
点击箭头所指的地方
在这里插入图片描述

它可以方便我们统一编辑管理繁多的国际化文件
点击左上角的加号加一个key值。
在这里插入图片描述

添加完key值后我们就可以在右边写上我们要翻译的文字，写好后你会发现这三个文件里面都写好了，是不是很方便。
在这里插入图片描述

因为我们把i18n的配置文件放到了resources下面，所以我们要告诉它在哪里才能找到。
在我们的application.properties里面写上图下的东西

#国际化配置文件的真实位置
spring.messages.basename=i18n.login

然后我们就可以在登录页面改一下我们的代码了，由于我用的是thymeleaf模板引擎，它有一个#{…}表达式，用于国际化message.properties 属性读取，这样就方便很多了。
登录页面

<!doctype html>
<html lang="en" class="x-admin-sm" xmlns:th="http://www.thymeleaf.org">
<head>
	<meta charset="UTF-8">
	<title>后台登录</title>
	<meta name="renderer" content="webkit|ie-comp|ie-stand">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width,user-scalable=yes, minimum-scale=0.4, initial-scale=0.8,target-densitydpi=low-dpi" />
    <meta http-equiv="Cache-Control" content="no-siteapp" />
    <link rel="stylesheet" th:href="@{/css/font.css}">
    <link rel="stylesheet" th:href="@{/css/login.css}">
    <link rel="stylesheet" th:href="@{/css/xadmin.css}">
    <script type="text/javascript" th:src="@{/js/jquery.min.js}"></script>
    <script th:src="@{/lib/layui/layui.js}" charset="utf-8"></script>
</head>
<body class="login-bg">
    
    <div class="login layui-anim layui-anim-up">
        <div class="message">[[#{login.tip}]]</div>
        <div id="darkbannerwrap"></div>
        <p style="color: red" th:text="${msg}" th:if="${not #strings.isEmpty(msg)}"></p>
        <!--    如果msg的值为空，则不显示    -->
        <form method="post" class="layui-form" th:action="@{/user/login}">
            <input name="username" th:placeholder="#{login.username}"  type="text" lay-verify="required" class="layui-input" >
            <hr class="hr15">
            <input name="password" lay-verify="required" th:placeholder="#{login.password}"  type="password" class="layui-input">
            <hr class="hr15">
            <input th:value="#{login.btn}" lay-submit lay-filter="login" style="width:100%;" type="submit">
            <hr class="hr20" >
            <a class="layui-btn layui-btn-xs" th:href="@{/login(l='zh_CN')}">中文</a>
            <a class="layui-btn layui-btn-xs" th:href="@{/login(l='en_US')}">English</a>
        </form>
    </div>

    <script>
        
    </script>
</body>
</html>

最后在中文、英文的a标签哪里加一个连接

我们在config文件夹内创建类，实现localereslover接口重写国际化组件的方法,然后解析请求

package com.kuan.config;

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;

public class MyLocaleResolver implements LocaleResolver {
    //解析请求
    @Override
    public Locale resolveLocale(HttpServletRequest request) {
        //获取请求中的语言参数
        String language = request.getParameter("l");

        //System.out.println("Debug==>"+language);
        Locale locale = Locale.getDefault();//如果没有就使用默认的配置
        // 如果请求的连接携带了国际化的参数
        if (!StringUtils.isEmpty(language)){
            //zh_CN 根据_分割
            String[] split = language.split("_");
            //把分割的值取出来，国家 语言
             locale = new Locale(split[0],split[1]);
        }
        return locale;
    }

    @Override
    public void setLocale(HttpServletRequest httpServletRequest, HttpServletResponse httpServletResponse, Locale locale) {

    }
}

最后在在mvcconfig配置一下Bean

package com.kuan.config;

import org.springframework.context.annotation.Bean;
import org.springframework.context.annotation.Configuration;
import org.springframework.web.servlet.LocaleResolver;
import org.springframework.web.servlet.config.annotation.InterceptorRegistry;
import org.springframework.web.servlet.config.annotation.ViewControllerRegistry;
import org.springframework.web.servlet.config.annotation.WebMvcConfigurer;

@Configuration
public class MyMvcConfig implements WebMvcConfigurer {
    @Override
    public void addViewControllers(ViewControllerRegistry registry) {
        registry.addViewController("/").setViewName("login");
        registry.addViewController("/login").setViewName("login");
        registry.addViewController("/main").setViewName("index");
    }
    //自定义的国际化组件就生效了
    @Bean
    public LocaleResolver localeResolver(){
        return new MyLocaleResolver();
    }

    //拦截器
    @Override
    public void addInterceptors(InterceptorRegistry registry) {
        registry.addInterceptor(new LoginHandlerInterceptor())
                .addPathPatterns("/**")
                .excludePathPatterns("/login","/","/user/login","/css/*","/lib/**","/js/**","/images/**","/fonts/*");
    }
}

写完后我们启动一下
默认是中文，我们点击一下

在这里插入图片描述
它就变英文的了

今天就到这里了，下次再见(ಡωಡ)

小幻奏

关注

1
点赞
踩
4

收藏

觉得还不错? 一键收藏
1
评论
i18n国际化登录页面

国际化是啥，一开始我也是一脸懵逼。了解了之后才知道，原来它相当于网站的翻译按钮。毕竟世界上有很多不同的语言，不可能每个人都会中文嘛，所以它的作用就体现出来了。国际化又被称为i18n，因为internationalization(国际化)这个单词从i到n之间有18个英文字母，i18n的名字由此而来。国际化一般用在项目中那些固定的文本元素，比如：登录、菜单栏、导航条、各种的提示信息、日期等等。接下来就让我们开始吧，先说一下，我用的是idea开发，然后springboot加thymeleaf模板引擎。开始之
复制链接

扫一扫

专栏目录