一步一步實現網站的多語言版本


    網站在開發的過程中需要實現多語言版本,我們暫且認為有英語和漢語兩個版本。網站結構包括,UI過程,rest服務,以及相應的js,各個部分我們都要實現多語言,不要求一鍵切換,但是在部署過程中要能實現多與語言配置。

首先我們出場的是資源文件,C#的項目實現本地化和區域化,我們要用到資源文件。

添加資源文件夾

添加資源文件項

這里文件的命名最好能規范,如英文版本建議 lang.en.resx,漢語版本建議用lang.zh-cn.resx

實際使用效果

資源文件夾由各個語言版本的資源文件組成,資源文件以.resx后綴和.cs后綴成對出現,其實質是一定規則的Xml文件。這個很容易理解,應用程序通過資源文件實現多語言版本的切換,這個資源文件自然保存着語言版本的鍵值對應關系。

如果你還不太理解的資源文件的話,可以用記事本打開.resx文件,為了真正看到資源文件的核心數據,我們先提前添加一個資源

.resx文件

以root為根節點的xml文件,剛才我們添加的資源表示為:

<data name="website" xml:space="preserve">
    <value>cnblogs</value>
 </data>

我們操作.resx文件就是要形成多個data節點

接下來我們要添加鍵值對應關系了,如果鍵值對應對比較少,我們可以通過上圖中的圖形化界面操作,但是既然是網站,需要翻譯的內容必定會很多,難道我們一個一個添加嗎?

既然核心文件就是這個data節點,我們只要保證data節點補充完整即可。

這里我們提供兩種方法供參考。

1 可以先把鍵值對事先批量保存在數據庫中,再通過讀取數據,使用程序批量生成data節點集合,補充完整即可。這樣做的好處是可以把數據保存下來,省去手工添加的繁瑣。

其實在實際開發過程中,翻譯內容鍵是會不斷增加調整的,並且資源文件不允許重復鍵,也就意味着要不斷的修改數據和程序。總之,這不算一種科學的方法。

2 我們需要發現一個工具,vs早已經准備好了,Resgen

它可以實現txt文件與.resx文件的相互轉化,准確快速

上圖中的txt文件格式可以是這樣

website=網站
service=服務

以上兩種方法各有利弊,我個人還是推薦第二種方法

生成資源文件是實現多語言版本的第一步,有些需要注意的地方

1)鍵的名字不能重復,最好是有意義的無空格及特殊字符的。

2)多個語言版本的文件中需要都有指定的鍵

即 

<data name="website" xml:space="preserve">
    <value>cnblogs</value>
 </data>

這個節點需要在lang.en.resx和lang.zh-cn.resx文件中都存在,只是value值不同,否則在讀取時會出現混淆

讀取使用資源文件

資源文件整理完以后,我們需要替換所有需要翻譯的內容為資源文件變量,無論是前台aspx頁面還是cs文件都可以按照以下格式替換

<%=Resources.lang.website%>

這個時候可以體現鍵名字規范的好處,智能提示可以清晰的找出,並且不會出現_等符號

js中實現多語言

js實際上與資源文件是沒有關系的,所以以上 的資源文件在js部分不能直接使用。既然js也需要有多語言版本,所以js也必定有自己的"資源文件"--json

我們借助json存儲需要翻譯的js提示語言,value等值的對應關系。

兩個語言版本,我們生成3個js文件,以備后用

每個文件中存放的相應的json數組,翻譯內容鍵值對應

var note  { website:"博客園",sure:"確定"}

使用:

在需要使用的js文件中引入lang.en.js和 lang.zh-cn.js,做相應的替換即可。

///<reference path="/Jscript/Translate/lang.en.js" />
///<reference path="/Jscript/Translate/lang.js" />
///<reference path="/Jscript/Translate/lang.zh-cn.js" />

note.sure

為了代碼規范我建議在生成json文件時加上注釋

///<param name="TianJia" type="String">添加</param>
Add: "Add",

js多語言翻譯的關鍵是js中需要翻譯的內容被相應的js文件中的json值替換。比如翻譯英文版的 "確定"

在程序中我們必須讀到相應的 lang.en.js 文件,這樣才可以取到sure值

我們可以通過cookie來決定加載哪個翻譯的js"資源文件",也可以部署時直接把相應的js轉移到 lang.js,而刪除其它不用的js翻譯文件。這也是以上我說生成3個js文件的原因。

說完了js的配置,我們再返回頭來說說資源文件的配置

程序如何決定網站啟動時使用哪個資源文件?

資源文件由在webconfig的<system.web>下globalization節點設置,打開相應的本地化節點即可

<globalization culture="en-US" uiCulture="en-US"/>
<!--<globalization culture="zh-CN" uiCulture="zh-CN"/>-->

     這樣就實現了網站的多語言配置,如果要實現真正的一鍵切換,需要在cookie和Global.asax繼續處理,如果你覺得我的文章對你有所幫助,請點 【推薦】

 

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM