專利名稱：基于ajax技術的動態(tài)頁面處理系統(tǒng)的制作方法
技術領域：
本發(fā)明屬于頁面開發(fā)技術領域，具體涉及一種基于aj ax技術的動態(tài)頁面處理系統(tǒng)。
背景技術：
現(xiàn)代B/S架構的管理系統(tǒng)大多是基于動態(tài)頁面，并部署在支持各自的應用服務器，如tomcat，iis等。此類部署架構在面對超大并發(fā)訪問時，服務器端對于頁面的性能消耗和響應速度會是一個需要考慮的問題。具體來說，包括1、動態(tài)頁面本身的處理要比靜態(tài)頁面復雜，對服務器消耗高，響應時間長。2、系統(tǒng)中也有很多圖片，腳本，html頁面等靜態(tài)資源，但一般應用服務器的處理效率都遠低于純http服務器(如apache)。這樣最終使得系統(tǒng)處理性能下降，用戶在界面上要等待的時間變長，長時間“白屏”。對于系統(tǒng)處理性能，目前的解決方案有將純http服務器和應用服務器結合部署，由純http服務器處理靜態(tài)內容，如js，html等；應用服務器處理服務器端腳本，如jsp，php等。雖然系統(tǒng)整體提高了靜態(tài)頁面的處理能力，解決了對于靜態(tài)內容處理的問題，但還是要等待應用服務器處理完畢才返回整個頁面的內容。另外還有將動態(tài)頁面靜態(tài)化，即將動態(tài)頁面的返回結果直接保存為靜態(tài)html頁面。舉例來說，以jsp為例，某系統(tǒng)里有一個產品信息的表單訪問路徑是這樣的ProductInfo. jsp pid=123,客戶端在訪問這個頁面時會在服務器端產生以下的消耗1、初次訪問jsp頁面編譯的時間；2、根據(jù)pid=123進行數(shù)據(jù)庫查詢，得到相應數(shù)據(jù)的時間；3、將結果通過servlet的out對象輸出的時間。其中，第二、第三個消耗時間在每次訪問時都需要執(zhí)行。因此采取頁面靜態(tài)化處理，會將上面步驟3的返回結果在服務器端之間保存為例如ProductInfo_123. html這樣的頁面。后面再有用戶請求就直接指向這個html頁面。這樣就省略了上述步驟I和2，可以大大提高頁面響應速度。這種方案在各類內容管理平臺中很常用，因為一般此類系統(tǒng)的數(shù)據(jù)更新頻率不高，適合進行靜態(tài)化處理。但是如果數(shù)據(jù)變動頻繁，如各類信息管理系統(tǒng)，用戶每時每刻都會通過表單與數(shù)據(jù)庫進行交互，靜態(tài)化處理本身就會帶來很多系統(tǒng)消耗，這種方案就不再適合了。本發(fā)明因此而來。

發(fā)明內容
本發(fā)明目的在于提供一種基于ajax技術的動態(tài)頁面處理系統(tǒng)，解決了現(xiàn)有技術中動態(tài)頁面開發(fā)時系統(tǒng)消耗太大、用戶在界面上要等待的時間過長、系統(tǒng)性能低下等問題。為了解決現(xiàn)有技術中的這些問題，本發(fā)明提供的技術方案是一種基于ajax技術的動態(tài)頁面處理系統(tǒng)，包括客戶端、http服務器、應用服務器，所述客戶端瀏覽器通過路由服務器分別與http服務器、應用服務器通信，其特征在于所述http服務器負責接收靜態(tài)頁面請求，并將靜態(tài)頁面連同頁面的上應用的靜態(tài)資源一起返回給客戶端瀏覽器，并在瀏覽器上展現(xiàn)頁面主體；所述應用服務器負責接收非靜態(tài)頁面請求，
3客戶端瀏覽器的頁面通過ajax請求訪問應用服務器，應用服務器向瀏覽器返回動態(tài)數(shù)據(jù)，瀏覽器更新數(shù)據(jù)并更新頁面顯示。本發(fā)明的另一目的在于提供一種基于ajax技術的動態(tài)頁面處理方法，其特征在于所述方法包括以下步驟(I)瀏覽器向http服務器請求動態(tài)頁面中的頁面主體；(2) http服務器將靜態(tài)頁面連同頁面的上應用的靜態(tài)資源一起返回給瀏覽器，瀏覽器展現(xiàn)頁面主體；(3)瀏覽器的頁面通過ajax請求訪問應用服務器的服務器端腳本；(4)應用服務器將返回的數(shù)據(jù)返回給瀏覽器，瀏覽器再次更新頁面。本發(fā)明技術方案中提出了全新的系統(tǒng)部署方法，結合特定的頁面框架，有效的利用應用服務器和純http服務器各自的優(yōu)點，提高系統(tǒng)的整體響應能力和用戶體驗。采用靜態(tài)頁面框架，拋棄服務器端腳本，如jsp,php,全部改用html頁面和ajax的處理方法。此法可以使得系統(tǒng)不需要等待邏輯的全部處理完畢，而在第一時間響應用戶的頁面請求，加載出系統(tǒng)頁面。上述方法配合http服務器與應用服務器一起部署的整體部署結構。此法充分發(fā)揮了 http服務器處理靜態(tài)資源的優(yōu)勢，提升了系統(tǒng)的整體性能，同時也方便后續(xù)集群的擴展。相對于現(xiàn)有技術中的方案，本發(fā)明的優(yōu)點是本發(fā)明技術方案結合了現(xiàn)有技術各自的優(yōu)點，并對缺陷進行了回避，與頁面靜態(tài)化相比，不去將原來的內容直接生成靜態(tài)頁面，而是將靜態(tài)內容先加載，再讀取數(shù)據(jù)，提升性能的同時，更能適應數(shù)據(jù)變動頻繁的信息系統(tǒng)的要求。與直接用http服務器與應用服務器混合部署的方式相比，利用快速返回的靜態(tài)頁面，給用戶第一時間的響應，避免了原來需要等待所有服務器請求響應完畢的過程。


