頁面切換方法及裝置制造方法
【專利摘要】本申請公開了頁面切換方法及裝置，其中，所述方法包括：監(jiān)控將當(dāng)前頁面切換到目標(biāo)頁面的操作請求，并獲取所述目標(biāo)頁面的資源地址；通過對當(dāng)前頁面的統(tǒng)一資源定位符URL的哈希值進(jìn)行修改，觸發(fā)瀏覽器的哈希值改變事件，以便瀏覽器在原生的訪問歷史中記錄所述哈希值的變化，并提供窗口句柄；其中，修改后的哈希值中包含有所述目標(biāo)頁面的資源地址信息；從所述窗口句柄中獲取所述目標(biāo)頁面的資源地址，并根據(jù)所述目標(biāo)頁面的資源地址向?qū)?yīng)的Web服務(wù)器發(fā)起異步加載請求；根據(jù)所述Web服務(wù)器返回的資源數(shù)據(jù)，在所述當(dāng)前頁面所在窗口中展現(xiàn)所述目標(biāo)頁面。通過本申請，為在異步加載的情況實(shí)現(xiàn)正確的頁面前進(jìn)或后退提供了基礎(chǔ)。
【專利說明】頁面切換方法及裝置
【技術(shù)領(lǐng)域】
[0001]本申請涉及Web應(yīng)用【技術(shù)領(lǐng)域】，特別是涉及頁面切換方法及裝置。
【背景技術(shù)】
[0002]Web應(yīng)用是依賴于客戶端瀏覽器,采用HTML (Hyper text Markup Language,超文本標(biāo)記語言)、CSS (Cascading Style Sheet,級聯(lián)樣式表)、JS (Java Script)等技術(shù)實(shí)現(xiàn)的一種應(yīng)用形式。視圖之間的切換(例如，將頁面窗口中顯示的頁面A切換到頁面B)通常要通過瀏覽器跳轉(zhuǎn)，即請求新的資源地址，在服務(wù)器響應(yīng)完成后，瀏覽器進(jìn)行重新加載，以便在頁面窗口中顯示出新的頁面內(nèi)容。值得注意的是，在瀏覽器進(jìn)行重新加載的過程中，用戶看到的將是空白頁面。在智能移動(dòng)終端上，由于受到移動(dòng)帶寬等限制，用戶面對白屏的時(shí)間將會(huì)更長。
[0003]為了避免上述現(xiàn)象的發(fā)生，現(xiàn)在有許多Web應(yīng)用支持SPI (single pageinterface,單頁面交互)，與傳統(tǒng)的MPI (multi page interface,多頁面交互)比起來，它在進(jìn)行頁面切換時(shí)，無需載入新的網(wǎng)頁，速度會(huì)快很多，用戶體驗(yàn)也會(huì)好很多。但是，在這種SPI方式下，頁面的切換一般是異步加載的方式實(shí)現(xiàn)的，也即頁面大部分內(nèi)容由AJAX (Asynchronous JavaScript and XML,異步 JavaScript 和 XML)載入。具體實(shí)現(xiàn)時(shí)，是由頁面中的JS腳本發(fā)起AJAX請求，在服務(wù)器返回頁面資源內(nèi)容之后，JS進(jìn)行頁面內(nèi)容的切換，整個(gè)過程不再通過瀏覽器來實(shí)現(xiàn)。
[0004]這種異步加載方式能夠加快響應(yīng)速度，更適合在智能移動(dòng)終端中應(yīng)用。然而，在實(shí)際應(yīng)用中可能會(huì)存在一些問題，例如，在通過上述這種異步加載方式從頁面A切換到頁面B之后，如果用戶點(diǎn)擊瀏覽器的后退按鈕，就會(huì)發(fā)現(xiàn)無法退回到頁面A，等等。

【發(fā)明內(nèi)容】

[0005]本申請?zhí)峁┝隧撁媲袚Q方法及裝置，以實(shí)現(xiàn)在異步加載的情況下正確的進(jìn)行頁面前進(jìn)或后退。
[0006]本申請?zhí)峁┝巳缦路桨?
[0007]一種頁面切換方法，包括:
[0008]監(jiān)控將當(dāng)前頁面切換到目標(biāo)頁面的操作請求，并獲取所述目標(biāo)頁面的資源地址；
[0009]通過對當(dāng)前頁面的統(tǒng)一資源定位符URL的哈希值進(jìn)行修改，觸發(fā)瀏覽器的哈希值改變事件，以便瀏覽器在原生的訪問歷史中記錄所述哈希值的變化，并提供窗口句柄；其中，修改后的哈希值中包含有所述目標(biāo)頁面的資源地址信息；
[0010]從所述窗口句柄中獲取所述目標(biāo)頁面的資源地址，并根據(jù)所述目標(biāo)頁面的資源地址，向?qū)?yīng)的Web服務(wù)器發(fā)起異步加載請求；
[0011]根據(jù)所述Web服務(wù)器返回的資源數(shù)據(jù)，在所述當(dāng)前頁面所在窗口中展現(xiàn)所述目標(biāo)頁面。
[0012]一種頁面切換裝置，包括:[0013]監(jiān)控單元，用于監(jiān)控將當(dāng)前頁面切換到目標(biāo)頁面的操作請求，并獲取所述目標(biāo)頁面的資源地址；
[0014]哈希值修改單元，用于通過對當(dāng)前頁面的統(tǒng)一資源定位符URL的哈希值進(jìn)行修改，觸發(fā)瀏覽器的哈希值改變事件，以便瀏覽器在原生的訪問歷史中記錄所述哈希值的變化，并提供窗口句柄；其中，修改后的哈希值中包含有所述目標(biāo)頁面的資源地址信息；
[0015]異步加載請求單元，用于從所述窗口句柄中獲取所述目標(biāo)頁面的資源地址，并根據(jù)所述目標(biāo)頁面的資源地址，向?qū)?yīng)的Web服務(wù)器發(fā)起異步加載請求；
[0016]展現(xiàn)單元，用于根據(jù)所述Web服務(wù)器返回的資源數(shù)據(jù)，在所述當(dāng)前頁面所在窗口中展現(xiàn)所述目標(biāo)頁面。
[0017]根據(jù)本申請?zhí)峁┑木唧w實(shí)施例，本申請公開了以下技術(shù)效果:
[0018]通過本申請，可以監(jiān)控到從當(dāng)前頁面向目標(biāo)頁面切換的操作請求之后，可以在獲取到目標(biāo)頁面的資源地址之后，通過對URL中的哈希值進(jìn)行修改，來觸發(fā)瀏覽器的哈希值改變事件，瀏覽器就會(huì)自動(dòng)在原生的訪問歷史中增加一條關(guān)于hash變化的記錄，并且提供窗口句柄，這樣本申請實(shí)施例中JS就可以從窗口句柄中獲取到目標(biāo)頁面的資源地址，然后采用異步加載的方式請求目標(biāo)頁面的資源內(nèi)容，并在窗口中進(jìn)行展現(xiàn)。由于在瀏覽器的訪問歷史中增加了關(guān)于hash變化的記錄,相當(dāng)于記錄了各個(gè)頁面與hash之間的對應(yīng)關(guān)系，因此，在執(zhí)行頁面的前進(jìn)或者后退操作時(shí)，就可以根據(jù)這種對應(yīng)關(guān)系，前進(jìn)或者后退到正確的頁面。
[0019]當(dāng)然，實(shí)施本申請的任一產(chǎn)品并不一定需要同時(shí)達(dá)到以上所述的所有優(yōu)點(diǎn)。
【專利附圖】

