如何本地化网页

时间:2015-11-26 07:57:54

标签: html node.js localization

我正在创建Twitter Tweet Analysis网页。我想根据用户选择本地化页面。在标题上,我提供了一个导航栏:列出不同语言环境的国家/地区。根据用户选择的国家/地区,整个网页应该被翻译。

这是我的HTML标题:

<header>
<div class="navbar navbar-default navbar-fixed-top">    
    <div class="navbar-header">
  <a class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
    <span class="icon-bar"></span>
    <span class="icon-bar"></span>
    <span class="icon-bar"></span>
  </a>
    <a class="navbar-brand" href="#">Twitter Analysis</a>
    </div>
    <div class="navbar-collapse collapse">
      <ul class="nav navbar-nav ">
        <li class="dropdown">
          <a href="#" class="dropdown-toggle" data-toggle="dropdown">Country</a>
          <ul class="dropdown-menu">
            <li><a href="?lang=en">United States</a></li>
            <li><a href="?lang=zh_CN">China</a></li>
          </ul>
        </li>
      </ul>
    </div>
</div>
</header>

知道我应该如何实现这个?请指教。感谢

1 个答案:

答案 0 :(得分:0)

您可以使用i18n-2模块。

首先,您需要使用npm

安装i18n-2

$ npm install --save i18n-2

之后,将这些配置行添加到app.js文件中。记得在加载cookieParser后添加它。

 var cookieParser = require('cookie-parser');
    app.use(cookieParser('your secret here')); // put the config after this line

    i18n.expressBind(app, {
      // setup some locales - other locales default to vi silently
      locales: ['vi', 'en'],
      // set the default locale
      defaultLocale: 'vi',
      // set the cookie name
      cookieName: 'locale'
    });

    // set up the middleware
    app.use(function(req, res, next) {
      req.i18n.setLocaleFromQuery();
      req.i18n.setLocaleFromCookie();
      next();
    });

i18n对象现在将驻留在每个请求的请求对象中。上面的配置还允许从查询字符串或cookie中设置区域设置。例如,mysite.com/?lang = en会自动将语言环境设置为en。要使用i18n对象,只需使用__功能

function handlerFunc1(req, res){
  res.render('index', { title: req.i18n.__("hello") });
}

或者如果您想在视图中使用它,只需再次使用__

<h1>
  <%= __("hello") %>
</h1>
然后,<18> i18n-2将在区域设置文件中查找密钥hello(默认情况下位于locales / en.js和locales / vi.js中)。如果密钥或文件尚不存在,它将自动为您创建这些文件和密钥,因此您不必担心错误。然后,您可以打开这些文件并编辑其中的值或添加新文件。文件语法只是普通的JSON语法。

注意:您不能使用//进行评论。

{
  "hello": "Hello",
  "title": "title",
}

要更改语言,可以使用setLocale(locale)函数直接设置。除此之外,您还可以设置浏览器的cookie区域设置值,以便记住下次访问的当前语言。

function handlerFunc(req, res){
  // you can set it directly like this
  req.i18n.setLocale('vi');

  // or set it via the cookie
  res.cookie('locale', 'vi');
  req.i18n.setLocaleFromCookie();

  // redirect back
  res.redirect('back');
};

来源 - link