|
|
每個應(yīng)用程序的開發(fā)都是為了解決某個領(lǐng)域的問題。而每個領(lǐng)域都有自己的一套約束數(shù)據(jù)的規(guī)則和規(guī)范。應(yīng)用程序?qū)⑦@些約束應(yīng)用于數(shù)據(jù)時，約束也就成了驗證。所有應(yīng)用程序都需要驗證用戶輸入的數(shù)據(jù)。
目前，應(yīng)用程序一般都使用 if-else 語句組合來驗證數(shù)據(jù)。這些語句包含了開發(fā)人員硬編碼或通過服務(wù)器端代碼置入的驗證數(shù)據(jù)。通常，開發(fā)人員會使用服務(wù)器端代碼來避免可能導(dǎo)致 JavaServer Page（JSP）的細(xì)微數(shù)據(jù)更改。
您可以使用 JavaScript Object Notation（JSON）來分組和緩存元數(shù)據(jù)，并使用 JavaScript 函數(shù)來訪問元數(shù)據(jù)以驗證用戶輸入。
JavaScript 中有分散的元數(shù)據(jù)時，您無法控制服務(wù)器將評估多少數(shù)據(jù)以及有多少數(shù)據(jù)傳遞到客戶機。所有服務(wù)器端代碼片段都將被評估并發(fā)送到服務(wù)器上。但是，使用 JSON 緩存數(shù)據(jù)時，您可以完全控制向客戶機發(fā)送的元數(shù)據(jù)量，因為服務(wù)器端代碼將生成 JSON 形式的元數(shù)據(jù)。這有助于僅將元數(shù)據(jù)發(fā)送至與看到或輸入數(shù)據(jù)的用戶相對應(yīng)的客戶機上。
您還可以使用 JSON 來緩存用戶輸入的數(shù)據(jù)。程序緩存數(shù)據(jù)后，將擦除數(shù)據(jù)字段而不是刷新屏幕，這與 Ajax 類似。通過這種方法，用戶可以為同一屬性輸入另一組數(shù)據(jù)。
讓我們一起來探究一下如何使用 JSON 來緩存元數(shù)據(jù)。
JSON 概覽
使用 JSON（即 JavaScript Object Notation），將以一種特定的字符串形式來表示 JavaScript 對象。如果將具有這樣一種形式的字符串賦給任意一個 JavaScript 變量，該變量隨后將引用一個通過指定給該變量的字符串構(gòu)建的對象。
例如，假定有一個 policy 對象，它擁有以下屬性：
計劃名稱
描述
持續(xù)時間
您可以使用以下這種 JSON 形式的字符串來表示該 policy 對象：
{"Plane":{"Full Life Cover"}, "Description":{"The best life insurance plan"}, "Term":{"20 years"}}
如果將此字符串賦給任意一個 JavaScript 變量，則該變量將接受以這種對象為單位的數(shù)據(jù)。要訪問數(shù)據(jù)，請?zhí)峁┬枰L問的屬性所在的路徑。對于本例，將以上字符串賦給一個名為 policy 的變量：
var policy = {"Plane":{"Full Life Cover"}, "Description":{"The best life insurance plan"}, "Term":{"20 years"}}
將此字符串粘貼到 HTML 頁面的標(biāo)題部分中，然后編寫以下警報：
alert(policy.Plan)
如果在任何支持 JavaScript 的瀏覽器中查看此頁面，您都會看到顯示策略計劃的警報。
示例
為了演示 JSON 的性能，我們來看一個有 vehicle 對象列表的 person 對象和一個可以擁有一臺或多臺車輛的 person 對象。每臺車輛都有以下屬性：
品牌
注冊碼
CC
瀏覽器 UI 應(yīng)當(dāng)允許用戶添加多臺具有優(yōu)秀應(yīng)用性能的車輛（通常為固有要求）。每個屬性都有一些與之關(guān)聯(lián)的限制或驗證規(guī)則。您需要指定以下規(guī)則：
品牌名稱
品牌名稱決不能包含數(shù)字。
品牌名稱最多可包含兩個單詞，中間可加一個空格。
注冊碼
注冊碼必須全都是數(shù)字。
CC
CC 必須全都是數(shù)字。
CC 的最小值為 50，最大值為 5000。
將有三個與車輛屬性相對應(yīng)的輸入字段，用戶可在其中輸入信息。接下來，您將看到如何將驗證消息分組到 JSON 組中以及如何訪問這些驗證消息。
傳統(tǒng)方法
現(xiàn)在，當(dāng)用戶輸入的車輛數(shù)據(jù)為 40CC 時，程序必須顯示一條消息，說明輸入的數(shù)據(jù)不在有效的 CC 范圍內(nèi)。您可以用 清單 1 中的代碼簡單地顯示這條消息：
清單 1. 傳統(tǒng)代碼
if(cc < <%= minCC %> || cc > <%= maxCC %>) {
alert(<%= ResourceList.vehicleCCRangeMsg >);
}
ResourceList 是一個服務(wù)器端類，該類中含有關(guān)于車輛的國際化消息（如 vehicleCCRangeMsg）。這種方法解決問題時略顯混亂：
在這種方法中，您將把服務(wù)器端代碼添加到所有客戶端驗證函數(shù)中，以檢查條件并顯示消息。
如果更改了元數(shù)據(jù)和消息（例如服務(wù)器端類或變量）的組織方法，您將會為更改使用這些元數(shù)據(jù)和消息的客戶機腳本驗證函數(shù)感到十分頭痛。
JSON 能幫助您做什么？
如果只需在條件語句和警報中引用一個 JavaScript 變量而不是服務(wù)器端代碼，您感覺怎么樣？不需要把服務(wù)器端代碼包含在 JavaScript 中，而保存的服務(wù)器端元數(shù)據(jù)和消息中的更改也不會影響客戶端腳本。這種方法太棒了，是不是？好的，那就是使用基于 JSON 緩存元數(shù)據(jù)時要做的。
您將使用一個 JavaScript 對象把我們的驗證數(shù)據(jù)和消息分組到一個層級中。然后就像訪問層級的 JavaScript 對象一樣訪問這些消息。就是這樣，您已經(jīng)做到了！
當(dāng)此 JSON 元數(shù)據(jù)對象就緒后，先前的 JavaScript 代碼片段將類似于 清單 2。
清單 2. 帶有 JSON 元數(shù)據(jù)緩存對象的警報
if(cc < vehicleValidationsMetadata.CC.minCC ||
cc > vehicleValidationsMetadata.CC.maxCC) {
alert(vehicleValidationsMetadata.CC.RangeMessage);
}
現(xiàn)在，問題是誰來準(zhǔn)備 JSON 元數(shù)據(jù)對象？嗯，只有服務(wù)器能做這項工作。服務(wù)器必須生成這個 JSON 對象，并將其提供給客戶機（瀏覽器）。一些 Java API 可以幫助您準(zhǔn)備此類（事實上是任意一類）JSON 對象。請參閱 參考資料 來查看那些 API。
生成 JSON 元數(shù)據(jù)對象的典型方法為：
為實體及其驗證消息準(zhǔn)備一個層級 Java 對象。
對這些實體及其驗證消息調(diào)用 toString()。這些實體及其驗證消息最有可能把一個 JSON 形式的字符串提供給您。
將該字符串另存到一個請求范圍內(nèi)。
在 JSP 中，獲取該字符串，并將其指派到 JavaScript 變量值的大括號內(nèi)。
最終的車輛元數(shù)據(jù)對象看上去就會像 清單 3 一樣。
清單 3. 驗證元數(shù)據(jù) JSON 對象
var vehicleValidationsMetadata = {
"BrandName":{
"CanContainDigits":{false},
"MaxWords":{2},
"FormatMessage":{"Brand Name cannot contain digits."},
"WordLimitMessage":{"Brand Name cannot contain more than two words"}
}, "RegistrationNumber":{
"CanContainAlphabets":{false},
"CanContainDigits":{"true"},
"FormatMessage":{"Registration Number can contain only digits."}
},
"CC":{
"minCC":{50},
"maxCC":{5000},
"FormatMessage":
{"CC can only be numeric"},
"RangeMessage":{"CC can be within range of 50 and 5000"}
}
}
服務(wù)器必須生成整個字符串，第一行和最后一行除外，因為當(dāng)前的用戶語言環(huán)境可能要求使用這些消息（并且只有服務(wù)器端代碼能完成這項工作）。在這里，需要注意的一點是此元數(shù)據(jù)對象僅用于驗證車輛。更理想的情況是將 vehicle 元數(shù)據(jù)對象封裝到 person 元數(shù)據(jù)對象中。那樣，您就不需要再創(chuàng)建另一個 JavaScript 變量，而只需將該元數(shù)據(jù)對象包含到 person 元數(shù)據(jù)對象中。
在將此元數(shù)據(jù)對象準(zhǔn)備好后，您可以使用該對象中的元數(shù)據(jù)和消息來驗證數(shù)據(jù)輸入和顯示消息。現(xiàn)在，驗證車輛輸入信息的 JavaScript 函數(shù)看上去就會跟 清單 4 一樣。
清單 4. 車輛數(shù)據(jù)驗證函數(shù)
function validateVehicleData() {
var brandName = //get brand name from form field
var registrationNumber = //get Registration Number from form field.
var CC = //get CC from form field
var brandNameTokens = brandName.split(' ');
if(brandNameTokens.length > vehicleValidationsMetadata.BrandName.MaxWords) {
alert(vehicleValidationMessages.BrandName.WordLimitMessage);
}
.
.
.
if((!vehicleValidationsMetadata.RegistrationNumber.CanContainAlphabets) &&
isNaN(parseInt(registrationNumber))) {
alert(vehicleValidationMessages.RegistrationNumber.FormatMessage);
}
var ccNum = parseInt(CC);
if(ccNum < vehicleValidationMessages.CC.minCC ||
ccNum > vehicleValidationMessages.CC.maxCC) {
alert(vehicleValidationMessages.CC.RangeMessage);
}
}
這段代碼看上去是不是好多了？它沒有在 JavaScript 中混入服務(wù)器代碼。如果服務(wù)器端更改存儲元數(shù)據(jù)的方法，則無需再重寫客戶機腳本。這會使 JSP 編程人員的日子更輕松些。
擴展客戶端數(shù)據(jù)緩存
某些 Web 應(yīng)用程序要求用戶為同一個屬性或?qū)ο筝斎攵鄠€數(shù)據(jù)。例如，person-vehicle 要求人員為其擁有的每臺車輛都輸入數(shù)據(jù)。如果此人擁有多臺車輛，應(yīng)用程序必須允許輸入多臺車輛的數(shù)據(jù)。我將把此類對象作為一個 多組屬性 來引用。如果多組屬性包含任何可以保存多個數(shù)據(jù)實例的屬性，我將稱之為 多值屬性。
現(xiàn)在，多組屬性和多值屬性面臨的問題是必須將數(shù)據(jù)輸入到相同的輸入字段中。那意味著在輸入第二臺車輛的數(shù)據(jù)之前，必須先保存已輸入的第一臺車輛的數(shù)據(jù)。您可以通過兩種方法來解決此問題：
將第一臺車輛的數(shù)據(jù)發(fā)送到服務(wù)器上并清空輸入字段，以允許用戶輸入下一臺車輛的數(shù)據(jù)。
將數(shù)據(jù)緩存到客戶機上并清空輸入字段，以允許用戶輸入下一臺車輛的數(shù)據(jù)。
第一種方法存在的問題是每輸入一臺車輛的數(shù)據(jù)就需要訪問一次服務(wù)器。這不太好；如果在輸入車輛數(shù)據(jù)后都必須等待服務(wù)器響應(yīng)，用戶會覺得很失望。換種方法，第二種方法的響應(yīng)時間幾乎為零。用戶可以快速輸入所有車輛數(shù)據(jù)而無需等待。但這里需要考慮的是如何將數(shù)據(jù)存儲到客戶端上。這里有更多方法可將數(shù)據(jù)存儲到客戶機上：
在用戶單擊以添加下一臺車輛的數(shù)據(jù)時將數(shù)據(jù)以某種形式緩存到隱藏的表字段中。
將數(shù)據(jù)緩存到一個 JavaScript 對象中。
如果要將數(shù)據(jù)存儲到隱藏字段中，您會為用戶每次輸入新的車輛數(shù)據(jù)都要處理很多隱藏字段或處理隱藏字段數(shù)據(jù)而感到煩惱。這就像有字符串操作就需要頻繁處理字符串一樣。
但是第二種緩存數(shù)據(jù)的方法提供了一種面向?qū)ο蟮姆椒▉砭彺?。?dāng)用戶輸入新車輛數(shù)據(jù)時，您將在數(shù)組對象中創(chuàng)建一個新元素。不需要任何笨拙的字符串操作。當(dāng)用戶輸完所有車輛數(shù)據(jù)后，您只需構(gòu)建一個源于該對象的 JSON 字符串，并通過存儲到某個隱藏字段中的方式將該字符串發(fā)送至服務(wù)器。這種方法要比第一種方法好得多。
JSON、數(shù)據(jù)緩存和 Ajax 功能
當(dāng)使用 JSON 將數(shù)據(jù)緩存到客戶端時，系統(tǒng)將在用戶每次單擊 Add Vehicle 按鈕時更新數(shù)據(jù)緩存對象。用于完成此項任務(wù)的 JavaScript 函數(shù)看起來可能跟 清單 5 一樣。
清單 5. 用于將車輛數(shù)據(jù)添加到 JavaScript 對象中以進行客戶端緩存的函數(shù)
function addVehicleData() {
var brand = //get vehicle brand; var regNo = //get registration number;
var cc = //get cc;
vehicleData[vehicleData.length] = new Object();
vehicleData[vehicleData.length].brandName = new Object();
vehicleData[vehicleData.length].brandName = brand;
//same way update other two properties
}
在這里，vehicleData 是用于在用戶裝入頁面時進行初始化的 JavaScript 變量。它被初始化為一個新的數(shù)組對象，該數(shù)組對象為空或者含有用戶先前輸入的車輛的車輛元素。
當(dāng)此函數(shù)將數(shù)據(jù)保存到 JavaScript 對象中后，程序可以調(diào)用另一個函數(shù)來清空輸入字段以允許用戶輸入新數(shù)據(jù)。
在此類應(yīng)用程序中，要求用戶輸入出現(xiàn)次數(shù)最少或出現(xiàn)次數(shù)最多的多組或多值屬性。您可以將這些限制置入 JSON 元數(shù)據(jù)對象中。在這種情況下，先前的元數(shù)據(jù)對象將變?yōu)?nbsp;清單 6 中所示的代碼。
清單 6. 帶有出現(xiàn)次數(shù)限制的 JSON 元數(shù)據(jù)對象
var vehicleValidationsMetadata = {
"MIN_OCC":{0},
"MAX_OCC":{10},
"MAX_OCC_MSG":{"...."},
"MIN_OCC_MSG":{".....},
//Everything else is the same
}
然后，addVehicleData() 函數(shù)將先驗證數(shù)據(jù)的出現(xiàn)次數(shù)，然后在僅當(dāng)總出現(xiàn)次數(shù)未超出允許的限制時再將數(shù)據(jù)添加到 JavaScript 對象中。清單 7 顯示了檢查方法。
清單 7. JSON 元數(shù)據(jù)對象限制檢查
function addVehicleData() {
if(vehicleData.length == vehicleValidationsMetadata.MAX_OCC-1) {
alert(vehicleValidationsMetadata.MAX_OCC_MSG);
} //Everything else is the same
}
當(dāng)用戶提交一個頁面時調(diào)用的函數(shù)實際上用于驗證最少的出現(xiàn)次數(shù)。這種方法的最大好處是屏幕不需要刷新以輸入新車輛數(shù)據(jù)。提供此類靜態(tài)屏幕曾經(jīng)是 Ajax 技術(shù)的主要目標(biāo)，而您現(xiàn)在用 JSON 也能完成此目標(biāo)。這是關(guān)于更新 JSON 數(shù)據(jù)對象和通過 JavaScript 處理 HTML DOM 樹的全部內(nèi)容。用戶響應(yīng)時間是最小值，因為所有操作僅在客戶端上執(zhí)行。您可以使用 JSON 來為應(yīng)用程序提供 Ajax 功能。
當(dāng)用戶單擊 Save 按鈕時，程序?qū)⒄{(diào)用另一個 JavaScript 函數(shù)，該函數(shù)將把此 JSON 對象 字符串化 并將其存儲到程序提交到服務(wù)器上的隱藏表字段中。JSON.js（請參閱 參考資料）有一個 JSON.stringify() 函數(shù)，該函數(shù)將獲取 JavaScript 對象作為輸入并返回字符串輸出。
服務(wù)器端必須能夠理解 JSON 形式的字符串并生成一個服務(wù)器端對象，以處理和保存數(shù)據(jù)。Web 站點 http://www.json.org/Java/i... 提供了一個 Java API，該 API 用于處理基于 Java 的應(yīng)用程序的大部分需求。
結(jié)束語
您在本文中看到了 JSON 的強大用途。歸結(jié)如下：
JSON 提供了一種優(yōu)秀的面向?qū)ο蟮姆椒?，以便將元?shù)據(jù)緩存到客戶機上。
JSON 幫助分離了驗證數(shù)據(jù)和邏輯。
JSON 幫助為 Web 應(yīng)用程序提供了 Ajax 的本質(zhì)。
JavaScript技術(shù)：用 JSON 處理緩存，轉(zhuǎn)載需保留來源！
鄭重聲明：本文版權(quán)歸原作者所有，轉(zhuǎn)載文章僅為傳播更多信息之目的，如作者信息標(biāo)記有誤，請第一時間聯(lián)系我們修改或刪除，多謝。
