下載 PDC_userinput.exe 樣本檔案 (44 KB)。
內容:
- 簡介
- 問題
- 目標
- 解決方案概述
- 客戶機特性
- 什麼是驗證器
- 驗證器示範
- 並非自願
- 規則化
- 逐一比較
- 符合習慣
- 尾聲
簡介
對使用者輸入進行驗證是基於 Web 的應用程式中常見的情況。為了開發應用程式,開發人員經常在這項工作中花費大量的時間和編輯大量的代碼,比我們希望的多得多。在 ASP+ 頁面架構的構建過程中,努力使輸入驗證這一任務比以前更容易是很重要的。
問題
在 HTML 3.2中,驗證資料是一個困難的過程。每次得到請求後,您需要編寫代碼來檢查輸入並向頁面返回使用者的錯誤,協助使用者正確填寫驗證表單。對於終端使用者、開發人員和伺服器來說,這實在是一個繁雜的過程。
DTHML 和指令碼語言使這一局面有所改善。它們在出現輸入錯誤時可以立即反饋到使用者,並在未改正前阻止使用者發佈頁面。但是,這幾乎不可能保證網站的每一個使用者都擁有所需的指令碼設計環境。這通常意味著,如果您要使用指令碼改善網頁的介面,就必須分別在客戶機和伺服器編寫兩次同樣的驗證邏輯,以防止無法執行客戶機代碼。
目標
對於驗證,我們的目標是:
- 為資料輸入頁面提供可以完成 90% 或更多典型驗證任務的組件。
- 讓這些組件在新型瀏覽器上執行充分的基於指令碼的驗證,在需要時,這些瀏覽器可以有效地退回到純 HTML 3.2 基於伺服器的驗證。
- 提供一個靈活的 API,以便輕鬆完成組件未包括的任何驗證任務。
我們訪問了大量實際的網頁來確定這些組件應該能夠處理的情境。我們的目標是在今後的應用程式中極大地減少驗證代碼。
解決方案概述
驗證器控制項是此解決方案的主要部分。驗證器是一個可視的 ASP+ 控制項,它用來檢查另一個控制項的特定驗證條件。它通常以一段文字的形式出現在使用者面前,根據它正在檢查的控制項是否發生錯誤來顯示或隱藏。它也可以是一幅映像,甚至也可以不可見,但仍然做有用的工作。有五種可以執行不同類型檢查任務的驗證器控制項。
解決方案的另一個元素是 ValidationSummary 控制項。大的資料輸入頁面通常有一塊列出所有錯誤的地區。ValidationSummary 通過從頁面上的驗證器控制項自動收集並產生其中的內容。
解決方案的最後一個元素是頁面對象自身。它顯示最重要的“IsValid”屬性,可以在伺服器代碼中檢查並確定使用者輸入是否正確。
客戶機特性
大多數網站在伺服器上執行驗證檢查,您無論如何都要為無指令碼的客戶機編寫基於伺服器的檢查,因此很難判斷是否要為所有胖客戶機重寫所有檢查。
驗證控制項改變了這一切,因為幾乎所有重複的邏輯都封裝在控制項中。如果一個使用 IE 4.0 或更新版本的客戶機使用了您的頁面,那麼它可以執行與在伺服器上相同的驗證,而無需編寫任何特殊的客戶機指令碼。
客戶機端驗證過程包括以下幾個特性:
- 錯誤資訊會隨著非法輸入的鍵入或改正而立即出現或消失。這種即時反饋使改正錯誤輸入變得更加容易。
- 在客戶機上有可偵測的錯誤時發生的“退回”可以得到避免,這節省了使用者時間並減少了伺服器上的點擊次數。
- 如果 ValidationSummary 檢測到錯誤,它只是更新自己而不退回。
- 如果有錯誤,ValidationSummary 可以選擇向使用者顯示一個訊息框。
- 客戶機邏輯完全包含在一個 JScript 庫中, 因此不使用 ActiveX 組件或 Java Applet。
- 也可以選用 VBScript 來執行涉及本地化日期的檢查和數字比較。
- 在客戶機上展示一個物件模型,以增強客戶機端的驗證和行為。
什麼是驗證器?
為了有效地使用驗證器,給出其嚴格的定義是很有協助的,讓我們提煉一下以前給出的定義:
“驗證是一個控制項,它在一個輸入控制項中檢查某種特定類型的錯誤條件,並顯示該問題的說明。”
這是一個重要的定義,因為它意味著您經常需要為每個輸入控制項使用多個驗證器控制項。
例如,如果您要檢查文字框中的使用者輸入是否為 (a) 非空,(b) 在特定範圍中的合法日期,或 (c) 小於在另一文本輸入控制項中的日期,那麼您可能要使用三個驗證器。這也許顯得有些繁瑣,但請記住這對使用者是有協助的,對所有這些情況您可能要使用三種不同的文本說明。
下面列出幾種不同的驗證器:
RequiredFieldValidator |
檢查使用者是否輸入或選擇了任何內容 |
RegularExpressionValidator |
根據規則運算式檢查使用者輸入。該過程允許進行許多種類的檢查,可以用於郵遞區號和電話號碼等的檢查。 |
CompareValidator |
將輸入控制項與一個固定值或另一個輸入控制項進行比較。例如,它可以用在口令驗證欄位中。也可以用來比較輸入的日期和數字。 |
RangeValidator |
與 CompareValidator 非常相似, 只是它用來檢查輸入是否在兩個值或其它輸入控制項的值之間。 |
CustomValidator |
允許使用者編寫自己的代碼以加入到驗證架構中。 |
驗證器示範
為了示範驗證任務,我們將概要介紹向現有頁面添加驗證的過程。以下是一些必需條件的樣本:
編寫一個 Web 頁面來收集新的使用者 id 和口令。使用者 id 必須包含 6-10 個字母字元,且必須是未使用的。口令必須包括 4-12 個字母,其中至少有一個數字和一個“@#$%^&*/”中的字元。使用者必須再次輸入口令以確保輸入無誤。
我將從一個 HTML 頁面開始,該頁面已做了最小程度的轉換以適用於 ASP+ 頁面架構。
轉換頁面的過程包括下述步驟:
- 將擴充尾碼從“.html” 或“.asp” 轉換為“.aspx”。
- 將表單模板和所有輸入標籤改為“runat=server”。
- 使用“ID” 而不是“name”。
起始程式碼:
<html><head><title>驗證樣本;/title></head><body><p>請輸入新的使用者識別碼 和口令</p><form runat=server><table> <tr> <td>使用者識別碼 </td> <td><input type=text runat=server id=txtName></td> </tr> <tr> <td>口令 </td> <td><input type=password runat=server id=txtPWord></td> </tr> <tr> <td>請重新輸入口令 </td> <td><input type=password runat=server id=txtRePWord></td> </tr><table><br><input type=submit runat=server id=cmdSubmit value=Submit></form></body></html>
起始頁:
並非自願
我們首先要強制使所有欄位都已填充。
在每一個欄位前添加 RequiredFieldValidator。若輸入欄位為空白,我們要在欄位前顯示一個星號(*),並在摘要地區報告文本錯誤。以下是向 User ID 欄位添加 RequiredFieldValidator 控制項的方法:
<tr> <td> <asp:RequiredFieldValidator runat=server ControlToValidate=txtName ErrorMessage="需要使用者識別碼。"> * </asp:RequiredFieldValidator> </td> <td>User ID:</td> <td><input type=text runat=server id=txtName></td> </tr>
若輸入為空白,則在標籤旁邊顯示 *。出錯訊息在摘要中報告。“ControlToValidate”屬性指定了需要驗證的控制項 ID。最後一步是向頁面頂部添加驗證總結,如下所示:
<asp:ValidationSummary runat=server headerText=此頁有錯誤:/>
該頁面如下所示:
規則化
下一步我們需要強調使用者識別碼 和口令欄位的要求。對這些欄位,要使用 RegularExpressionValidator 控制項。規則運算式在此類資訊的簡明表達檢查中非常有效,這些資訊還包括郵遞區號、電話號碼和電子郵件地址。
下面顯示了如何指定對使用者識別碼 的限制:
<td> <input type=text runat=server id=txtName> <asp:RegularExpressionValidator runat=server ControlToValidate="txtName" ErrorMesage="口令必須由 6-10 個字母組成。" ValidationExpression="[a-zA-Z]{6,10}" /> </td>
注意在本樣本中,我們並沒有指定標記內的任何內部內容。內部文本等同於控制項的“文字屬性”。如果它為空白,出錯資訊將顯示在控制項所在的位置,同樣它也出現在摘要中。
可以用下面兩個驗證器來檢查口令。如果您使用了多個驗證器,則只有它們全都匹配時,才可以認為輸入是有效。
<asp:RegularExpressionValidator runat=server display=dynamic ControlToValidate="txtPWord" ErrorMessage="口令必須包含 @#$%^&*/ 中的一個。" ValidationExpression=".*[@#$%^&*/].*" /> <asp:RegularExpressionValidator runat=server display=dynamic ControlToValidate="txtPWord" ErrorMessage="口令必須是 4-12 個非空白字母。" ValidationExpression="[/S{4,12}" />
這是操作中帶有運算式的表單。
逐一比較
我們需要確認口令的重新輸入欄位與口令匹配。需要使用 CompareValidator 控制項完成此操作。因為它能夠同時處理兩個輸入控制項。
<asp:CompareValidator runat=server ControlToValidate=txtRePWord ControlToCompare=txtPWord ErrorMessage="口令不匹配。" />
預設情況下,CompareValidator 只做簡單的字串匹配比較。如果需要,它可進行涉及日期和數位更複雜的比較。
符合習慣
我們需要檢查的最後一件事是名稱尚未在假想的網站中使用。這要繼續在伺服器上尋找一些資料。為了類比此操作,我在伺服器端的程式碼片段中建立一個啞函數來檢查第一個字元是否不是“a”。下面的 Visual Basic 函數在頁面上定義:
public function CheckID(source as Object, value as String) as Boolean return value.substring(0, 1).tolower() <> "a"end function
要調用這一函數,我將添加一個 CustomValidator,它用於調用開發人員的代碼來執行檢查。以下是它的聲明:
<asp:CustomValidator runat=server controltovalidate="txtName" errormessage="ID 已經在使用。" OnServerValidationFunction="CheckID" />
它也可以調用客戶機指令碼中的定製函數,儘管如果它必須在資料庫中尋找值時這會不太實用。在有指令碼的客戶機上,在其它所有驗證器先在客戶機上執行檢查後才允許提交。如果只在伺服器上進行的檢查檢測到這樣的錯誤,則會向使用者返回頁面指出這些錯誤。
尾聲
現在,唯一剩下的事就是使用經過精細驗證後的資料了。您需要做的只是檢查頁面的 IsValid 屬性,判定是否可以進行資料庫的更新。您提交的處理常式可能類似下面的形式:
public sub OnSubmit(source as Object, e as EventArgs) if Page.IsValid then '現在我們可以執行事務。 end ifend sub
正如您所看到的那樣, 該處理常式允許資料輸入頁包含特定於您應用程式的代碼,而不是通篇代碼都來處理一般的輸入檢查。
以下是關於最終活動頁面的其它一些資訊: