在ASP.NET AJAX中使用應用程式服務和本地化（6）：建立支援多語言的ASP.NET AJAX網站、小結

本文來自《ASP.NET AJAX程式設計 第II卷：用戶端Microsoft AJAX Library相關》的第五章《應用程式服務和本地化》。

 

ASP.NET為Web應用程式為本地化/全球化功能提供了強大的支援，開發人員只要建立不同的資源檔，ASP.NET即可根據使用者的地區設定選擇合適的資源檔，產生本地化頁面後發送給瀏覽者。

ASP.NET AJAX也考慮了這個問題，並對用戶端JavaScript檔案的本地化和全球化支援有著可圈可點的表現。即使對於Ajax這種完全不同的Web應用程式開發模型，開發人員也能夠容易地建立出支援多語言的Web網站。

通過在不同JavaScript檔案中給出應用程式所需要的本地化資源，ASP.NET AJAX的ScriptManager控制項即可根據使用者地區設定選擇恰當的指令檔並發送給用戶端。而對於需要以.NET程式集方式重新發布的ASP.NET AJAX組件，ASP.NET AJAX也允許我們將本地化資源指令碼嵌入到組件所在的程式集中，並隨之一同發布。作為組件的使用者，我們根本無需手工維護眾多的本地化指令檔，就像使用普通的.NET控制項一樣簡單。

提示：關於將本地化指令檔嵌入到以.NET程式集方式重新發布的ASP.NET AJAX組件中，將在本書第III卷中自訂ASP.NET AJAX組件部分詳細介紹。

在本節中，我們將從頭開始，實現一個雖然簡單，但是功能完備的支援多語言的ASP.NET AJAX樣本網站，並藉此樣本程式示範建立支援多語言ASP.NET AJAX網站的方法。

 

5.6.1 讓ASP.NET頁面支援多語言

ASP.NET AJAX建立在ASP.NET 2.0架構之上，因此，若想讓ASP.NET AJAX網站支援多語言，那麼首先就要保證ASP.NET 2.0頁面啟用了多語言支援。

我們可以在頁面頭部按照如下代碼修改頁面的聲明，注意其中粗體部分：

<%@ Page Language="C#" UICulture="auto" Culture="auto" %>

像這樣將UICulture和Culture屬性設定為auto之後，該ASP.NET頁面即可根據使用者的地區設定自動選擇最適合的本地化資源，進行後續處理並產生本地化的頁面。

若是希望在整個Web網站全域範圍內應用該設定，我們也可以修改web.config檔案：

<system.web>

  <globalization uiCulture="auto" culture="auto" />

</system.web>

參考：ASP.NET 2.0內建了功能強大且簡單易用的本地化功能支援，包括指定Web網站和Web頁面的預設區域/語言設定等。若想瞭解更多有關ASP.NET 2.0本地化功能的設定，請參考這篇MSDN文章：《How to: Set the Culture and UI Culture for ASP.NET Web Page》（http://msdn2.microsoft.com/en-us/library/bz9tc508.aspx）。

 

5.6.2 建立支援本地化的JavaScript指令檔

在實際項目中使用ASP.NET AJAX建立Ajax網站時，我們一般都會將JavaScript指令碼部分獨立成單獨的檔案，然後用ScriptManager控制項引入到頁面中。這樣做可以降低頁面的結構（XHTML）和行為（JavaScript）之間的耦合，帶來更加清晰的開發模型。

在本節中的程式中，我們也將把樣本網站中將要用的JavaScript指令碼完全獨立成單獨的JavaScript檔案。接下來我們將編寫一個自訂的ASP.NET AJAX用戶端控制項——自然，該控制項將會支援本地化功能，即能夠提供多語言的介面。

在Web網站中建立一個專門存放指令檔的目錄，比如本樣本程式中的Scripts\，然後在該目錄中建立3個JavaScript檔案，5-12所示。

圖5-12 JavaScript指令檔在Visual Studio的Solution Explorer中的結構

其中：

1. LocalizableControl.js檔案中定義了該控制項的具體實現代碼；
2. StringContent.en-US.js檔案中給出了該控制項將要用到的英文字串資源；
3. StringContent.zh-CN.js檔案中給出了該控制項將要用到的中文字串資源。

LocalizableControl.js檔案的完整代碼如下：

Type.registerNamespace("Dflying");

Dflying.LocalizableControl = function (element) {

    Dflying.LocalizableControl.initializeBase(this, [element]);

}

Dflying.LocalizableControl.prototype = {

    initialize: function() {

        var sb = new Sys.StringBuilder();

        // 控制項的說明資訊

        sb.append(Dflying.Resx.Introduction);

        sb.append("<br />");

        // 經過本地化的目前時間

        sb.append(Dflying.Resx.CurrentDateTimeLabel);

        sb.append(": ");

        sb.append((new Date()).localeFormat("F"));

        // 顯示上述資訊

        var element = this.get_element();

        element.innerHTML = sb.toString();

    }

}

