Spring中多语言页面适配方案总结

本文总结了在Spring Web项目中实现多语言页面适配的两种主要方法:替换法(包括jQuery i18n插件法、ResourceBundle法、MessageSource法)和多套页面法。替换法适用于读写顺序相同的语言,而多套页面法则为每种语言创建单独的页面。文中详细介绍了每种方法的优缺点和操作步骤。
摘要由CSDN通过智能技术生成

一、概述

在做web开发中,考虑到地区语言习惯,需要针对不同国家/地区显示不同的语言。在网上的各类博客中,多是介绍读取配置文件的方法进行多语言适配。

但笔者在实际预研和项目开发过程中,逐渐了解到不同语言的阅读、书写方式差异大。例如英语和现代汉语读写顺序相同,都是从左往右读;少数民族语言维语等阿拉伯语言是从右往左读写;蒙文、古汉语等语言是从上往下读写。不同的语言的读写习惯、字体大小会导致页面有不同的排版样式,难以做到一视同仁。一句话在不同语言中字符长度不同,这也是前端显示时需要考虑的问题。

如下表所示,归纳了几种语言类型的读写习惯和样例。如蒙古语、维语等少数民族语言,它们的读写习惯与汉语差异大,无法通过简单的文本替换来进行多语言适配。若需要有较好的观感体验,还需要对前端样式进行单独处理。

语言类型 示例 读写习惯
中文(zh_CN) 这是中文 从左往右读写
英文(en) this is English 从左往右读写
蒙古语(mn_MN) 见图一 竖排从上到下,列序从左到右
维吾尔语(ug_CN) بۇ ئۇيغۇر 从右往左读写

在这里插入图片描述


由此可知,多语言替换法并不是万能的适配方法。笔者总结网上文章和自身项目经验,将多语言适配方法分为两类方法:替换法和多套页面法。

替换法的要点是将多语言文本通过“替换”方式,针对不同语言显示对应文本。替换法包括前端页面文本替换、读取properties配置文件替换、读取json配置文件替换(部分客户端游戏使用该方法做多语言适配,因笔者接触较少,故不讨论)等。多套页面法是每种语言一套页面,是一种傻瓜式,针对性强的多语言处理方法。

二、替换法

替换法是指通过代码动态获取不同语言文本,当前页面显示什么语言类型就显示哪种语言。该方法比较适用读写顺序相同,切换不同语言后不影响整体页面布局的多语言类型。该方法常见中英文适配。例如,当我们在中国浏览网页,代码检测到该地区为中国后,就会读取中文文本,再到前端页面中生成中文文本。

下文将重点介绍Spring Web项目开发中,比较简单的几种替换法。

2.1 jQuery i18n插件法

2.1.1 简介

jQuery.i18n.properties是jQuery的插件,该方法需和jQuery配套使用。它的原理是在html中,对需要翻译的文本进行标记,然后调用相关js代码,传入当前页面的语言类型,读取对应propertis中的翻译文本再替换,类似的还有vue中的i18n插件等。

jQuery.18n.properties的github下载地址:https://github.com/jquery-i18n-properties/jquery-i18n-properties

2.1.2 使用方法

1)演示代码插件版本

  • jquery-3.0.0.min.js
  • jquery.i18n.properties-1.0.9.js

2)在对应properties文件中配置多语言值

properties文件名称需要和name传入的值保持一致,文件名命名规则为name_语言类型.properties,例如,strings_en.properties。

strings_zh_CN.properties:

key=这是中文

strings_en.properties:

key=this is english

3)演示代码

<html lang="zh-CN">

<head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width" />
    <meta name="keywords" content="" />
    <meta name="description" content="" />
</head>

<body>
    <div>
        <div>
            <select id="language">
                <option value="zh_CN"
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值