浏览 1808 次
锁定老帖子 主题:YUI提供的多语言(国际化)解决方案
精华帖 (0) :: 良好帖 (0) :: 新手帖 (0) :: 隐藏帖 (0)
|
|
---|---|
作者 | 正文 |
发表时间:2012-02-24
在ajax流行的今天,浏览器一侧的javascript也可以提供国际化方案,比如本人使用过的GWT和YUI。今天就谈谈YUI的解决方案。 框架编程,说到底是一种约定,你遵循了这些约定,就会给你带来便利。你是否使用某个框架,取决于你是否愿意付出遵循这些约定的代价来换取对应的便利。(呵呵,前几天看了网易公开课的哲学,是否带了点哲学的味道)。 YUI有很好的模块结构,国际化部分也是模块化的,你写一个国际化模块,比如translator,对于每个需要翻译的文本条目都定义一个函数(是不是很像gwt?)然后根据约定为每个语种写一个对应的文件,translator_en.js,translator_zh.js等等。这是一个约定。 在产生YUI实例的时候,将上面定义的模块配置进去。 var appMetaData = { myapp: { base: './wf/intl/', modules : { "translator" : { path: 'translator/translator.js', lang: ["en","zh","zh-Hant", "ja", "ko"] } } } }; 你遵守了这些约定,接下来带来的便利是: 1、查询某个翻译模块可用的语言。Y.Intl.getAvailableLangs("translator"),你可以用这个数组填充页面上的某个select,让客户选择。 2、查询或更改当前YUI实例的语言。Y.Intl.setLang("translator", lang);Y.Intl.getLang(); 3、如果某个模块对语言更改感兴趣,可以订阅事件。 Y.Intl.on("intl:langChange", function(e) {}) 以上内容是YUI国际化的描述,具体到程序的国际化,某些原则与框架无关。 这是例子“有序”:http://www.uxu123.com 1、如何猜测访问者的语言。 如果是第一次访问,如果你的页面是动态的,那么可以在服务器一侧对页面做变量设定;如果是静态的,这个就不行了。 如果是后继访问,可以通过cookie来记录用户的偏爱。 “有序”是静态的页面,解决流程是这样的: 用户访问页面-》ajax检测登录状态(这个总是要执行的)-》这个返回有Accept-Lang header-》不一定使用这个header,但是流程的一部分。执行一个函数,这个函数的参数就是这个header。 函数体: 1、如果有Cookie,优先,header就不用了 2、如果没有cookie,检查header,取出第一个语言代码。 3、看看当前YUI实例的语言,如果一致,什么都不做;如果不一样,就从可用的语言中查找,找到就切换到该语言,找不到,什么也不做,默认语言。 function translateApp(al){ var lang = Y.Cookie.get('uxu123-lang'); if(lang){ if(Y.Intl.getLang() == lang){ ; }else{ Y.translateApp(lang); } }else{ //en-us,zh-cn;q=0.7,zh;q=0.3 var langs = al.split(','); if(langs.length > 0){ var l = langs[0].split(';')[0].split('-')[0]; Y.log(l); var availLangs = Y.Intl.getAvailableLangs("translator"); Y.log(availLangs); Y.some(availLangs,function(item){ if(item.indexOf(l) == 0){ Y.translateApp(item); return true; } }); }else{ ;//没有足够的信息,就默认了。 } // var ls = Y.Array.map(langs,function(item){ // return item.split(';')[0]; // }); } } 声明:ITeye文章版权属于作者,受法律保护。没有作者书面许可不得转载。
推荐链接
|
|
返回顶楼 | |