下面結合附圖及實施例對本發(fā)明作進一步描述圖I為基于ajax技術的動態(tài)頁面處理系統(tǒng)的靜態(tài)頁面框架訪問過程圖；圖2為基于ajax技術的動態(tài)頁面處理系統(tǒng)的網絡部署結構圖；圖3為基于ajax技術的動態(tài)頁面處理系統(tǒng)的系統(tǒng)訪問流程圖。
具體實施例方式以下結合具體實施例對上述方案做進一步說明。應理解，這些實施例是用于說明本發(fā)明而不限于限制本發(fā)明的范圍。實施例中采用的實施條件可以根據(jù)具體廠家的條件做進一步調整，未注明的實施條件通常為常規(guī)實驗中的條件。實施例本實施例得到的基于ajax技術的動態(tài)頁面處理系統(tǒng)，包括客戶端、http服務器、應用服務器，所述客戶端瀏覽器通過路由服務器分別與http服務器、應用服務器通信，所述http服務器負責接收靜態(tài)頁面請求，并將靜態(tài)頁面連同頁面的上應用的靜態(tài)資源一起返回給客戶端瀏覽器，并在瀏覽器上展現(xiàn)頁面主體；所述應用服務器負責接收非靜態(tài)頁面請求，客戶端瀏覽器的頁面通過ajax請求訪問應用服務器，應用服務器向瀏覽器返回動態(tài)
4數(shù)據(jù)，瀏覽器更新數(shù)據(jù)并更新頁面顯示。本實施例的系統(tǒng)主要包括2個部分一、靜態(tài)頁面框架。本實施例舍棄jsp等服務器端腳本，換成html頁面，通過ajax請求與服務器端交互，并通過JSON格式進行參數(shù)的傳遞。ajax是“Asynchronous JavaScript And XML “(異步JavaScript和XML),可以以非阻塞的方式請求服務器端資源。JSON(JavaScript ObjectNotation)是一種輕量級的數(shù)據(jù)交換格式，易于人閱讀和編寫，同時也易于機器解析和生成用戶所有請求的都是html頁面，這樣可以第一時間加載出主體頁面內容，再通過aj ax技術進行服務器端功能的請求，最后利用回調函數(shù)獲取返回數(shù)據(jù)進行頁面內容的更新?？蚣鼙旧戆ㄒ訨avascript引擎和服務器端處理接口 I. Javascript 引擎a) url參數(shù)處理器獲取url參數(shù)，并封裝成JSON格式，方便后續(xù)數(shù)據(jù)處理。b) ajax請求對象可以發(fā)送ajax請求,擁有回調函數(shù)接口和異常處理接口一個典型的用jquery實現(xiàn)的引擎示例可以這樣的
S(d oc U ment).reacly( fun ction(){
//獲取uri參數(shù)，轉換成JSOX格式
var pa rams = getL· RLPa rams(window,loction. href);
$.ajax{
type : 'post*,
url : "productlnfo.action",
dataType : 'json',data : params,success : doSomeThingf)2.服務器端處理接口 a)請求攔截器能夠攔截到ajax請求，并處理好參數(shù)。b)訪問權限的控制器。c)業(yè)務邏輯調用器d)處理結果封裝器將業(yè)務邏輯的處理結果進行數(shù)據(jù)封裝再返回到客戶端e)相關的異常處理接口—個典型的用java的servlet實現(xiàn)的處理接口可以是這樣的public void doPost(HttpServ!etRequest request, HttpServIetResponse
response)
throws Ser V let Except ion, IOException {
//獲取ajax提交的參數(shù)Object Params = getParanis();
//調用業(yè)務邏輯方法
Object result = doSonieThing(Params);
//返回結果
PrintWriter out = response.getWriter();
out.write(result);
out.dose();
I舉例說明，當訪問地址為ProductInfo. html pid=123的頁面時,如圖I所示步驟一解析url 參數(shù)，形成 params= {pid: 123}步驟二 發(fā)送ajax請求步驟三服務器響應ajax請求，調用業(yè)務邏輯，獲取到Product的具體信息并返回。步驟四通過ajax的回調函數(shù)，獲取到數(shù)據(jù)，將Product的信息展現(xiàn)到頁面上或進行異常處理。二、系統(tǒng)整體部署方式以tomcat和apache為例，系統(tǒng)部署時將全部的靜態(tài)文件放到http服務器(如apache)里面，將所有的非靜態(tài)資源，如servlet, javabean等部署的應用服務器(如tomcat)里面。配置http服務器的轉發(fā)規(guī)則，根據(jù)url匹配，將靜態(tài)資源的請求轉發(fā)給http服務器，非靜態(tài)資源轉發(fā)給應用服務器，兩者各自將處理結果返回給瀏覽器。將框架和部署結構結合起來，即為系統(tǒng)的整個訪問結構對于大并發(fā)下的B/S架構管理系統(tǒng)，從系統(tǒng)性能提升和用戶訪問感受的角度上來講，此法比其他已知方案效果都好，通用性都強。服務器端可以是jsp, asp, php等各種語音；客戶端只要能支持javascript和ajax,例如pc,智能手機,平板電腦等。上述實例只為說明本發(fā)明的技術構思及特點，其目的在于讓熟悉此項技術的人是能夠了解本發(fā)明的內容并據(jù)以實施，并不能以此限制本發(fā)明的保護范圍。凡根據(jù)本發(fā)明精神實質所做的等效變換或修飾，都應涵蓋在本發(fā)明的保護范圍之內。
權利要求
1.一種基于ajax技術的動態(tài)頁面處理系統(tǒng)，包括客戶端、http服務器、應用服務器，所述客戶端瀏覽器通過路由服務器分別與http服務器、應用服務器通信，其特征在于所述http服務器負責接收靜態(tài)頁面請求，并將靜態(tài)頁面連同頁面的上應用的靜態(tài)資源一起返回給客戶端瀏覽器，并在瀏覽器上展現(xiàn)頁面主體；所述應用服務器負責接收非靜態(tài)頁面請求，客戶端瀏覽器的頁面通過ajax請求訪問應用服務器，應用服務器向瀏覽器返回動態(tài)數(shù)據(jù)，瀏覽器更新數(shù)據(jù)并更新頁面顯示。
2.一種基于ajax技術的動態(tài)頁面處理方法，其特征在于所述方法包括以下步驟(1)瀏覽器向http服務器請求動態(tài)頁面中的頁面主體；(2)http服務器將靜態(tài)頁面連同頁面的上應用的靜態(tài)資源一起返回給瀏覽器，瀏覽器展現(xiàn)頁面主體；(3)瀏覽器的頁面通過ajax請求訪問應用服務器的服務器端腳本；(4)應用服務器將返回的數(shù)據(jù)返回給瀏覽器，瀏覽器再次更新頁面。
全文摘要
本發(fā)明公開了一種基于ajax技術的動態(tài)頁面處理系統(tǒng)，包括客戶端、http服務器、應用服務器，所述客戶端瀏覽器通過路由服務器分別與http服務器、應用服務器通信，其特征在于所述http服務器負責接收靜態(tài)頁面請求，并將靜態(tài)頁面連同頁面的上應用的靜態(tài)資源一起返回給客戶端瀏覽器，并在瀏覽器上展現(xiàn)頁面主體；所述應用服務器負責接收非靜態(tài)頁面請求，客戶端瀏覽器的頁面通過ajax請求訪問應用服務器，應用服務器向瀏覽器返回動態(tài)數(shù)據(jù)，瀏覽器更新數(shù)據(jù)并更新頁面顯示。該方法充分發(fā)揮了http服務器處理靜態(tài)資源的優(yōu)勢，提升了系統(tǒng)的整體性能，同時也方便后續(xù)集群的擴展。
文檔編號G06F17/30GK102938776SQ20121037168
公開日2013年2月20日 申請日期2012年9月28日 優(yōu)先權日2012年9月28日
發(fā)明者錢駿, 夏幫國, 王長堯 申請人:方正國際軟件有限公司