Dflying.LocalizableControl.registerClass('Dflying.LocalizableControl', Sys.UI.Control);

if (typeof(Sys) !== 'undefined') Sys.Application.notifyScriptLoaded();

可以看到，在這個簡單的控制項中，我們只是顯示了一段說明資訊和當前的時間而已——雖然沒有什麼實際用處，不過在示範本地化支援方面，已經足夠了。請留意上述代碼中的粗體部分，其中Dflying.Resx.Introduction和Dflying.Resx.CurrentDateTimeLabel均定義在其他兩個JavaScript指令檔中，提供經過本地化的字串資源；而(new Date()).localeFormat("F")則用來以本地化的方式格式化當前的時間日期。

StringContent.en-US.js檔案的完整代碼如下，這就是一個簡單的資源檔，其中提供了英文語言環境下的控制項所需文本資源：

Type.registerNamespace("Dflying");

Dflying.Resx = {

    "Introduction"          : "This is a localizable control",

    "CurrentDateTimeLabel"  : "Now it is"

}

if (typeof(Sys) !== 'undefined') Sys.Application.notifyScriptLoaded();

相應地，提供中文文本資源的StringContent.zh-CN.js檔案的完整代碼如下：

Type.registerNamespace("Dflying");

Dflying.Resx = {

    "Introduction"          : "這是一個支援本地化的控制項",

    "CurrentDateTimeLabel"  : "現在的時間是"

}

if (typeof(Sys) !== 'undefined') Sys.Application.notifyScriptLoaded();

接下來，我們即可讓ASP.NET AJAX有選擇性地將最符合使用者地區設定的指令碼發送給用戶端。

 

5.6.3 使用ScriptManager將多語言指令檔引入到頁面中

回顧前一小節中定義的這3個JavaScript檔案，我們知道LocalizableControl.js是使用該控制項所必需的，無論使用者希望看到何種語言的介面，該指令碼都是必不可少的。而作為提供本地化資源內容的StringContent.en-US.js和StringContent.zh-CN.js（若是還需要其他語言版本，則也可以繼續添加相應的資源指令檔），則只要從中挑選其一發送即可。

根據使用者地區設定在StringContent.en-US.js和StringContent.zh-CN.js中挑選其一的工作是實現該樣本程式的關鍵之處。但幸運的是，ASP.NET AJAX的ScriptManager已經為我們完成了這項艱巨的任務。只要按照如下代碼聲明ScriptManager即可，注意其中粗體部分（代碼中同樣將必備的指令碼LocalizableControl.js也發送到了用戶端）：

<asp:ScriptManager ID="sm" EnableScriptLocalization="true" 

    EnableScriptGlobalization="true" runat="server">

    <Scripts>

        <asp:ScriptReference Path="~/Scripts/StringContent.js" 

            ResourceUICultures="zh-CN, en-US" />

        <asp:ScriptReference Path="~/Scripts/LocalizableControl.js" />

    </Scripts>

</asp:ScriptManager>

在上述代碼中，我們將ScriptManager的EnableScriptLocalization屬性設定為了true。然後在引用StringContent.en-US.js或StringContent.zh-CN.js時，我們採取了一種較為“特別”的聲明方法：<asp:ScriptReference />標籤的Path屬性只提供了StringContent.js，至於中間的zh-CN或en-US，則用逗號（,）串連起來後寫在了ResourceUICultures屬性中。

通過這樣的聲明，ScriptManager即可知道StringContent.js這個指令檔共有兩個語言的版本：StringContent.en-US.js或StringContent.zh-CN.js，其構造的格式為[原指令檔名].[地區名].js。然後在程式運行時，ScriptManager即可極具“智能”地在二者中挑選出一個，發送給用戶端。

在上述代碼中，我們還會注意到ScriptManager的EnableScriptGlobalization屬性也被設定成了true。這樣是為了讓ScriptManager引入相關指令碼，以保證諸如(new Date()).localeFormat("F")等ASP.NET AJAX內建的全球化功能能夠正常工作。

提示：ASP.NET AJAX內建的用來支援全球化功能的指令檔預設位於C:\Program Files\Microsoft ASP.NET\ASP.NET 2.0 AJAX Extensions\v1.0.61025\MicrosoftAjaxLibrary\System.Web.Extensions\1.0.61025.0\Globalization\目錄中。

此時在Visual Studio中調試該程式，根據當前瀏覽器中首選地區設定的不同，我們可以在Visual Studio的Script Explorer視窗（Ctrl + Alt + N鍵）中看到5-13或圖5-14所示的StringContent.en-US.js或StringContent.zh-CN.js指令檔。

圖5-13 Visual Studio的Script Explorer中的StringContent.en-US.js指令碼

圖5-14 Visual Studio的Script Explorer中的StringContent.zh-CN.js指令碼

在圖5-13和圖5-14中，可以看到ScriptManager始終發送了LocalizableControl.js這個JavaScript檔案，而卻有選擇性地從StringContent.en-US.js或StringContent.zh-CN.js中挑選一個發送給用戶端。這樣，在用戶端代碼中我們即可直接使用定義在LocalizableControl.js中的用戶端控制項，而無需任何有關網站語言的考慮。

 

