首頁(yè) > 開(kāi)發(fā) > Asp > 正文

深入講解 ASP+ 驗證(三)

2018-10-16 21:06:55
字體:
來(lái)源:轉載
供稿:網(wǎng)友
客戶(hù)端的驗證

如果您的頁(yè)面啟用了客戶(hù)端驗證,則在往返過(guò)程中會(huì )發(fā)生完全不同的事件序列??蛻?hù)端的驗證使用客戶(hù)端 Jscript® 實(shí)現。實(shí)現該驗證不需要任何二進(jìn)制組件。

盡管 Jscript 語(yǔ)言的標準化做得很好,但是用于與瀏覽器中的 HTML 文檔交互的文檔對象模型 (Document Object Model, DOM) 沒(méi)有廣泛采用的標準。因此,客戶(hù)端的驗證只在 Internet Explorer 4.0 和更高版本中進(jìn)行,因為該驗證的對象是 Internet Explorer DOM。

從服務(wù)器的角度來(lái)說(shuō),客戶(hù)端的驗證只意味著(zhù)驗證控件將不同的內容發(fā)送到 HTML 中。除此之外,其事件序列完全相同。服務(wù)器端的檢查仍然執行。盡管看起來(lái)似乎多余,但是卻十分重要,因為:

某些驗證控件可能不支持客戶(hù)端腳本。有一個(gè)很好的例子:如果要同時(shí)使用 CustomValidator 和服務(wù)器驗證函數,但是沒(méi)有客戶(hù)機驗證函數。
安全性注意事項。某些人可以很容易得到一個(gè)包含腳本的頁(yè)面,然后禁用或更改該頁(yè)面。您不應利用腳本來(lái)阻止壞數據進(jìn)入您的系統,而只應是為了用戶(hù)得到更快的反饋。因此,如果要使用 CustomValidator,則不應提供沒(méi)有相應服務(wù)器驗證函數的客戶(hù)機驗證函數。
每個(gè)驗證控件都可以確保將一個(gè)標準的客戶(hù)端腳本塊發(fā)送到頁(yè)面中。實(shí)際上,這只是一小部分代碼,其中包含對腳本庫 WebUIValidation.js 中的代碼的引用。這個(gè)腳本庫文件包含客戶(hù)端驗證的所有邏輯,該文件需單獨下載,并且可以存儲在瀏覽器的緩存中。

關(guān)于腳本庫

因為驗證 Web 控件腳本在腳本庫中,所以不必將所有客戶(hù)端驗證的代碼直接發(fā)送到頁(yè)面中,盡管表面上似乎是這樣做的。主要的腳本文件引用類(lèi)似如下所示:

<script language="javascript"      
src="/_aspx/1.0.9999/script/WebUIValidation.js"></script>

默認情況下,腳本文件將安裝在 "_aspx" 目錄中默認的根目錄下,并使用相對于根的腳本 include 指令調用,該指令以正斜線(xiàn)開(kāi)頭。該引用表明每個(gè)單獨的對象不必包含腳本庫,同一臺計算機上的所有頁(yè)面可以引用同一個(gè)文件。您會(huì )注意到,該路徑中還有一個(gè)公用的語(yǔ)言運行時(shí)版本號,以便不同的運行時(shí)版本可以在同一臺計算機上運行。

如果查看一下您默認的虛擬根目錄,您會(huì )找到該文件并查看其中的內容。這些文件的位置在 config.web 文件中指定。config.web 文件是一個(gè)用于大多數 ASP+ 設置的 XML 文件。以下是該文件中位置的定義:

    <webcontrols
        clientscriptslocation="/_aspx/{0}/script/"
    />        

鼓勵您閱讀該腳本,以便深入了解發(fā)生的事件。不過(guò),建議您不要修改這些腳本,因為它們的功能與特定的運行時(shí)版本緊密相連。在運行時(shí)版本更新時(shí),這些腳本可能也需要相應的更新,您將或者放棄更改,或者面臨腳本不工作的問(wèn)題。如果特定項目必須更改這些腳本,先備份這些腳本,然后將您的項目指向備份文件,方法是使用私有的 config.web 文件替代這些文件的位置。如果字符串中包含格式指令 "{0}",運行時(shí)版本號將替換該指令。最好將該位置更改為一個(gè)相對引用或絕對引用。

禁用客戶(hù)端的驗證

有時(shí)您可能不希望進(jìn)行客戶(hù)端驗證。如果輸入字段的數目很少,客戶(hù)端驗證可能用處不大。您畢竟每次都要有一個(gè)需要往返服務(wù)器一次的邏輯。您會(huì )發(fā)現客戶(hù)機上動(dòng)態(tài)出現的信息對您的布局會(huì )有負面影響。

