解析spring:i18n国际化javascript中的消息

我正在尝试将我们的一些代码国际化。我在JSPX中有一个页面，它使用

标记解析

message.properties

文件中的字符串。这对于JSPX页面中的HTML和CSS很好，但是有一个javascript文件是源代码，用

标记替换其中的字符串只意味着它会被逐字打印出来

我的JSPX的javascript源代码如下：

<spring:theme code="jsFile" var="js" />
<script type="text/javascript" src="${js}" />

所以我想知道的是，这能起作用吗？从我在各种论坛上收集的信息来看，这似乎是应该的，但我不知道我错在哪里。有没有更好的办法

我还应该注意，这些文件位于WEB-INF文件夹之外，但是通过将可重新加载的ResourceBundleMessageSource放在根applicationContext.xml中，spring标记会被拾取

---

谢谢你的帮助

在我看来，您要做的是将JS文件视为JSP文件，并通过spring:message标记解析其内容。
我不会那样做

通常，JS i18n通过以下两种方式之一完成：

• 通过从JSP页面写出翻译后的字符串数组
• 通过创建翻译过滤器并向请求客户端提供预翻译的JS文件

如果您为客户端可翻译字符串创建一个中心位置，则这两种方法都最有效。
在您的上下文中，我建议使用第一种方法（简单得多）。除非您的项目非常大，并且客户端有很多可翻译字符串。因此，修改将如下所示：

<script type="text/javascript">
  var strings = new Array();
  strings['settings.toogle'] = "<spring:message code='proj.settings.toggle' javaScriptEscape='true' />";
  strings['settings.toogle.description'] = "<spring:message code='proj.settings.toggle.description' javaScriptEscape='true' />";
</script>
<spring:theme code="jsFile" var="js" />
<script type="text/javascript" src="${js}" />

请注意，我用双引号写出翻译后的字符串。这是因为法语或意大利语中的一些单词可能包含撇号

编辑：附加输入 为此，我们提供了JS文件的翻译。通常，原因是我们想要动态地创建UI的某些部分。还有一些情况下，我们需要本地化一些第三方组件，我上面的回答很好地解决了这些问题。
对于我们希望动态创建UI部件的情况，使用模板而不是在JavaScript中连接HTML标记是非常有意义的。我决定写这篇文章，因为它使解决方案更加干净（并且可能是可重用的）。
因此，可以创建一个模板并将其放在页面上，而不是将翻译传递给JavaScript（我的示例将使用，但我相信可以使用任何其他引擎）：

{{subject}}

{{{body}}}

在客户端（即JavaScript中），您所要做的就是访问模板（下面的示例显然使用jQuery）并编译：

var template = Handlebars.compile($("#article").html());
var html = template({subject: "It is really clean",
  body: "<p>Don't you agree?</p><p>It looks much better than usual spaghetti with JavaScript variables.</p>"
});
$("#someDOMReference").html(html);

var template=handlebar.compile（$（“#article”）.html（）；
var html=template（{subject:“它真的很干净”，
正文：“你不同意吗？
它看起来比普通的带有JavaScript变量的意大利面要好得多。
”
});
$（“#someDOMReference”）.html（html）；

这里需要注意的几点：

• 标记默认情况下同时转义HTML和JS，我们不需要指定

  javaScriptEscape

  属性
• 为
  标记提供

  text

  属性是有意义的，因为它可以用作回退（如果给定语言没有翻译）以及注释（此元素所代表的内容）。人们甚至可以创建一个工具来扫描文件中的
  标记，并自动生成属性文件