5.6.4 根據使用者地區設定自動選擇網站語言

這時，用戶端應用程式已經具有了根據使用者地區資訊自動選擇網站語言的能力。讓我們在頁面中建立一個該控制項的執行個體測試一下。

在該ASP.NET頁面中添加如下的JavaScript指令碼，建立一個定義於LocalizableControl.js中的Dflying.LocalizableControl控制項：

function pageLoad(sender, args) {

    $create(

        Dflying.LocalizableControl, 

        null, 

        null,

        null, 

        $get('localizableControl')

    );

}

其中localizableControl是定義在頁面中的一個<div />元素，用來顯示該控制項的內容：

<div id="localizableControl">

</div>

這時我們開啟瀏覽器，並將其慣用語言設定為en-US（在IE中，選擇Tools | Internet Options… | General | Languages…，參見圖5-15）。

圖5-15 在IE瀏覽器中設定頁面的慣用語言

瀏覽本樣本程式頁面，可以看到控制項中的語言文字為英語。5-16所示。

圖5-16 控制項的英文介面

而若是在圖5-15中將慣用語言設定為zh-CN，我們會看到控制項中的語言文字變成了中文。5-17所示。

圖5-17控制項的中文介面

5.6.5 讓使用者手工選擇網站語言

作為一個設計良好、充分考慮到使用者體驗的多語言Web網站來說，給使用者提供切換當前語言的功能就變得非常重要。ASP.NET為此提供了強大的支援，接下來我們就來為本樣本程式添加該功能。

首先在頁面中添加一個DropDownList控制項，其中列舉了當前網站提供的語言：

<asp:DropDownList ID="ddlLanguageSelector" runat="server" AutoPostBack="True"

    OnSelectedIndexChanged="ddlLanguageSelector_SelectedIndexChanged">

    <asp:ListItem Value="en-US">English</asp:ListItem>

    <asp:ListItem Value="zh-CN">中文</asp:ListItem>

</asp:DropDownList>

上面DropDownList控制項的AutoPostBack屬性設定為了true，表示若使用者改變了DropDownList中的選中項目，頁面將自動進行一次回送，執行ddlLanguageSelector_SelectedIndexChanged()事件處理函數。該事件處理函數的定義如下，其中根據DropDownList中的選中項目設定了當前線程的地區資訊：

protected void ddlLanguageSelector_SelectedIndexChanged(object sender, EventArgs e)

{

    System.Threading.Thread.CurrentThread.CurrentUICulture =

        System.Globalization.CultureInfo.CreateSpecificCulture(

            ddlLanguageSelector.SelectedValue

        );

}

在Page_Load()函數中，我們也要設定DropDownList中的初始被選中項——自然是根據使用者的預設區域設定：

protected void Page_Load(object sender, EventArgs e)

{

    if (!IsPostBack)

    {

        ListItem selectedItem = ddlLanguageSelector.Items.FindByValue(

            System.Threading.Thread.CurrentThread.CurrentUICulture.Name

        );

        selectedItem.Selected = true;

    }

}

再次運行本樣本程式，使用者即可在頁面中根據喜好選擇介面的語言了。5-18所示。

圖5-18 使用者可以選擇網站的語言

麻雀雖小，五髒俱全。相信通過學習本節這個簡單樣本程式的開發全過程，我們都可以輕鬆地根據實際需要，建立出專業的、支援多語言的ASP.NET AJAX網站。

 

5.7 小結

ASP.NET AJAX允許我們開發人員直接在用戶端JavaScript代碼中與ASP.NET 2.0的身份認證以及使用者個人化應用程式服務進行互動，無須進行傳統的整頁回送。

作為身份認證應用程式服務的用戶端代理， AuthenticationService對象負責所有與伺服器端通訊的具體實現。本章首先詳細介紹了AuthenticationService對象，並給出了一個使用該對象以Ajax方式完成使用者登入/登出功能的完整樣本程式。

類似地，用戶端ProfileService對象也是在JavaScript中操作ASP.NET 2.0使用者個人化應用程式服務所不可缺少的重要重要組件。本章隨後介紹了該對象的各個方法/屬性/欄位，並通過樣本程式示範了以Ajax方式讀序、修改並儲存使用者個人化屬性的具體實現方法。

ASP.NET AJAX不但為訪問ASP.NET 2.0應用程式服務提供了預設的支援，還允許我們根據實際項目的需要手工定製應用程式服務Web Service的具體實現方法。本章也簡要介紹了這部分內容，並給出了自訂伺服器端身份認證和使用者個人化Web Service的原型。

除了能夠與ASP.NET 2.0應用程式服務無縫結合之外，ASP.NET AJAX架構也為我們提供了強大的用戶端指令碼本地化功能支援。本章最後藉助一個完整的樣本程式，並穿插分析說明，介紹了建立支援多語言的ASP.NET AJAX用戶端應用程式的詳細方法。