【Spring Boot】页面国际化实现

最新推荐文章于 2022-10-26 10:35:59 发布

高朗

最新推荐文章于 2022-10-26 10:35:59 发布

阅读量406

点赞数

分类专栏： SpringBoot 文章标签： html 国际化 spring boot

本文链接：https://blog.csdn.net/qq_43466788/article/details/108920067

版权

SpringBoot 专栏收录该内容

21 篇文章 2 订阅

订阅专栏

文章目录

一、什么是国际化？
二、如何实现国际化？

一、什么是国际化？

例如我们的dubbo.apache.org ，进入是一个默认英文的网站，右上角有个中字，点一下就会帮我们切换成中文网站，这就是国际化。
在这里插入图片描述

二、如何实现国际化？

确保我们的File Encodings都是UTF-8

在这里插入图片描述

在resource目录下新建一个 i18n目录（i18n是internationalize国际化的简写）
新建几个properties文件，然后就会自己建立Resource Bundle…目录
XXX.properties：默认
XXX_en_US.properties：英语
XXX_zh_CN.properties：中文

在这里插入图片描述

随便点进三个中任意一个文件，点击左下角的可视化工具同时对三个文件编写
例子：登录界面：

在这里插入图片描述
我需要实现在最下方点中文的时候，显示中文页面，点English的时候显示英文界面。
页面有5处信息要修改：
Please sign in《 ===== 》请登入

Email address 《=====》邮箱地址

password 《 =====》密码

Remember me 《=====》记住我

编写i18n文件：
login.properties：默认
login_en_US.properties：英语
login_zh_CN.properties：中文
在这里插入图片描述
把他们放入application.yaml配置中：

spring:
  messages:
    basename: i18n.login

接下来，我们的页面需要用到thymeleaf引擎
在这里插入图片描述
Message需要用到#{}
URL需要用到@{}

<!doctype html>
<html lang="en"  xmlns:th="http://www.thymeleaf.org">
  <head>
    <meta 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="Mark Otto, Jacob Thornton, and Bootstrap contributors">
    <meta name="generator" content="Jekyll v4.1.1">
    <title>Signin Template · Bootstrap</title>

    <link rel="canonical" th:href="@{https://getbootstrap.com/docs/4.5/examples/sign-in/}">

    <!-- Bootstrap core CSS -->
<link th:href="@{/css/bootstrap.min.css}" rel="stylesheet">

    <style>
      .bd-placeholder-img {
        font-size: 1.125rem;
        text-anchor: middle;
        -webkit-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;
      }

      @media (min-width: 768px) {
        .bd-placeholder-img-lg {
          font-size: 3.5rem;
        }
      }
    </style>
    <!-- Custom styles for this template -->
    <link th:href="@{/css/signin.css}" rel="stylesheet">
  </head>
  <body class="text-center">
    <form class="form-signin">
  <img class="mb-4" th:src="@{/img/bootstrap-solid.svg}" alt="" width="72" height="72">
  <h1 class="h3 mb-3 font-weight-normal" th:text="#{login.tip}"></h1>
  <label for="inputEmail" class="sr-only" th:text="#{login.email}"></label>
  <input type="email" id="inputEmail" class="form-control" th:placeholder="#{login.email}" required autofocus>
  <label for="inputPassword" class="sr-only" th:text="#{login.password}"></label>
  <input type="password" id="inputPassword" 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" >[[ #{login.sign} ]]</button>
  <p class="mt-5 mb-3 text-muted">&copy; 2017-2020</p>
      <a class="btn btn-sm" th:href="@{/index.html(language='zh_CN')}">中文</a>
      <a class="btn btn-sm" th:href="@{/index.html(language='en_US')}">English</a>
</form>
</body>
</html>

现在我们显示的是默认的中文，我们需要在a标签上加上处理事件，传递一个language到后端

修改国际化message，需要建一个config类实现LocaleResolver 接口的两个方法，最后在MvcConfig.java中把这个类放入bean中
MyLocalResolver .java

public class MyLocalResolver implements LocaleResolver {

    //解析请求
    @Override
    public Locale resolveLocale(HttpServletRequest httpServletRequest) {

        //获取请求中的语言参数
        String language = httpServletRequest.getParameter("language");


        //language为空   使用默认的
        Locale locale = Locale.getDefault();

        //如果language不为空
        if (!StringUtils.isEmpty(language)){
            //zh_CN   分割
            String[] s = language.split("_");

            //国家，地区
             locale = new Locale(s[0], s[1]);

        }

        return locale;

        //写完  需要放入Bean中  ======》MvcConfig.java
    }

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

    }
}

MvcConfig.java

@Configuration
public class MvcConfig implements WebMvcConfigurer {

   //视图跳转
    @Override
    public void addViewControllers(ViewControllerRegistry registry) {
        registry.addViewController("/").setViewName("index");
        registry.addViewController("/index.html").setViewName("index");
    }

    //国际化放入bean中
    @Bean
    public LocaleResolver localeResolver(){
        return new MyLocalResolver();
    }
}

效果：
中文：
在这里插入图片描述

英文：
在这里插入图片描述

高朗

关注

0
点赞
踩
2

收藏

觉得还不错? 一键收藏
0
评论
【Spring Boot】页面国际化实现

文章目录一、什么是国际化？二、如何实现国际化？一、什么是国际化？例如我们的dubbo.apache.org ，进入是一个默认英文的网站，右上角有个中字，点一下就会帮我们切换成中文网站，这就是国际化。二、如何实现国际化？确保我们的File Encodings都是UTF-8在resource目录下新建一个 i18n目录（i18n是internationalize国际化的简写）新建几个properties文件，然后就会自己建立Resource Bundle…目录XXX.properti
复制链接

扫一扫