【附圖說明】
[0020]為了更清楚地說明本申請實(shí)施例或現(xiàn)有技術(shù)中的技術(shù)方案，下面將對實(shí)施例中所需要使用的附圖作簡單地介紹，顯而易見地，下面描述中的附圖僅僅是本申請的一些實(shí)施例，對于本領(lǐng)域普通技術(shù)人員來講，在不付出創(chuàng)造性勞動(dòng)的前提下，還可以根據(jù)這些附圖獲得其他的附圖。
[0021]圖1是現(xiàn)有技術(shù)中異步加載過程中的頁面后退過程示意圖；
[0022]圖2是本申請實(shí)施例提供的方法的流程圖；
[0023]圖3是本申請實(shí)施例提供的一方法中的系統(tǒng)框架示意圖；
[0024]圖4是本申請實(shí)施例提供的另一方法的流程圖；
[0025]圖5是本申請實(shí)施例提供的裝置的示意圖。
【具體實(shí)施方式】
[0026]下面將結(jié)合本申請實(shí)施例中的附圖,對本申請實(shí)施例中的技術(shù)方案進(jìn)行清楚、完整地描述，顯然，所描述的實(shí)施例僅僅是本申請一部分實(shí)施例，而不是全部的實(shí)施例?；诒旧暾堉械膶?shí)施例，本領(lǐng)域普通技術(shù)人員所獲得的所有其他實(shí)施例，都屬于本申請保護(hù)的范圍。
[0027]首先需要說明的是，在實(shí)現(xiàn)本申請的過程中發(fā)明人發(fā)現(xiàn)，現(xiàn)有的異步加載技術(shù)中之所以會(huì)存在無法后退到上一頁面，這是因?yàn)?，每一次的AJAX請求都不能在瀏覽器的訪問歷史中記錄，換言之，當(dāng)連續(xù)請求多個(gè)頁面文檔后，用戶點(diǎn)擊瀏覽器“后退”按鈕或者鍵盤上“退格”鍵執(zhí)行返回操作時(shí)，瀏覽器會(huì)從訪問歷史記錄中找到上一個(gè)頁面的地址(URL)，然后顯示出該地址對應(yīng)的頁面。但是,對于通過AJAX請求切換的頁面,切換前后的頁面具有相同的URL，也就是說，如果采用異步加載的方式從頁面A切換到頁面B，但是瀏覽器卻無法記錄這一切換過程，在瀏覽器看來，頁面A與頁面B具有相同的地址，相當(dāng)于是同一頁面，因此，在顯示出頁面B之后如果進(jìn)行后退操作，就無法退回到頁面A。
[0028]例如，參見圖1，假設(shè)從頁面A到頁面B是采用的正常的瀏覽器跳轉(zhuǎn)的方式，則在瀏覽器的訪問歷史中會(huì)分別記錄下頁面A的URL:taoba0.com,以及頁面B的URL:exampIe.com(該頁面可能是一個(gè)網(wǎng)站的首頁視圖)，在顯示出頁面B之后如果選擇后退，則瀏覽器會(huì)根據(jù)訪問歷史記錄，發(fā)現(xiàn)上一個(gè)頁面的地址是taoba0.com,于是可以按照該地址對頁面A進(jìn)行重新加載，從而正常的退回到頁面A。
[0029]在顯示出頁面B之后，如果又在頁面B中以異步加載的方式切換到頁面C (對應(yīng)網(wǎng)站的其他視圖)，則瀏覽器就無法發(fā)現(xiàn)該操作，切換的結(jié)果是，雖然網(wǎng)頁窗口內(nèi)顯示的內(nèi)容變成了頁面C，但是URL卻一直沒有變，仍然是example, com,因此，瀏覽器也不會(huì)在訪問歷史中記錄關(guān)于此次頁面切換的任何信息。在顯示出頁面C之后，如果用戶進(jìn)行后退操作，則瀏覽器根據(jù)訪問歷史記錄會(huì)發(fā)現(xiàn)上一個(gè)地址是taoba0.com,于是根據(jù)該地址進(jìn)行重新加載，使得最終后退到的頁面仍然是頁面A，而不是頁面B。
[0030]可見，之所以在執(zhí)行后退操作時(shí)會(huì)發(fā)生問題，主要是因?yàn)樵趫?zhí)行AJAX請求加載頁面的情況下，切換前后頁面的URL不變，瀏覽器無法感知到該切換事件的發(fā)生，不會(huì)在訪問歷史中對URL進(jìn)行記錄。因此，如果在以異步加載的模式進(jìn)行頁面切換時(shí)，能夠通過某種方式記錄這種變化，這樣，在執(zhí)行后退或者前進(jìn)操作時(shí)，就能夠正確的到達(dá)用戶所希望的目標(biāo)頁面。
[0031]為此，在本申請實(shí)施例中，采用以了一種基于路由控制器的頁面切換方法，其中，所謂的路由控制器是一種形象的說法，意思是，可以在進(jìn)行異步加載的過程中，對頁面切換的情況進(jìn)行記錄，使得在執(zhí)行頁面前進(jìn)或后退操作時(shí)，可以正確的前進(jìn)或者后退到所需要的頁面。具體實(shí)現(xiàn)時(shí)，可以在使用異步加載的方式切換頁面時(shí)，修改URL的哈希(hash)值，以此來觸發(fā)瀏覽器的哈希值改變事件，這樣瀏覽器就會(huì)自動(dòng)將改變了哈希值之后的URL記錄在訪問歷史記錄中，以此來跟蹤頁面的切換過程。換言之，可以根據(jù)瀏覽器提供的哈希值改變事件，封裝一整套方法，通過此方法可配置和建立hash匹配，使得每個(gè)AJAX異步加載的頁面分別和URL中hash值一一對應(yīng)，這樣，當(dāng)需要進(jìn)行頁面后退時(shí)，就可以根據(jù)訪問歷史記錄中記錄的上一個(gè)頁面的哈希值，對上一個(gè)頁面進(jìn)行異步加載，展現(xiàn)出上一個(gè)頁面，進(jìn)而解決使用AJAX時(shí)瀏覽器無法正常返回上一步的問題。為了便于理解，下面首先對URL的hash值以及哈希值改變事件進(jìn)行簡單地介紹。
[0032]關(guān)于URL的hash值，就是一個(gè)URL中“#”及其之后的字符串。從定義來看，“#”代表網(wǎng)頁中的一個(gè)位置。其右面的字符，就是該位置的標(biāo)識(shí)符。比如http://www.example,com/index.html#print,就代表網(wǎng)頁index.html的print位置。瀏覽器讀取這個(gè)URL后，會(huì)自動(dòng)將print位置滾動(dòng)至可視區(qū)域。“#”是用來指導(dǎo)瀏覽器動(dòng)作的，對服務(wù)器端完全無用。所以，HTTP請求中不包括“#”，也就是說，在第一個(gè)“ #”后面出現(xiàn)的任何字符，都會(huì)被瀏覽器解讀為位置標(biāo)識(shí)符。這意味著，這些字符都不會(huì)被發(fā)送到服務(wù)器端，并且如果僅改變URL中“#”后的部分,瀏覽器不會(huì)重新加載網(wǎng)頁。例如,將http://www.example, com/index.html#locationl 變?yōu)?http://www.example, com/index.html#location2,瀏覽器不會(huì)重新向服務(wù)器請求index, html。但是，每一次改變“#”后的部分，都會(huì)在瀏覽器的訪問歷史中增加一個(gè)記錄，此時(shí)，如果使用“后退”按鈕，就可以回到上一個(gè)位置。具體在修改URL的hash值時(shí)，可以通過window, location, hash這個(gè)屬性來進(jìn)行修改,該屬性可讀可寫，讀取時(shí),可以用來判斷網(wǎng)頁狀態(tài)是否改變；寫入時(shí)，則會(huì)在不重載網(wǎng)頁的前提下，創(chuàng)造一條訪問歷史記錄。因此，在本申請實(shí)施例中，就可以用不同的hash值，來表示出不同的訪問狀態(tài)。
[0033]哈希值改變事件可以是HTML5中定義的事件，如onhashchange事件，當(dāng)#值發(fā)生變化時(shí)，就會(huì)觸發(fā)這個(gè)事件。例如，瀏覽器原生提供哈希值改變的監(jiān)控，比如，在鏈接http://domain#a/b, “#a/b”即為URL中的hash值，當(dāng)hash發(fā)生變化時(shí)，瀏覽器不會(huì)重新加載頁面，而是分發(fā)哈希值改變事件給window(當(dāng)前文檔窗口)，并且提供句柄(handler)給開發(fā)者做相應(yīng)的處理。
[0034]可見，在需要進(jìn)行頁面切換時(shí)，就可以首先修改頁面URL的哈希值，來觸發(fā)瀏覽器的哈希值改變事件，同時(shí)可以在瀏覽器的訪問歷史中添加一條記錄。但是，需要注意的是，在修改了 URL的hash值之后，瀏覽器并不會(huì)重新加載界面，并且該修改后的hash值是由本申請實(shí)施例中的JS修改后的，并非原頁面中定義的錨點(diǎn)等，進(jìn)而也無法直接實(shí)現(xiàn)頁面的切換。因此，在觸發(fā)了哈希值改變事件之后，還需要本申請中的JS腳本來進(jìn)行具體的頁面切換操作。
[0035]具體的，由于在觸發(fā)了瀏覽器的哈希值改變事件之后，瀏覽器會(huì)提供相應(yīng)的回調(diào)函數(shù)(也即句柄)，我們的JS腳本就可以從回調(diào)函數(shù)中獲取到目標(biāo)頁面對應(yīng)的哈希值。因此，在具體實(shí)現(xiàn)時(shí)，在設(shè)置hash值時(shí),各個(gè)頁面的hash值中就可以包含各個(gè)頁面的資源地址(或稱文件路徑)，這樣，就可以從瀏覽器提供的回調(diào)函數(shù)中獲取到目標(biāo)頁面的hash值，進(jìn)而從中提取出目標(biāo)頁面的資源地址，然后，JS腳本就可以根據(jù)該資源地址向目標(biāo)頁面的Web服務(wù)器發(fā)起資源請求，在獲取到資源之后，就可以將其展現(xiàn)在當(dāng)前窗口中，從而實(shí)現(xiàn)頁面的切換。
[0036]也就是說，在本申請實(shí)施例中，每次進(jìn)行AJAX請求時(shí)，都可以為請求的目標(biāo)頁面設(shè)置hash值，該hash值中保存的信息就可以包括各個(gè)目標(biāo)頁面的資源地址，這樣，在瀏覽器將各個(gè)頁面的帶有hash值的URL保存到訪問歷史記錄中之后，就相當(dāng)于在訪問歷史記錄中保存了各個(gè)頁面的資源地址，這樣在進(jìn)行頁面的前進(jìn)后退操作時(shí)，就可以根據(jù)各自的資源地址重新發(fā)起異步加載。
[0037]可見，在本申請實(shí)施例中，在每次進(jìn)行頁面切換時(shí)，都可以通過修改URL的hash值，來觸發(fā)瀏覽器的哈希值改變事件，其中，hash值中需要保存有目標(biāo)頁面的資源地址，也即，使用目標(biāo)頁面的資源地址來修改URL的hash值，因此，在修改URL的hash值之前，需要首先獲取目標(biāo)頁面的資源地址。關(guān)于如何獲取到目標(biāo)頁面的資源地址，通過具體的情況的不同會(huì)略有不同。例如，當(dāng)用戶在一個(gè)當(dāng)前頁面中點(diǎn)擊超鏈接的時(shí)候，如果該超鏈接被定義為需要按照異步加載的方式加載對應(yīng)的目標(biāo)頁面，則會(huì)引發(fā)從當(dāng)前頁面到目標(biāo)頁面的切換。此時(shí)，就可以按照本申請實(shí)施例提供的方式，首先獲取到目標(biāo)頁面的資源地址，然后用其修改當(dāng)前頁面的URL中的hash值，以此觸發(fā)瀏覽器的哈希值改變事件，并從瀏覽器提供的回調(diào)函數(shù)中提取目標(biāo)頁面的資源地址，然后再根據(jù)該資源地址向?qū)?yīng)的Web服務(wù)器發(fā)起異步加載請求，在獲取到資源內(nèi)容之后，進(jìn)行頁面的切換顯示，顯示出該超鏈接對應(yīng)的目標(biāo)頁面。
[0038]其中，對于超鏈接對應(yīng)的目標(biāo)頁面的資源地址，可以是由開發(fā)者提供的，由于超鏈接是在當(dāng)前頁面中，因此，在當(dāng)前頁面的HTML代碼中會(huì)包含有對該超鏈接的定義，其中會(huì)指明超鏈接對應(yīng)的目標(biāo)頁面的資源地址，因此，就可以從HTML代碼中去獲取目標(biāo)頁面的資源地址。當(dāng)然，對于本申請實(shí)施例而言，這種超鏈接并不是普通的超鏈接，所謂的普通的超鏈接就是指當(dāng)被點(diǎn)擊之后由瀏覽器對頁面進(jìn)行重新加載，而本申請實(shí)施例中，超鏈接被點(diǎn)擊之后，是需要采用異步記載的方式進(jìn)行加載，因此，需要開發(fā)者在編寫HTML代碼時(shí)，對超鏈接進(jìn)行特殊的定義。但對于開發(fā)者而言，不必關(guān)注具體的hash匹配機(jī)制(是由本申請實(shí)施例提供的JS內(nèi)部實(shí)現(xiàn)的)，只需要在普通超鏈接上添加本申請約定的自定義屬性，即可完成所有視圖切換工作，比如:
[0039]-dataRole:1nline//是否通過內(nèi)聯(lián)的方式加載頁面
[0040]-href:filepath// 目標(biāo)頁面地址
[0041]-checked:true//點(diǎn)擊超鏈接時(shí)是否通過頁面邏輯驗(yàn)證，比如，數(shù)據(jù)檢測等。開發(fā)者也可以自行在該頁面中對點(diǎn)擊事件進(jìn)行監(jiān)聽，同時(shí)設(shè)置此屬性值，最終程序會(huì)根據(jù)此屬性值來決定是否跳轉(zhuǎn)
[0042]其中，dataRole以及checked屬性都可以是本申請實(shí)施例中的約定屬性，dataRole屬性用于表示是否需要用異步加載的方式加載目標(biāo)頁面，checked屬性用于表示在跳轉(zhuǎn)到目標(biāo)頁面之前是否需要進(jìn)行邏輯驗(yàn)證(例如，驗(yàn)證是否登錄等等)。也就是說，對于普通的超鏈接而言，一般只需要定義href屬性，其屬性值為目標(biāo)頁面的資源地址，但在本申請實(shí)施例中，還可以同時(shí)定義dataRole屬性,另外,如果需要,還可以定義checked屬性。在這樣定義了超鏈接屬性之后，在用戶點(diǎn)擊超鏈接時(shí)，本申請實(shí)施例的JS就可以從當(dāng)前頁面的HTML代碼中獲取到該超鏈接的屬性值，然后就可以確定出是需要按照異步加載的方式加載該超鏈接對應(yīng)的目標(biāo)頁面，接下來就可以按照本申請實(shí)施例所述的流程執(zhí)行后續(xù)的操作。首先，根據(jù)從HTML代碼中獲取到的超鏈接屬性值，獲取到超鏈接對應(yīng)的目標(biāo)頁面的資源地址，然后用該資源地址修改當(dāng)前URL中的hash值，觸發(fā)瀏覽器的哈希值改變事件7等等。
[0043]需要說明的是，對于一個(gè)網(wǎng)頁中包含的采用異步加載方式進(jìn)行加載的超鏈接，在從當(dāng)前網(wǎng)頁向超鏈接對應(yīng)的目標(biāo)網(wǎng)頁進(jìn)行視圖切換時(shí)，開發(fā)者還可以定義切換時(shí)的動(dòng)畫效果，例如，可以定義頁面的推送方向，包括從左向右進(jìn)入，或者從右向左進(jìn)入等等。在本申請實(shí)施例中，開發(fā)者也可以一并在超鏈接的屬性中進(jìn)行定義，例如，在前述例子基礎(chǔ)上還可以為超鏈接增加以下屬性:
[0044]-animDir:forward 頁面推送方向(forward、back)
[0045]本申請實(shí)施例中，JS腳本在獲取當(dāng)前超鏈接的屬性值時(shí)，也可以獲取到該屬性，用于表示采用怎樣的動(dòng)畫效果來顯示目標(biāo)頁面，進(jìn)而，在獲取到該目標(biāo)頁面的資源內(nèi)容之后，就可以采用相應(yīng)的動(dòng)畫效果實(shí)現(xiàn)目標(biāo)頁面的展現(xiàn)。例如，如果當(dāng)前超鏈接的animDir屬性是forward，則將獲取到目標(biāo)頁面的資源內(nèi)容插入到當(dāng)前視圖節(jié)點(diǎn)之前，否則，如果當(dāng)前超鏈接的animDir屬性是back，則將獲取到目標(biāo)頁面的資源內(nèi)容插入到當(dāng)前視圖節(jié)點(diǎn)之后，然后就可以利用CSS3(CSS的版本三，能夠?qū)崿F(xiàn)一些動(dòng)畫類的特效)來實(shí)現(xiàn)相應(yīng)的動(dòng)畫效果，并展現(xiàn)出對應(yīng)的目標(biāo)頁面。[0046]以上介紹的方式中，開發(fā)者需要為超鏈接定義多個(gè)屬性值，在實(shí)際應(yīng)用中，還可以采用比較簡單的方式來進(jìn)行定義，例如:
[0047]<a href = " #b/forward;/ class = " rightbar " >下一步 </a>
[0048]也即，由于普通的超鏈接在定義時(shí)直接定義為“href = b”即可，因此，可以通過在定義中加入“#”，來表示需要以本申請實(shí)施例中提供的異步加載方式進(jìn)行視圖的切換。同時(shí)，也可以將動(dòng)畫效果信息直接在href屬性中進(jìn)行定義。當(dāng)然，上述定義的格式并不是唯一的，也可以按照直接的需要設(shè)定其他格式，開發(fā)者按照設(shè)定好的格式進(jìn)行超鏈接的定義即可。
[0049]另一種涉及到頁面視圖切換的情況一般是發(fā)生在需要后退或者前進(jìn)到某目標(biāo)頁面時(shí)，當(dāng)然，由于是后退或者前進(jìn)到該目標(biāo)頁面，就意味著在此之前已經(jīng)按照本申請實(shí)施例提供的異步加載的方式顯示過該目標(biāo)頁面，該目標(biāo)頁面對應(yīng)的hash值已經(jīng)在瀏覽器的訪問歷史中進(jìn)行了記錄，因此，就可以從訪問歷史記錄中找到該目標(biāo)頁面的hash值，然后從中提取出目標(biāo)頁面的資源地址，用該資源地址來修改當(dāng)前URL的hash值。
[0050]例如，假設(shè)需要后退到目標(biāo)頁面，并假設(shè)當(dāng)前窗口之前顯示的上一個(gè)頁面(也就是需要后退到的目標(biāo)頁面)的hash值為last_hash，該hash值會(huì)在瀏覽器的訪問歷史中記錄；當(dāng)前窗口當(dāng)前顯示的頁面的hash值為current_hash ;則在發(fā)出后退操作請求之后，可以首先從瀏覽器的訪問歷史中獲取到上一個(gè)頁面的hash值last_hash，比較前兩者得知hash發(fā)生了變化，因此,首先將URL中的current_hash修改為last_hash,以此觸發(fā)哈希值改變回調(diào)，然后從回調(diào)函數(shù)中獲取到last_hash，從中可以提取出上一個(gè)頁面的資源地址，然后就可以根據(jù)該資源地址向?qū)?yīng)的Web服務(wù)器發(fā)起異步加載請求，在獲取到資源內(nèi)容之后，進(jìn)行頁面的切換顯示，實(shí)現(xiàn)將頁面后退到上一個(gè)頁面。
[0051]通過以上所述可見，在頁面視圖切換的過程中，最初的切換一般是由用戶在某當(dāng)前頁面中點(diǎn)擊了某超鏈接來觸發(fā)的，該超鏈接是開發(fā)者按照本申請實(shí)施例提供的方式定義的，將定義好的屬性寫在當(dāng)前頁面的HTML代碼中，并在當(dāng)前頁面中插入本申請實(shí)施例提供的JS代碼；因此，當(dāng)該超鏈接被點(diǎn)擊之后，JS代碼就可以按照本申請實(shí)施例提供的方法流程，進(jìn)行URL中hash值的修改，并將目標(biāo)頁面的資源地址寫入到hash值中，觸發(fā)瀏覽器的哈希值改變事件，并從瀏覽器提供的回調(diào)函數(shù)中獲取到目標(biāo)頁面的資源地址，然后按照異步加載模式加載頁面，等等，從而保存各個(gè)目標(biāo)頁面與hash值之間的對應(yīng)關(guān)系。之后，如果用戶點(diǎn)擊頁面的后退操作，則可以根據(jù)記錄的hash值情況，找到上一個(gè)頁面對應(yīng)的hash值，仍然首先修改當(dāng)前URL的hash值，觸發(fā)瀏覽器的哈希值改變事件，并從瀏覽器提供的回調(diào)函數(shù)中獲取到目標(biāo)頁面的資源地址，再發(fā)起異步加載請求，以此類推。也就是說，無論是在頁面中點(diǎn)擊超鏈接，還是執(zhí)行頁面的前進(jìn)或后退操作，都可以首先由JS腳本來修改URL的hash值，來觸發(fā)瀏覽器的哈希值改變事件，之后再進(jìn)行異步加載操作，以此記錄下每次訪問的頁面的訪問歷史軌跡，使得每次頁面前進(jìn)或者后退操作都能準(zhǔn)確到達(dá)下一個(gè)或上一個(gè)頁面。
[0052]例如，頁面A中被插入了本申請實(shí)施例中的JS腳本，并按照本申請實(shí)施例的方式定義了某超鏈接，用戶在頁面A中點(diǎn)擊了該超鏈接之后，JS腳本就可以取出該超鏈接的屬性值，從中獲取到該超鏈接對應(yīng)的目標(biāo)頁面B的資源地址，然后用該地址來修改頁面A對應(yīng)的URL中的hash值，例如，由hashA修改為hashB，由此觸發(fā)瀏覽器的哈希值改變事件，此時(shí)，在瀏覽器的訪問歷史中進(jìn)行記錄，即記錄下頁面B與hashB之間的對應(yīng)關(guān)系，之后JS對頁面B進(jìn)行異步加載。在顯示出頁面B之后，當(dāng)前網(wǎng)頁的地址應(yīng)該是用一個(gè)包含有hashB的URL來表示的；此時(shí)，如果用戶點(diǎn)擊后退按鈕，則JS首先查詢?yōu)g覽器的訪問歷史記錄，發(fā)現(xiàn)上一個(gè)地址是一個(gè)包含有hashA的URL，于是就可以從該hash中提取出頁面A的資源地址，然后JS腳本首先將hashB修改為hashA，以此再觸發(fā)瀏覽器的哈希值改變事件，此時(shí)，在瀏覽器的訪問歷史中進(jìn)行記錄，然后JS再根據(jù)瀏覽器提供回調(diào)函數(shù)取出頁面A的資源地址，再發(fā)起異步加載請求，顯示出頁面A?？梢?，雖然從頁面A切換到頁面B的過程是采用異步加載的方式實(shí)現(xiàn)的，但是在顯示出頁面B之后，仍然能夠成功的后退到頁面A。
[0053]這里需要說明的是，在上述例子中，頁面A可能是某網(wǎng)站的首頁，該頁面可能是由瀏覽器正常的加載方式進(jìn)行加載的，此時(shí)，在以異步加載的方式顯示出頁面B之后，如果用戶執(zhí)行后退操作，則JS會(huì)發(fā)現(xiàn)訪問歷史記錄中的上一個(gè)地址是一個(gè)hash值為空的URL，此時(shí)，為了能夠正常運(yùn)行，可以將頁面A的URL進(jìn)行記錄，作為加載頁面A時(shí)所需的默認(rèn)的資源地址，因此，當(dāng)后退時(shí)，如果發(fā)現(xiàn)上一個(gè)頁面的URL的hash值為空，就可以按照該默認(rèn)的資源地址，對頁面A進(jìn)行加載及顯示。
[0054]其中，在根據(jù)目標(biāo)頁面的資源地址為目標(biāo)頁面設(shè)置hash值時(shí)，可以按照預(yù)先設(shè)定的目錄層級進(jìn)行設(shè)置，這樣，JS在根據(jù)目標(biāo)頁面的hash值加載目標(biāo)頁面時(shí)，就可以匹配hash的目錄層級,設(shè)計(jì)每級目錄對應(yīng)的處理方式和響應(yīng)，比如hash值“#a/ ? 1tType =c”，可以進(jìn)行如下設(shè)計(jì)和約定:
[0055]a:待加載目標(biāo)頁面(html模板)的URL路徑，也即資源地址；
[0056]? 1tType = c:頁面其他參數(shù)處理,用于滿足單個(gè)html模板對應(yīng)多個(gè)應(yīng)用邏輯的場景
[0057]當(dāng)然，也可以不存在？ 1tType，也就是說，當(dāng)JS從瀏覽器提供的回調(diào)函數(shù)中提取到hash值之后，就可以按照上述規(guī)則來提取目標(biāo)頁面的資源地址，向Web服務(wù)器請求資源內(nèi)容，然后進(jìn)行內(nèi)容的展現(xiàn)即可。
[0058]此處需要說明的是，如前文所述，開發(fā)者還可為超鏈接定義了動(dòng)畫效果信息(包括向前或者向后的頁面推送方向等信息)，為了能夠在后續(xù)的頁面前進(jìn)或者后退時(shí)可能實(shí)現(xiàn)該動(dòng)畫效果，還可以在加載超鏈接對應(yīng)的目標(biāo)頁面的過程中，對動(dòng)畫效果信息進(jìn)行保存。
[0059]具體實(shí)現(xiàn)時(shí)，一種實(shí)現(xiàn)方式是，可以直接將動(dòng)畫效果信息也作為目標(biāo)頁面對應(yīng)的hash值的一部分，寫入到URL中，也就是說，在為某目標(biāo)頁面修改hash值時(shí)，除了將該目標(biāo)頁面的資源地址寫入到該hash值中，還可以將該目標(biāo)頁面在展現(xiàn)是所需的動(dòng)畫效果信息也寫入到hash值中。例如，假設(shè)目標(biāo)頁面的資源地址是a，動(dòng)畫效果信息是b，頁面其他參數(shù)處理參數(shù)為C，則該目標(biāo)頁面對應(yīng)的hash值可以為:“#a/b/ ? 1tType = C”，這相當(dāng)于在前述例子基礎(chǔ)上為ha sh增加了一個(gè)目錄層級。JS在從瀏覽器的回調(diào)函數(shù)中獲取到該hash值之后，也可以按照對應(yīng)的層級目錄的定義，解析hash值中包含的信息，獲取到目標(biāo)頁面的資源地址、動(dòng)畫效果信息、其他參數(shù)，等等。
[0060]或者，另一種具體的實(shí)現(xiàn)方式可以是，仍然僅將目標(biāo)頁面的資源地址寫入到hash值中，但是目標(biāo)頁面的動(dòng)畫效果信息可以由JS腳本另外進(jìn)行單獨(dú)保存。例如，可以生成一個(gè)變量，將各個(gè)目標(biāo)頁面的動(dòng)畫效果信息寫入該變量中。該變量可以是由多個(gè)狀態(tài)值組成的一個(gè)序列，每個(gè)狀態(tài)值就對應(yīng)著被訪問的一個(gè)頁面的動(dòng)畫效果信息，該序列中生成狀態(tài)值時(shí)可以是與瀏覽器的訪問歷史中添加新的記錄是同步的，也即，每次切換一個(gè)頁面視圖，都將切換后的頁面對應(yīng)的hash值寫入到訪問歷史記錄中，同時(shí)也將該切換后的頁面對應(yīng)的動(dòng)畫效果信息作為一個(gè)狀態(tài)值寫入到該變量中。這樣，當(dāng)需要后退或者前進(jìn)到某頁面時(shí)，就可以從瀏覽器的訪問歷史記錄中獲取上一個(gè)或者下一個(gè)頁面的hash值，從中獲取到上一個(gè)或者下一個(gè)頁面的資源地址，并且，從JS腳本記錄的該變量的狀態(tài)值中取出該上一個(gè)或下一個(gè)頁面的動(dòng)畫效果信息，然后按照資源地址下載資源內(nèi)容，再按照該動(dòng)畫效果展現(xiàn)出對應(yīng)的資源內(nèi)容即可。
[0061]當(dāng)然，在實(shí)際應(yīng)用中，JS在一個(gè)變量中記錄各個(gè)頁面的動(dòng)畫效果信息的同時(shí)，也可以連同各個(gè)頁面的資源地址一起進(jìn)行記錄，在將動(dòng)畫效果信息也寫入到hash值的情況下，就相當(dāng)于在一個(gè)變量中保存各個(gè)頁面的hash值。這樣，在進(jìn)行頁面前進(jìn)或者后退的過程中，就可以不必再依賴瀏覽器記錄的訪問歷史，直接根據(jù)該變量在各個(gè)狀態(tài)下的取值，就可以獲取到上一個(gè)或者下一個(gè)頁面的資源地址以及動(dòng)畫效果信息。
[0062]綜上所述，本申請實(shí)施例提供了一種頁面頁面方法，參見圖2，該方法可以包括以下步驟:
[0063]S201:監(jiān)控將當(dāng)前頁面切換到目標(biāo)頁面的操作請求，并獲取所述目標(biāo)頁面的資源地址；
[0064]如前文所述，頁面切換請求可能是通過用戶點(diǎn)擊當(dāng)前頁面中的超鏈接發(fā)起的，也可能是通過用戶點(diǎn)擊前進(jìn)、后退等操作按鈕發(fā)起的。其中，關(guān)于前者，可以從當(dāng)前頁面的HTML代碼中獲取超鏈接的屬性值，從中獲取目標(biāo)頁面的資源地址，當(dāng)然還可以同時(shí)獲取到目標(biāo)頁面在展現(xiàn)時(shí)所需的動(dòng)畫效果信息。關(guān)于后者，可以從瀏覽器的訪問歷史記錄或者本申請實(shí)施例中的JS腳本記錄的自定義歷史記錄中記錄的上一個(gè)或者下一個(gè)地址中獲取，具體可以從地址中取出hash值，然后從中解析出目標(biāo)頁面的資源地址，如果hash值中包括有目標(biāo)頁面展現(xiàn)時(shí)的動(dòng)畫效果信息，還可以從中解析出動(dòng)畫效果信息。
[0065]S202:通過對當(dāng)前頁面的統(tǒng)一資源定位符URL的哈希值進(jìn)行修改，觸發(fā)瀏覽器的哈希值改變事件，以便瀏覽器提供窗口句柄；其中，修改后的哈希值中包含有所述目標(biāo)頁面的資源地址信息；
[0066]在獲取到目標(biāo)頁面的資源地址之后，就可以用其來修改URL的hash值，當(dāng)然，如果當(dāng)前頁面的URL中的hash值不為空,可將原h(huán)ash值刪除,然后將為該目標(biāo)頁面生成的hash值寫入到URL中，如果當(dāng)前頁面的hash值為空，則直接在當(dāng)前頁面的URL最后添加為該目標(biāo)頁面生成的hash值。這樣，由于URL中的hash值發(fā)生了變化，因此就可以觸發(fā)瀏覽器的哈希值改變事件，并且瀏覽器會(huì)提供相應(yīng)的回調(diào)函數(shù)，也即窗口句柄，該回調(diào)函數(shù)中就會(huì)包括有目標(biāo)頁面對應(yīng)的hash值。同時(shí)，瀏覽器會(huì)自動(dòng)的原生的訪問歷史中增加一條記錄，記錄下此次hash值的變化情況，當(dāng)然瀏覽器并不會(huì)對頁面重新加載。
[0067]S203:從所述窗口句柄中提取所述目標(biāo)頁面的資源地址，并根據(jù)所述目標(biāo)頁面的資源地址向?qū)?yīng)的Web服務(wù)器發(fā)起異步加載請求；
[0068]雖然瀏覽器不會(huì)重新加載頁面，但是，本申請實(shí)施例中的JS腳本會(huì)從窗口句柄中提取出目標(biāo)頁面的資源地址，并向?qū)?yīng)的服務(wù)器發(fā)起異步加載請求。
[0069]S204:根據(jù)所述Web服務(wù)器返回的資源數(shù)據(jù)，在所述當(dāng)前頁面所在窗口中展現(xiàn)所述目標(biāo)頁面。[0070]在服務(wù)器返回了資源數(shù)據(jù)之后，就可以通過JS腳本進(jìn)行頁面的切換，在切換后的頁面中顯示出目標(biāo)頁面的內(nèi)容。其中，如果還獲取到了目標(biāo)頁面的動(dòng)畫效果信息，還可以利用CSS3執(zhí)行相關(guān)的動(dòng)畫，完成目標(biāo)頁面的顯示。
[0071]以上過程可以通過圖3更簡化地進(jìn)行表示(該圖中假設(shè)存在動(dòng)畫效果信息，該動(dòng)畫效果信息主要是指切換時(shí)，視圖進(jìn)入的方向，簡稱切換方向):
[0072]S301:初始化,通過修改hash觸發(fā)瀏覽器的哈希值改變事件，hash中包含有目標(biāo)頁面的資源地址，也即模板文件的路徑，還可以包括目標(biāo)頁面的切換方向；
[0073]S302:瀏覽器進(jìn)行hash匹配,在訪問歷史中插入一條記錄，記錄下hash值的變化；
[0074]S303:瀏覽器提供窗口句柄，其中包含有目標(biāo)頁面對應(yīng)的hash值；
[0075]S304:本申請實(shí)施例中的JS從窗口句柄中獲取目標(biāo)頁面的模板文件路徑以及切換方向；
[0076]S305:根據(jù)模板文件路徑AJAX請求模板文件，然后將獲取到的模板文件插入到DOM (Document Object Model,文檔對象模型)中，在此之前,需要根據(jù)切換方向進(jìn)行判斷，如果是向前(forward),貝U進(jìn)入步驟S306,如果是向后(back),則進(jìn)入步驟S307:
[0077]S306:插入到當(dāng)前視圖節(jié)點(diǎn)之前；
[0078]S207:插入到當(dāng)前視圖節(jié)點(diǎn)之后；
[0079]S308:使用CSS3根據(jù)DOM的節(jié)點(diǎn)結(jié)構(gòu)執(zhí)行動(dòng)畫，切換到目標(biāo)頁面；
[0080]S309:動(dòng)畫執(zhí)行完畢之后，為了避免占用過多的存儲(chǔ)空間，可以刪除當(dāng)前節(jié)點(diǎn)的視圖。
[0081]為了更好的理解本申請實(shí)施例，下面通過一個(gè)實(shí)際應(yīng)用中的例子，對本申請實(shí)施例的流程進(jìn)行詳細(xì)地介紹。參見圖4，具體可以包括以下步驟:
[0082]S401:監(jiān)控在第一頁面中點(diǎn)擊超鏈接的操作，獲取該超鏈接的屬性值，從屬性值中獲取超鏈接對應(yīng)的第二頁面的資源地址；
[0083]在該步驟S301中，如果開發(fā)者還對超鏈接定義了動(dòng)畫效果信息，則還可以從超鏈接的屬性值中獲取第二頁面在展現(xiàn)時(shí)的動(dòng)畫效果信息；
[0084]S402:通過對第一頁面的URL的hash值進(jìn)行修改，觸發(fā)瀏覽器的哈希值改變事件，以便瀏覽器在原生的訪問歷史中記錄哈希值的變化，并提供窗口句柄；其中，修改后的哈希值中包含有第二頁面的資源地址信息；
[0085]S403:從瀏覽器提供的窗口句柄中獲取第二頁面的資源地址，并根據(jù)第二頁面的資源地址向?qū)?yīng)的Web服務(wù)器發(fā)起異步加載請求；
[0086]S404:根據(jù)Web服務(wù)器返回的資源數(shù)據(jù)，將所述當(dāng)前窗口視圖切換到第二頁面；
[0087]在該步驟S304中，如果在S301中還獲取到了第二頁面在展現(xiàn)時(shí)的動(dòng)畫效果信息，則可以按照該動(dòng)畫效果信息，將當(dāng)前窗口視圖切換到第二頁面，至此，就實(shí)現(xiàn)了從第一頁面到第二頁面的切換。
[0088]在展現(xiàn)出所述第二頁面后，如果接收到頁面后退的請求，則可以按照以下步驟進(jìn)行:
[0089]S405:根據(jù)訪問歷史記錄,獲取第一頁面的URL的哈希值；
[0090]該第一頁面的URL的哈希值記錄有第一頁面的資源地址(同樣是在用戶點(diǎn)擊該第一頁面的超鏈接時(shí)，JS腳本為該第一頁面生成的)；當(dāng)然，訪問歷史記錄中記錄的第一頁面的URL的哈希值有可能為空，這證明第一頁面當(dāng)時(shí)是由瀏覽器采用常規(guī)的加載方式加載的，針對這種情況，JS會(huì)預(yù)先記錄該第一頁面的URL，將其作為第一頁面的默認(rèn)資源地址，因此可以將預(yù)先根據(jù)該第一頁面的URL記錄的默認(rèn)資源地址確定為第一頁面的資源地址；
[0091]S406:將當(dāng)前URL中的hash值修改為該第一頁面的URL的哈希值，觸發(fā)瀏覽器的哈希值改變事件，以便瀏覽器在原生的訪問歷史中記錄哈希值的變化，并提供窗口句柄；
[0092]S407:從瀏覽器提供的窗口句柄中獲取第一頁面的資源地址，并根據(jù)所述第一頁面的資源地址向?qū)?yīng)的Web服務(wù)器發(fā)起異步加載請求；
[0093]S408:根據(jù)該Web服務(wù)器返回的資源數(shù)據(jù)，將所述當(dāng)前窗口視圖切換到所述第一頁面。
[0094]與本申請實(shí)施例提供的頁面切換方法相對應(yīng)，本申請實(shí)施例還提供了一種頁面切換裝置，參見圖5，該裝置可以包括:
[0095]監(jiān)控單元501，用于監(jiān)控將當(dāng)前頁面切換到目標(biāo)頁面的操作請求，并獲取所述目標(biāo)頁面的資源地址；
[0096]哈希值修改單元502，用于通過對當(dāng)前頁面的統(tǒng)一資源定位符URL的哈希值進(jìn)行修改，觸發(fā)瀏覽器的哈希值改變事件，以便瀏覽器在原生的訪問歷史中記錄所述哈希值的變化，并提供窗口句柄；其中，修改后的哈希值中包含有所述目標(biāo)頁面的資源地址信息；
[0097]異步加載請求單元503，用于從所述窗口句柄中獲取所述目標(biāo)頁面的資源地址，并根據(jù)所述目標(biāo)頁面的資源地址向?qū)?yīng)的Web服務(wù)器發(fā)起異步加載請求；
[0098]展現(xiàn)單元504，用于根據(jù)所述Web服務(wù)器返回的資源數(shù)據(jù)，在所述當(dāng)前頁面所在窗口中展現(xiàn)所述目標(biāo)頁面。
[0099]具體實(shí)現(xiàn)時(shí)，所述監(jiān)控單元501包括:
[0100]第一監(jiān)控子單元，用于監(jiān)控在當(dāng)前頁面中點(diǎn)擊超鏈接的操作，獲取所述超鏈接的屬性值，從所述屬性值中獲取所述超鏈接對應(yīng)的目標(biāo)頁面的資源地址。其中，屬性值一般寫在當(dāng)前頁面的HTML代碼中，因此就可以從HTML代碼中讀取出該超鏈接的屬性值，然后從中獲取目標(biāo)頁面的資源地址。
[0101]其中，如果開發(fā)者為超鏈接定義了動(dòng)畫效果屬性，則該裝置還可以包括:
[0102]動(dòng)畫效果信息獲取單元，用于從所述屬性值中獲取所述目標(biāo)頁面在展現(xiàn)時(shí)的動(dòng)畫效果信息；
[0103]所述展現(xiàn)單元504具體可以用于:
[0104]根據(jù)所述Web服務(wù)器返回的資源數(shù)據(jù)，按照所述動(dòng)畫效果信息，在所述當(dāng)前頁面所在窗口中展現(xiàn)所述目標(biāo)頁面。
[0105]為了能夠在后續(xù)的頁面前進(jìn)或后退的過程中，也能體現(xiàn)出開發(fā)者定義的動(dòng)畫效果，該裝置還可以包括:
[0106]動(dòng)畫效果信息記錄單元，用于記錄所述目標(biāo)頁面在展現(xiàn)時(shí)的動(dòng)畫效果信息，以便在從某頁面前進(jìn)或者后退到所述目標(biāo)頁面時(shí)，根據(jù)所記錄的動(dòng)畫效果信息，對所述目標(biāo)頁面進(jìn)行展現(xiàn)。
[0107]或者，在另一種實(shí)現(xiàn)方式下，所述修改后的哈希值中還包含有所述目標(biāo)頁面在展現(xiàn)時(shí)的動(dòng)畫效果信息，以便在從某頁面前進(jìn)或者后退到所述目標(biāo)頁面時(shí)，在觸發(fā)了瀏覽器的哈希值改變事件之后，從瀏覽器提供的窗口句柄中獲取所述動(dòng)畫效果信息，并根據(jù)所述動(dòng)畫效果信息對所述目標(biāo)頁面進(jìn)行展現(xiàn)。
[0108]另外，在實(shí)際應(yīng)用中，還可以由JS腳本自定記錄各個(gè)界面的哈希值，這樣可以不必依賴瀏覽器的歷史記錄，就能實(shí)現(xiàn)頁面的前進(jìn)后退操作，因此，該裝置還可以包括:
[0109]哈希值記錄單元，用于記錄所述目標(biāo)頁面的URL的哈希值，生成自定義的瀏覽歷史記錄，以便在從某頁面前進(jìn)或者后退到所述目標(biāo)頁面時(shí)，根據(jù)所述自定義的瀏覽歷史記錄獲取所述目標(biāo)頁面的URL的哈希值，進(jìn)行頁面的前進(jìn)或者后退操作。
[0110]如果當(dāng)前頁面是初始狀態(tài)下通過瀏覽器的常規(guī)加載方式加載的，則當(dāng)前頁面的URL中是不存在哈希值的，為了能夠在后退時(shí)能夠后退到該當(dāng)前頁面，該裝置還可以包括:
[0111]URL記錄單元，用于如果當(dāng)前頁面是采用常規(guī)的瀏覽器加載的方式加載的，則記錄所述當(dāng)前頁面的URL，以便在監(jiān)控到頁面前進(jìn)或后退到所述當(dāng)前頁面的操作請求，并發(fā)現(xiàn)所述當(dāng)前頁面的URL的哈希值為空之后，根據(jù)所述記錄的URL加載所述當(dāng)前頁面。
[0112]另一方面，所述監(jiān)控單元501可以包括:
[0113]第二監(jiān)控子單元，用于監(jiān)控從某頁面前進(jìn)或后退到目標(biāo)頁面的操作請求，根據(jù)瀏覽歷史記錄獲取所述目標(biāo)頁面的URL的哈希值，并根據(jù)該URL的哈希值獲取目標(biāo)頁面的資源地址。
[0114]其中，所述第二監(jiān)控子單元具體可以用于:
[0115]根據(jù)瀏覽器原生的瀏覽歷史記錄獲取所述目標(biāo)頁面的URL，并從該URL中獲取哈希值。
[0116]在另一種實(shí)現(xiàn)方式下，該裝置還可以包括:
[0117]第一自定義瀏覽歷史記錄生成單元，用于根據(jù)用戶的訪問先后順序記錄各個(gè)被訪問頁面在展現(xiàn)時(shí)的動(dòng)畫效果信息，生成自定義的瀏覽歷史記錄；
[0118]所述展現(xiàn)單元503具體用于從所述自定義的瀏覽歷史記錄獲取所述目標(biāo)頁面在展現(xiàn)時(shí)的動(dòng)畫效果信息；根據(jù)所述Web服務(wù)器返回的資源數(shù)據(jù)，按照所述動(dòng)畫效果信息，在所述當(dāng)前頁面所在窗口中展現(xiàn)所述目標(biāo)頁面。
[0119]另外，該裝置還可以包括:
[0120]第二自定義瀏覽歷史記錄生成單元，用于根據(jù)用戶的訪問先后順序記錄各個(gè)被訪問頁面的URL的哈希值，生成自定義的瀏覽歷史記錄；
[0121]所述第二監(jiān)控子單元具體用于:
[0122]根據(jù)所述自定義的瀏覽歷史記錄獲取所述目標(biāo)頁面的URL的哈希值。
[0123]所述目標(biāo)頁面的URL的哈希值中還包含有所述目標(biāo)頁面在展現(xiàn)時(shí)的動(dòng)畫效果信息，所述展現(xiàn)單元504具體用于:
[0124]根據(jù)所述Web服務(wù)器返回的資源數(shù)據(jù)，按照所述動(dòng)畫效果信息，在所述當(dāng)前頁面所在窗口中展現(xiàn)所述目標(biāo)頁面。
[0125]總之，在本申請實(shí)施例提供的頁面切換裝置中，可以監(jiān)控到從當(dāng)前頁面向目標(biāo)頁面切換的操作請求之后，可以在獲取到目標(biāo)頁面的資源地址之后，通過對URL中的哈希值進(jìn)行修改，來觸發(fā)瀏覽器的哈希值改變事件，瀏覽器就會(huì)自動(dòng)在原生的訪問歷史中增加一條關(guān)于hash變化的記錄，并且提供窗口句柄，這樣我們的JS就可以從窗口句柄中獲取到目標(biāo)頁面的資源地址，然后采用異步加載的方式請求目標(biāo)頁面的資源內(nèi)容，然后在窗口中進(jìn)行展現(xiàn)。由于在瀏覽器的訪問歷史中增加了關(guān)于hash變化的記錄，相當(dāng)于記錄了各個(gè)頁面與hash之間的對應(yīng)關(guān)系，因此，在執(zhí)行頁面的前進(jìn)或者后退操作時(shí)，就可以根據(jù)這種對應(yīng)關(guān)系，前進(jìn)或者后退到正確的頁面。
[0126]通過以上的實(shí)施方式的描述可知，本領(lǐng)域的技術(shù)人員可以清楚地了解到本申請可借助軟件加必需的通用硬件平臺(tái)的方式來實(shí)現(xiàn)?；谶@樣的理解，本申請的技術(shù)方案本質(zhì)上或者說對現(xiàn)有技術(shù)做出貢獻(xiàn)的部分可以以軟件產(chǎn)品的形式體現(xiàn)出來，該計(jì)算機(jī)軟件產(chǎn)品可以存儲(chǔ)在存儲(chǔ)介質(zhì)中，如R0M/RAM、磁碟、光盤等，包括若干指令用以使得一臺(tái)計(jì)算機(jī)設(shè)備(可以是個(gè)人計(jì)算機(jī)，服務(wù)器，或者網(wǎng)絡(luò)設(shè)備等)執(zhí)行本申請各個(gè)實(shí)施例或者實(shí)施例的某些部分所述的方法。
[0127]本說明書中的各個(gè)實(shí)施例均采用遞進(jìn)的方式描述，各個(gè)實(shí)施例之間相同相似的部分互相參見即可，每個(gè)實(shí)施例重點(diǎn)說明的都是與其他實(shí)施例的不同之處。尤其，對于系統(tǒng)或系統(tǒng)實(shí)施例而言，由于其基本相似于方法實(shí)施例，所以描述得比較簡單，相關(guān)之處參見方法實(shí)施例的部分說明即可。以上所描述的系統(tǒng)及系統(tǒng)實(shí)施例僅僅是示意性的，其中所述作為分離部件說明的單元可以是或者也可以不是物理上分開的，作為單元顯示的部件可以是或者也可以不是物理單元，即可以位于一個(gè)地方，或者也可以分布到多個(gè)網(wǎng)絡(luò)單元上?？梢愿鶕?jù)實(shí)際的需要選擇其中的部分或者全部模塊來實(shí)現(xiàn)本實(shí)施例方案的目的。本領(lǐng)域普通技術(shù)人員在不付出創(chuàng)造性勞動(dòng)的情況下，即可以理解并實(shí)施。
[0128]以上對本申請所提供的頁面切換方法及裝置，進(jìn)行了詳細(xì)介紹，本文中應(yīng)用了具體個(gè)例對本申請的原理及實(shí)施方式進(jìn)行了闡述，以上實(shí)施例的說明只是用于幫助理解本申請的方法及其核心思想；同時(shí)，對于本領(lǐng)域的一般技術(shù)人員，依據(jù)本申請的思想，在【具體實(shí)施方式】及應(yīng)用范圍上均會(huì)有改變之處。綜上所述，本說明書內(nèi)容不應(yīng)理解為對本申請的限制。
【權(quán)利要求】
1.一種頁面切換方法，其特征在于，包括: 監(jiān)控將當(dāng)前頁面切換到目標(biāo)頁面的操作請求，并獲取所述目標(biāo)頁面的資源地址； 通過對當(dāng)前頁面的統(tǒng)一資源定位符URL的哈希值進(jìn)行修改，觸發(fā)瀏覽器哈希值改變事件，以便瀏覽器在訪問歷史中記錄所述哈希值的變化，并提供窗口句柄；其中，修改后的哈希值中包含有所述目標(biāo)頁面的資源地址信息； 從所述窗口句柄中獲取所述目標(biāo)頁面的資源地址，并根據(jù)所述目標(biāo)頁面的資源地址，向?qū)?yīng)的Web服務(wù)器發(fā)起異步加載請求； 根據(jù)所述Web服務(wù)器返回的資源數(shù)據(jù)，在所述當(dāng)前頁面所在窗口中展現(xiàn)所述目標(biāo)頁面。
2.根據(jù)權(quán)利要求1所述的方法，其特征在于，所述監(jiān)控將當(dāng)前頁面切換到目標(biāo)頁面的操作請求，并獲取所述目標(biāo)頁面的資源地址包括: 監(jiān)控在當(dāng)前頁面中點(diǎn)擊超鏈接的操作，獲取所述超鏈接的屬性值，從所述屬性值中獲取所述超鏈接對應(yīng)的目標(biāo)頁面的資源地址。
3.根據(jù)權(quán)利要求2所述的方法，其特征在于，還包括: 從所述屬性值中獲取所述目標(biāo)頁面在展現(xiàn)時(shí)的動(dòng)畫效果信息； 所述根據(jù)所述Web服務(wù)器返回的資源數(shù)據(jù)，在所述當(dāng)前頁面所在窗口中展現(xiàn)所述目標(biāo)頁面包括: 根據(jù)所述Web服務(wù)器返回的資源數(shù)據(jù)，按照所述動(dòng)畫效果信息，在所述當(dāng)前頁面所在窗口中展現(xiàn)所述超鏈接對應(yīng)的目標(biāo)頁面。
4.根據(jù)權(quán)利要求3所述的方法，其特征在于，還包括: 記錄所述目標(biāo)頁面在展現(xiàn)時(shí)的動(dòng)畫效果信息，以用于在從某頁面前進(jìn)或者后退到所述目標(biāo)頁面時(shí)，根據(jù)所記錄的動(dòng)畫效果信息，對所述目標(biāo)頁面進(jìn)行展現(xiàn)。
5.根據(jù)權(quán)利要求3所述的方法，其特征在于，所述修改后的哈希值中還包含有所述目標(biāo)頁面在展現(xiàn)時(shí)的動(dòng)畫效果信息，以便在從某頁面前進(jìn)或者后退到所述目標(biāo)頁面時(shí)，在觸發(fā)了瀏覽器的哈希值改變事件之后，從瀏覽器提供的窗口句柄中獲取所述動(dòng)畫效果信息，并根據(jù)所述動(dòng)畫效果信息對所述目標(biāo)頁面進(jìn)行展現(xiàn)。
6.根據(jù)權(quán)利要求2所述的方法，其特征在于，還包括: 記錄所述目標(biāo)頁面的URL的哈希值，生成自定義的瀏覽歷史記錄，以便在從某頁面前進(jìn)或者后退到所述目標(biāo)頁面時(shí)，根據(jù)所述自定義的瀏覽歷史記錄獲取所述目標(biāo)頁面的URL的哈希值，進(jìn)行頁面的前進(jìn)或者后退操作。
7.根據(jù)權(quán)利要求2所述的方法，其特征在于，還包括: 如果當(dāng)前頁面是采用瀏覽器加載的方式加載的，則記錄所述當(dāng)前頁面的URL，以便在監(jiān)控到頁面前進(jìn)或后退到所述當(dāng)前頁面的操作請求，并發(fā)現(xiàn)所述當(dāng)前頁面的URL的哈希值為空之后，根據(jù)所述記錄的URL加載所述當(dāng)前頁面。
8.根據(jù)權(quán)利要求1所述的方法，其特征在于，所述監(jiān)控將當(dāng)前頁面切換到目標(biāo)頁面的操作請求，并獲取所述目標(biāo)頁面的資源地址，包括: 監(jiān)控從某頁面前進(jìn)或后退到目標(biāo)頁面的操作請求；根據(jù)瀏覽歷史記錄，獲取所述目標(biāo)頁面的URL的哈希值；并根據(jù)該URL的哈希值，獲取目標(biāo)頁面的資源地址。
9.根據(jù)權(quán)利要求8所述的方法，其特征在于，所述根據(jù)瀏覽歷史記錄獲取所述目標(biāo)頁面的URL的哈希值包括: 根據(jù)瀏覽器的瀏覽歷史記錄，獲取所述目標(biāo)頁面的URL，并從該URL中獲取哈希值。
10.根據(jù)權(quán)利要求9所述的方法，其特征在于，還包括: 根據(jù)訪問先后順序，記錄各個(gè)被訪問頁面在展現(xiàn)時(shí)的動(dòng)畫效果信息，生成自定義的瀏覽歷史記錄； 所述Web服務(wù)器返回的資源數(shù)據(jù)，在所述當(dāng)前頁面所在窗口中展現(xiàn)所述目標(biāo)頁面包括: 從所述自定義的瀏覽歷史記錄中獲取所述目標(biāo)頁面在展現(xiàn)時(shí)的動(dòng)畫效果信息； 根據(jù)所述Web服務(wù)器返回的資源數(shù)據(jù)，按照所述動(dòng)畫效果效果信息，在所述當(dāng)前頁面所在窗口中展現(xiàn)所述目標(biāo)頁面。
11.根據(jù)權(quán)利要求8所述的方法，其特征在于，還包括: 根據(jù)用戶的訪問先后順序，記錄各個(gè)被訪問頁面的URL的哈希值，生成自定義的瀏覽歷史記錄； 所述根據(jù)瀏覽歷史記錄獲取所述目標(biāo)頁面的URL的哈希值包括: 根據(jù)所述自定義的瀏覽歷史記錄，獲取所述目標(biāo)頁面的URL的哈希值。
12.根據(jù)權(quán)利要求8、9或11任一項(xiàng)所述的方法，其特征在于，所述目標(biāo)頁面的URL的哈希值中還包含有所述目標(biāo)頁面在展現(xiàn)時(shí)的動(dòng)畫效果信息，所述根據(jù)所述Web服務(wù)器返回的資源數(shù)據(jù)，在所述當(dāng)前頁面所在窗口中展現(xiàn)所述目標(biāo)頁面包括: 根據(jù)所述Web服務(wù)器返回的資源數(shù)據(jù)，按照所述動(dòng)畫效果信息，在所述當(dāng)前頁面所在窗口中展現(xiàn)所述目標(biāo)頁面。
13.一種頁面切換裝置，其特征在于，包括: 監(jiān)控單元，用于監(jiān)控將當(dāng)前頁面切換到目標(biāo)頁面的操作請求，并獲取所述目標(biāo)頁面的資源地址； 哈希值修改單元，用于通過對當(dāng)前頁面的統(tǒng)一資源定位符URL的哈希值進(jìn)行修改，觸發(fā)瀏覽器的哈希值改變事件，以便瀏覽器在原生的訪問歷史中記錄所述哈希值的變化，并提供窗口句柄；其中，修改后的哈希值中包含有所述目標(biāo)頁面的資源地址信息； 異步加載請求單元，用于從所述窗口句柄中獲取所述目標(biāo)頁面的資源地址，并根據(jù)所述目標(biāo)頁面的資源地址，向?qū)?yīng)的Web服務(wù)器發(fā)起異步加載請求； 展現(xiàn)單元，用于根據(jù)所述Web服務(wù)器返回的資源數(shù)據(jù)，在所述當(dāng)前頁面所在窗口中展現(xiàn)所述目標(biāo)頁面。
【文檔編號(hào)】G06F17/30GK103984686SQ201310049400
【公開日】2014年8月13日 申請日期:2013年2月7日 優(yōu)先權(quán)日:2013年2月7日
【發(fā)明者】楊振楠 申請人:阿里巴巴集團(tuán)控股有限公司