要禁用客戶(hù)端驗證,應使用 Page 指令 "clienttarget=downlevel"。該指令類(lèi)似以下 ASPX 文件的開(kāi)頭:

<%@ Page Language="c#" clienttarget=downlevel %>

該指令的默認值為 "auto",表示您只對 Microsoft Internet Explorer 4.0 或更高版本進(jìn)行客戶(hù)端驗證。

注意:   不幸的是,在 Beta 1 中,該指令并非僅僅是禁用驗證,同時(shí)還會(huì )使所有 Web 控件使用 HTML 3.2 標記來(lái)處理,這可能會(huì )產(chǎn)生意想不到的結果。最終版本提供了更好的方法來(lái)控制這個(gè)問(wèn)題。

客戶(hù)端事件序列

該序列是在運行包含客戶(hù)端驗證的頁(yè)面時(shí)發(fā)生的事件序列:

在頁(yè)面載入瀏覽器時(shí),需要對每個(gè)驗證控件進(jìn)行一些初始化。這些控件作為 <span> 標記發(fā)送,其 HTML 特性與服務(wù)器上的特性最接近。最重要的是,此時(shí)會(huì )將驗證器引用的所有輸入元素“掛接”。被引用的輸入元素將修改其客戶(hù)端事件,以便在每次輸入更改時(shí)調用驗證例程。
腳本庫中的代碼將在用戶(hù)使用 tab 鍵在各字段之間切換時(shí)執行。某個(gè)獨立的字段更改時(shí),將重新評估驗證條件,根據需要使驗證器可見(jiàn)或不可見(jiàn)。
當用戶(hù)嘗試提交表單時(shí),將重新評估所有驗證器。如果這些驗證器全部有效,表單將提交給服務(wù)器。如果存在一處或多處錯誤,則會(huì )出現下述情況:
提交被取消。表單并不提交給服務(wù)器。
所有無(wú)效的驗證器均可見(jiàn)。
如果某個(gè)驗證摘要包含 ShowSummary=true,則將收集來(lái)自驗證控件的所有錯誤,并使用這些錯誤更新其內容。
如果某個(gè)驗證摘要包含 ShowMessageBox=true,則將收集錯誤,并在客戶(hù)機的信息框中顯示這些錯誤。
因為在每次輸入更改時(shí)或提交時(shí)會(huì )執行客戶(hù)端驗證控件,所以在客戶(hù)機上通常會(huì )評估這些驗證控件兩次或兩次以上。請注意,提交后,仍將會(huì )在服務(wù)器上對這些驗證控件進(jìn)行重新評估。

客戶(hù)端 API

有一個(gè)可以在客戶(hù)機上使用的小型 API,以便在您自己的客戶(hù)端代碼中實(shí)現各種效果。因為某些例程不可能隱藏,所以理論上講,您可以利用客戶(hù)端驗證腳本所定義的所有變量、特性和函數。不過(guò),其中許多都是可以更改的實(shí)施細節。以下總結了我們鼓勵您使用的客戶(hù)端對象。

表 3. 客戶(hù)端對象

名稱(chēng) 類(lèi)型 說(shuō)明
Page_IsValid Boolean 變量 指出頁(yè)面當前是否有效。驗證腳本總是保持該變量為最新。
Page_Validators 元素數組 這是包含頁(yè)面上所有驗證器的數組。
Page_ValidationActive Boolean 變量 指出是否應進(jìn)行驗證。將此變量設置為 False 可以通過(guò)編程關(guān)閉驗證。
isvalid Boolean 屬性 每個(gè)客戶(hù)端驗證器均具有該屬性,指出驗證器當前是否有效。請注意,在 PDC 版本中,該屬性混用大小寫(xiě) ("IsValid")。


繞過(guò)客戶(hù)端驗證

您經(jīng)常需要執行的一項任務(wù)是在頁(yè)面上添加“取消”按鈕或導航按鈕。在這種情況下,即使頁(yè)面上有錯誤,您可能也希望使用該按鈕提交頁(yè)面。因為客戶(hù)端按鈕 "onclick" 事件在表單的 "onsubmit" 事件之前發(fā)生,因此可能會(huì )避免提交檢查,并繞過(guò)驗證。以下說(shuō)明如何使用 HTML Image 控件作為“取消”按鈕完成該任務(wù):

<input type=image runat=server
   value="取消"
     
   OnServerClick=cmdCancel_Click >

使用 Button 或 ImageButton 控件執行該任務(wù)會(huì )出現一些混淆,因為 "onclick" 事件假定為同名的服務(wù)器端事件。您應在客戶(hù)端腳本中設置該事件:

<asp:ImageButton runat=server id=cmdImgCancel
AlternateText="取消"
OnClick=cmdCancel_Click/>

<script language="javascript">
document.all["cmdImgCancel "].onclick =
           new Function("Page_ValidationActive=false;");
</script>

解決該問(wèn)題的另一種方法是:對“取消”按鈕進(jìn)行一定的設置,使其在返回時(shí)不會(huì )觸發(fā)客戶(hù)端腳本中的提交事件。HtmlInputButton 和 LinkButton 控件就是這樣的例子。

特殊效果

另一種常見(jiàn)的要求是:在出錯時(shí),除了由驗證器自身顯示的錯誤信息外,還需要其它一些效果。在這種情況下,您所作的任何修改均需在服務(wù)器或客戶(hù)機上同時(shí)進(jìn)行。假設您需要加入一個(gè) Label,根據輸入是否有效來(lái)更改顏色。以下是如何在服務(wù)器上實(shí)現該任務(wù):

public class ChangeColorPage : Page {
    public Label lblZip;
    public RegularExpressionValidator valZip;
    
    protected override void OnLoad(EventArgs e) {            
        lblZip.ForeColor = valZip.IsValid? Color.Black : Color.Red;
    }               
}

上述方法一切都很完美,但是,只要您如上所述修改驗證,就會(huì )發(fā)現除非您在客戶(hù)機上進(jìn)行了相同的操作,否則看起來(lái)會(huì )非常不一致。驗證框架會(huì )使您避免許多這種雙重效果,但是無(wú)法避免您必須在客戶(hù)機和服務(wù)器上同時(shí)實(shí)現的其它效果。以下是在客戶(hù)機上執行同一任務(wù)的片段:

<asp:Label id=lblZip runat=server
   Text="Zip Code:"/>
<asp:TextBox id=txtZip runat=server
    /></asp:TextBox><br>
<asp:RegularExpressionValidator id=valZip runat=server
   ControlToValidate=txtZip
   ErrorMessage="無(wú)效的郵政編碼"
   ValidationExpression="[0-9]{5}" /><br>

<script language=javascript>
function txtZipOnChange() {
   //如果客戶(hù)端驗證未處于活動(dòng)狀態(tài),則不執行任何操作
   if (typeof(Page_Validators) == "undefined")  return;
   //更改標簽的顏色
   lblZip.style.color = valZip.isvalid ? "Black" : "Red";
}
</script>

Beta 1 客戶(hù)端 API

對于 Beta 1 版,一些可以從客戶(hù)端腳本調用的函數會(huì )造成其它一些情況。

表 4. 從客戶(hù)端腳本調用的函數

名稱(chēng) 說(shuō)明
ValidatorValidate(val) 將某個(gè)客戶(hù)端驗證器作為輸入。使驗證器檢查其輸入并更新其顯示。
ValidatorEnable(val, enable) 獲取一個(gè)客戶(hù)端驗證器和一個(gè) Boolean 值。啟用或禁用客戶(hù)端驗證器。如果禁用,將不會(huì )評估客戶(hù)端驗證器,客戶(hù)端驗證器將總是顯示為有效。
ValidatorHookupControl(control, val) 獲取一個(gè)輸入 HTML 元素和一個(gè)客戶(hù)端驗證器。修改或創(chuàng )建該元素的 change 事件,以便在更改時(shí)更新驗證器。該函數適合于基于多個(gè)輸入值的自定義驗證器。


其特殊用途是啟用或禁用驗證器。如果您希望驗證只是在特定的情況下生效,可能需要在服務(wù)器和客戶(hù)機上同時(shí)更改激活狀態(tài),否則,您會(huì )發(fā)現用戶(hù)無(wú)法提交該頁(yè)面。

以下是上面的示例加上一個(gè)字段,該字段只在取消選中某個(gè)復選框時(shí)才會(huì )進(jìn)行驗證。

    public class Conditional : Page {
        public HtmlInputCheckBox chkSameAs;
        public RequiredFieldValidator rfvalShipAddress;
        protected override void Validate() {
            bool enableShip = !chkSameAs.Checked;
            rfvalShipAddress.Enabled = enableShip;
            base.Validate();
        }
    }

以下是客戶(hù)端等效的代碼:

<input type=checkbox runat=server id=chkSameAs
    >與付款地址相同<br>
<script language=javascript>
function OnChangeSameAs() {
    var enableShip = !event.srcElement.status;
    ValidatorEnable(rfvalShipAddress, enableShip);
}
</script>



發(fā)表評論 共有條評論
用戶(hù)名: 密碼:
驗證碼: 匿名發(fā)表

圖片精選