本文是關(guān)于使用 web 服務(wù)的 — 簡單服務(wù)和 RESTful web 服務(wù) — 使用 Dojo Toolkit。為了更好地理解本文,您需要在您的系統(tǒng)進行以下安裝和配置:
隨著人們對構(gòu)建更好的 Rich Internet Applications (RIAs) 的關(guān)注。JavaScript 架構(gòu)的出現(xiàn)使得 web 開發(fā)人員可以將它們的應(yīng)用程序開發(fā)得更具吸引力。
預(yù)先包裝的 JavaScript 庫擁有諸多優(yōu)點。第一,使用在不同瀏覽器和不同平臺上驗證過的代碼可以極大地減少在許多不同瀏覽器上驗證功能需要的測試次數(shù),因而也減少了代碼中缺陷。第二,使用已編寫且測試的代碼節(jié)省了大量時間,使您可以更快地完成您的應(yīng)用程序。
Ajax 是一個用來描述一個組合技術(shù)的術(shù)語,在加載用戶 web 頁面時用來調(diào)用(異步)服務(wù)器。這項技術(shù)在今天的 web 頁中無處不在,在提供豐富的 Web 體驗方面起著重要的作用。
在本文的示例中,每一次用戶只要修改文本框中的文本內(nèi)容,JavaScript 代碼都會進行一個服務(wù)器調(diào)用來獲取參考值。一方面,這個附加函數(shù)將產(chǎn)生一些流量。另一方面,如果用戶通過提交整個表單進行重復(fù)的搜索,該技術(shù)將節(jié)省很多流量。
本例使用最新版 Eclipse 以及已安裝的 JavaScript 工具。這些工具提供改進功能來編輯 JavaScript 和 HTML 頁面。
根據(jù)下面步驟創(chuàng)建一個項目,然后利用這個項目創(chuàng)建幾個 HTML 文件,來完成這個示例:
當您向您的項目添加文件時,Eclipse 自動將文件發(fā)布到為服務(wù)器配置的目錄下。您可以通過在該項目中創(chuàng)建您的第一個 HTML 文件(是一個 index.html 文件)來了解這些,您需要修改該文件來包含實例所用的搜索框。
按照以下步驟創(chuàng)建新 HTML 文件:
新文件看起來像清單 1 這樣。
|
現(xiàn)在,您已經(jīng)有一個靜態(tài) web 項目和一個 HTML 頁了,是時候向 HTML 頁中添加一個輸入控件了。HTML 文件包含一些 div
標記,定位輸入控件并使建議選項容易些。結(jié)果生成清單 2 所示的 HTML 文件。
|
在這一點上,與空白版本有很大的區(qū)別。大部分工作可以通過使用 web 頁中的 JavaScript 代碼完成。
您可以以兩種方式包含 Dojo Toolkit:
哪個方法更好取決于您的需求。
使用公開托管文件有兩個很好的理由:
使用一個公開托管的文件主要優(yōu)勢是,如果 CDN 不可用(這種情況未必會發(fā)生,但是也有可能)您將不需要任何控件。如果由于某種原因 CDN 關(guān)閉了,您的網(wǎng)站也就不起作用了。如果您的內(nèi)部 web 應(yīng)用程序需要確保運行正常,考慮維護 Dojo 腳本文件來減少您應(yīng)用程序的單點故障。
要從一個 CDN 中鏈接 Dojo 文件系統(tǒng),修改您的 index.html 文件使其看起來如清單 3 所示。
|
如果您想下載和包含 Dojo Toolkit 基本文件,而不是鏈接它,您可以從 參考資料 中鏈接的網(wǎng)站下載 Dojo JavaScript 代碼。下載完這個文件之后,您可以使用 File > Import 將其導入到 Eclipse 中的項目中。按照慣例,通常創(chuàng)建一個名為 js 或 script 的文件夾比較好,您不僅可以將您的 JavaScript 代碼放在其中,也可以將您下載的文件放在其中。
為了將您下載的文件包含到您的 Web 頁,像這樣修改 index.html,如清單 4 所示。
|
現(xiàn)在您有了一個基本 web 頁,您要準備添加更多的功能,通過添加調(diào)用服務(wù)的 JavaScript 代碼來完成。
現(xiàn)在您已經(jīng)創(chuàng)建了 index.html 文件,并將 Dojo JavaScript 文件鏈接到您的 index.html 文件了,是時候調(diào)用一個簡單服務(wù),來為用戶提供建議選項了。
本文提供兩個不同的調(diào)用服務(wù)和得到結(jié)果的示例。第一個是一個簡單的服務(wù),不一定要符合常見 RESTful web 服務(wù) URL 習慣。REST 不是一個標準,但是有很多方法可以巧妙地獲取 URL,為客戶端和 RESTful web 服務(wù)提供一個較好的互操作性。第二個實例是一個使用 dojox.rpc.Rest 方法的介紹。
因為來自服務(wù)的響應(yīng)根據(jù)查詢字符串進行改變,服務(wù)不需要您以一個動態(tài) web 應(yīng)用程序技術(shù)寫入其中(參考 參考資料,了解更多關(guān)于動態(tài) web 應(yīng)用程序的信息)。清單 5 中顯示的是一個簡單的 PHP 腳本,有一個名稱數(shù)組。根據(jù)用戶所提供的,從名稱列表中過濾出來,然后將它們添加到 Extensible Markup Language (XML) 響應(yīng)。
|
您可以以其他任何語言編寫一個簡單的腳本,返回一個類似的響應(yīng)來測試 JavaScript 代碼。
從 Dojo Toolkit 調(diào)用 URL 并不是很容易。如清單 6 所示簡單地設(shè)置參數(shù)進行調(diào)用,然后將它們傳遞到服務(wù)。
|
這些參數(shù)將在表 1 中進一步說明。
參數(shù) | 說明 |
---|---|
url | 此參數(shù)包括 URL(記住,這個 URL 不是一個 RESTful URL)。 |
handleAs | json、text 或 xml 之一。PHP 腳本使用 XML 響應(yīng),所以用在這里。 |
preventCache | 如果您不想緩存數(shù)據(jù),使用 ture。緩存數(shù)據(jù)可以執(zhí)行得更快,但是,如果結(jié)果是完全自動化的,這也不可取。 |
load | 該回調(diào)函數(shù)在服務(wù)返回數(shù)據(jù)時執(zhí)行。 |
error | 該回調(diào)函數(shù)在出現(xiàn)錯誤時執(zhí)行。 |
如果已經(jīng)正確設(shè)置了參數(shù),將它們傳遞到 dojo.xhrGet 方法。全部代碼如清單 7 所示。
|
除了調(diào)用標準 Ajax 風格服務(wù)之外,您也要使用 Dojo Toolkit 調(diào)用 RESTful web 服務(wù)。
除了用于發(fā)送請求的 HTTP 方法之外,大部分 RESTful web 服務(wù)的 URL 構(gòu)建方式都遵守為特定類型請求構(gòu)建 URL 的方式。如果您構(gòu)建一個符合這些傳統(tǒng)習慣的 RESTful 服務(wù),您可以使用 dojo.rpc.Rest 對象為您進行調(diào)用。dojo.rpc.Rest 對象進一步簡化了傳統(tǒng)服務(wù)調(diào)用。
清單 8 是一個使用 Dojo Toolkit 調(diào)用 RESTful web 服務(wù)的示例。
|
表 2 列出了固有的 RESTful URL 和 HTTP 動作的示例,應(yīng)該同每個類型的服務(wù)相匹配。注意,不是每一個瀏覽器都支持所有 HTTP 方法,因此您應(yīng)該根據(jù)您的需要進行測試和驗證,對于多數(shù)用戶,使用 GET 和 POST 方法可能是最佳選擇。
動作 | HTTP 方法 | 示例 URL |
---|---|---|
查找一個對象 | GET | http://www.example.com/hobbits/1 |
查找所有對象 | GET | http://www.example.com/hobbits/ |
刪除一個對象 | DELETE | http://www.example.com/hobbits/1 |
創(chuàng)建一個對象 | POST | http://www.example.com/hobbits/ |
更新一個新對象 | PUT | http://www.example.com/hobbits/1 |
如果您想創(chuàng)建一個 RESTful web 服務(wù)的全部實現(xiàn),框架有助于指導您構(gòu)建符合 RESTful URL 習慣的 URL。參見 參考資料,尋找不同語言的各種框架的更多信息。
既然您將要使用 Dojo 代碼調(diào)用服務(wù),您也可以更新 div
元素的內(nèi)容來包含查詢結(jié)果。這使得用戶可以根據(jù)其類型查看建議選項。
想要更新包含建議選項的 div
元素的值,使用 dojo.byId 方法通過 ID 獲取 div
的參考資料,并如清單 9 所示設(shè)置 innerHTML
屬性。dojo.byId 方法是傳統(tǒng) JavaScript 的 document.getElementById 方法的別名。
|
現(xiàn)在,您的代碼已經(jīng)可以正常運行了,您可以在瀏覽器中查看您的 index.html 頁。當您輸入一個值時 — 例如 Bag
— 建議選項將自動出現(xiàn)在您的 div
元素中。盡管本文并不能涵蓋全部的,您也應(yīng)該使用 Cascading Style Sheets (CSS) 使這些 div
整齊地排列在下拉框中,根據(jù)用戶的輸入提供建議選項。
當從一個 web 瀏覽器處理長期運行服務(wù)時,主要關(guān)注兩方面的問題:
在服務(wù)執(zhí)行時,如果在瀏覽器中沒有明顯的改變,用戶體驗將受長期運行服務(wù)的影響。如果您的 web 頁含有一個按鈕,可以進行一個 Ajax 或 RESTful 服務(wù)調(diào)用或者顯示結(jié)果,您應(yīng)該利用這些瀏覽器來顯示用戶即將發(fā)生的事情。否則您將要冒這樣的風險,一個用戶多次提交表單或者您將對網(wǎng)站很不耐煩甚至離開。
為了應(yīng)對用戶體驗問題,使用一個動畫(Dojo Toolkit 有針對這些的方法)或者禁用提交按鈕,使用戶不能多次提交。有了動畫視覺(例如,旋轉(zhuǎn)時鐘),用戶可以意識到將要發(fā)生什么,更愿意等待進程完成。
期待長期運行的服務(wù)來使用 Ajax 調(diào)用可能有問題,但是它們可能是有效的示例。長期運行服務(wù)的示例是那些聚集數(shù)據(jù)、生成文檔或者存檔文件示例。
在這種情況下,簡單調(diào)用服務(wù)并等待 — 特別是如果服務(wù)要運行好幾秒,不是一個最佳實踐。如果您的連接是混亂的,或者您的瀏覽器關(guān)閉了,那么在服務(wù)完成時,您將不能依賴回調(diào)機制來觸發(fā)。
如果您可以控制服務(wù),可以考慮向您的調(diào)用者返回一個惟一的限定符,使用一種后來向不同服務(wù)詢問請求狀態(tài)的方式。您的瀏覽器可以將這些數(shù)字放到本地的一個 cookie 存儲設(shè)備中,也可以讓瀏覽器和服務(wù)一起來保存用戶數(shù)量。
調(diào)用服務(wù)的這種方法允許您在服務(wù)器端開始長期運行的進程。在瀏覽器端,您可以對請求狀態(tài)使用輪詢來訪問服務(wù)層。(您可以對此使用 Dojo Toolkit's Timer 對象),該方法為用戶提供靈活性和穩(wěn)定性。
除此之外,Dojo Toolkit 使您可以在您的 web 應(yīng)用程序中進行 Ajax 調(diào)用,來提供 RIA 函數(shù)。不管是使用一個 CDN 或者是您自己下載 Dojo Toolkit 文件,您都可以利用預(yù)先寫入的且已測試的函數(shù)的優(yōu)勢。
Dojo Toolkit 使用 Ajax 和 RESTful web 服務(wù)提供調(diào)用純 web 服務(wù)的方法。這個工具包允許您處理 JSON、XML 和來自 Ajax 服務(wù)的文本響應(yīng)。
學習
獲得產(chǎn)品和技術(shù)
討論