• 为了防止把手转义HTML内容，我使用了三重

  {{{{curly brates}}}

---

基本上就是这样。如果可能的话，我建议您使用模板。

谢谢您的回答。这里有一个更通用的解决方案

其想法是提供一个名为“string.js”的动态javascript文件，其中包含使用当前用户语言在java资源包中注册的关联消息数组

1） 在SpringController中创建一个方法，从资源包加载所有资源键，并返回视图“Spring.jsp”

2） 实现视图“strings.jsp”

var messages=new Array（）；
消息[“”]=“”；

3） 在HTML源代码中导入“spring.js”。消息数组可用，并使用正确的语言加载

---

可能的问题：如果用户更改其语言，“spring.js”必须由导航器重新加载，但它将被缓存。当用户更改其语言（或其他重新加载文件的技巧）时，需要清除缓存。

除了@oilal的答案外，您还可以向strings.jsp添加一个helper函数，以更好地使用翻译数组：

<%@page contentType="text/javascript" pageEncoding="UTF-8"%>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@taglib prefix="spring" uri="http://www.springframework.org/tags"%>
var messages = new Array();

<c:forEach var="key" items="${keys}">messages["<spring:message text='${key}' javaScriptEscape='true'/>"] = "<spring:message code='${key}' javaScriptEscape='true' />";
</c:forEach>

/**
 * Tranlate a String by key, if key is not defined return the key.
 *  
 * @author Pedro Peláez <aaaaa976 at gmail dot com>, Drupal/Wordpress authors, and others
 * @param {String} key
 * @returns {String}
 */
function t(key) {
    if (messages[key]) {
        return messages[key];
    }
    return key;
}

---

将spring的message.properties转换为JavaScript对象，然后在其他JavaScript文件中使用该对象是非常简单的。有一个我们可以改变的方法

  app.name=Application name
  app.description=Application description

到

然后，应该为每个消息创建一个messages{lang}.js文件。{lang}.properties，并在模板中引用。在thymeleaf模板中，它将如下所示：

  <script th:src="@{'/js/messages_' + ${#locale}  + '.js'}"></script> 
  <script>
    console.log(messages.app.name, messages.app.description);
  </script>

console.log（messages.app.name、messages.app.description）；

---

为此，我创建了一个quick。

答案很好，但是spring:message标记应该正确终止以避免错误。我试图编辑，但因为只添加了2个字符，所以告诉我走开，因为显然这不够有建设性，除非有6个或更多字符：）@GreenDay:谢谢，我自己还没有注意到这个问题。“现在应该没问题了。”PawełDyda提醒你，我用双引号写出翻译后的字符串。这是因为法语或意大利语中的一些单词可能包含撇号。这不是javaScriptEscape='true'应该注意的吗？默认情况下，标记同时转义HTML和JS，我们不需要指定javaScriptEscape属性，那么您为什么在上面指定它？@domenicop：基本上，我重写了问号中的代码，但没有给出它

var template = Handlebars.compile($("#article").html());
var html = template({subject: "It is really clean",
  body: "<p>Don't you agree?</p><p>It looks much better than usual spaghetti with JavaScript variables.</p>"
});
$("#someDOMReference").html(html);

@RequestMapping(value="strings.js")
public ModelAndView strings(HttpServletRequest request) {
    // Retrieve the locale of the User
    Locale locale = RequestContextUtils.getLocale(request);
    // Use the path to your bundle
    ResourceBundle bundle = ResourceBundle.getBundle("WEB-INF.i18n.messages", locale);  
    // Call the string.jsp view
    return new ModelAndView("strings.jsp", "keys", bundle.getKeys());
}

<%@page contentType="text/javascript" pageEncoding="UTF-8"
%><%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"
%><%@taglib prefix="spring" uri="http://www.springframework.org/tags"
%>var messages = new Array();

<c:forEach var="key" items="${keys}">messages["<spring:message text='${key}' javaScriptEscape='true'/>"] = "<spring:message code='${key}' javaScriptEscape='true' />";
</c:forEach>

<%@page contentType="text/javascript" pageEncoding="UTF-8"%>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@taglib prefix="spring" uri="http://www.springframework.org/tags"%>
var messages = new Array();

<c:forEach var="key" items="${keys}">messages["<spring:message text='${key}' javaScriptEscape='true'/>"] = "<spring:message code='${key}' javaScriptEscape='true' />";
</c:forEach>

/**
 * Tranlate a String by key, if key is not defined return the key.
 *  
 * @author Pedro Peláez <aaaaa976 at gmail dot com>, Drupal/Wordpress authors, and others
 * @param {String} key
 * @returns {String}
 */
function t(key) {
    if (messages[key]) {
        return messages[key];
    }
    return key;
}

alert(t("menu.section.main"));

  app.name=Application name
  app.description=Application description

const messages = { app: { name: 'Application name', description: 'Application description' } };

  <script th:src="@{'/js/messages_' + ${#locale}  + '.js'}"></script> 
  <script>
    console.log(messages.app.name, messages.app.description);
  </script>