本發(fā)明涉及面向?yàn)g覽器端的Web開(kāi)發(fā)領(lǐng)域，具體來(lái)講是一種基于HAR的脫離后臺(tái)邏輯的Web系統(tǒng)演示方法及裝置。

背景技術(shù)：

隨著Web技術(shù)的日益成熟，基于Web技術(shù)的招標(biāo)項(xiàng)目也越來(lái)越多，而在Web項(xiàng)目的招標(biāo)現(xiàn)場(chǎng)，演示W(wǎng)eb系統(tǒng)就是投標(biāo)者展示自己產(chǎn)品的首選方法。而演示的常見(jiàn)做法就是提前將整套Web系統(tǒng)程序部署在筆記本設(shè)備上，現(xiàn)場(chǎng)使用筆記本在瀏覽器中訪(fǎng)問(wèn)已部署好的Web系統(tǒng)，達(dá)到演示的目的。

但實(shí)際操作中，這種做法并非萬(wàn)無(wú)一失。因?yàn)橐粋€(gè)強(qiáng)大Web系統(tǒng)必然需要依賴(lài)數(shù)據(jù)庫(kù)、緩存等組件，同時(shí)還有復(fù)雜的邏輯代碼，這些往往對(duì)硬件有很高的要求，而筆記本性能往往比較差。當(dāng)在瀏覽器里面演示的時(shí)候，由于Web后臺(tái)需要較多的硬件資源，對(duì)應(yīng)的瀏覽器可使用的硬件資源就大大降低，這樣演示的時(shí)候?yàn)g覽器就會(huì)出現(xiàn)卡頓、延時(shí)現(xiàn)象，從而影響演示的流暢性。而在招標(biāo)現(xiàn)場(chǎng)，這種現(xiàn)象對(duì)于產(chǎn)品競(jìng)標(biāo)是極其不利的。

技術(shù)實(shí)現(xiàn)要素：

本發(fā)明的目的是為了克服上述背景技術(shù)的不足，提供一種基于HAR的脫離后臺(tái)邏輯的Web系統(tǒng)演示方法及裝置，通過(guò)使用瀏覽器導(dǎo)出的har文件作為數(shù)據(jù)源來(lái)實(shí)現(xiàn)Web系統(tǒng)的演示，有效避免了復(fù)雜的后臺(tái)邏輯、繁重的數(shù)據(jù)庫(kù)查詢(xún)，極大的降低了對(duì)演示設(shè)備的硬件要求，提高了演示的流暢性。

為達(dá)到以上目的，本發(fā)明采取的技術(shù)方案是：提供一種基于HAR的脫離后臺(tái)邏輯的Web系統(tǒng)演示方法，該方法包括以下步驟：

安裝并運(yùn)行已成功部署的Web系統(tǒng)，獲取Web系統(tǒng)的訪(fǎng)問(wèn)地址；

根據(jù)Web系統(tǒng)的訪(fǎng)問(wèn)地址打開(kāi)相應(yīng)Web頁(yè)面，并啟動(dòng)瀏覽器自帶的開(kāi)發(fā)者工具；

在打開(kāi)的Web頁(yè)面中進(jìn)行各項(xiàng)功能操作，使瀏覽器搜集各項(xiàng)功能操作中的各種HTTP傳輸過(guò)程信息；

利用開(kāi)發(fā)者工具，將瀏覽器搜集到的各種HTTP傳輸過(guò)程信息保存為har文件；

創(chuàng)建HTTP服務(wù)器套接字，并將服務(wù)器套接字設(shè)置為：每當(dāng)服務(wù)器套接字收到瀏覽器請(qǐng)求時(shí)，就以保存的har文件作為數(shù)據(jù)源，循環(huán)執(zhí)行har文件中的所有HTTP傳輸過(guò)程，并將結(jié)果反饋給瀏覽器；

將設(shè)置好的服務(wù)器套接字的地址綁定到本機(jī)地址，啟動(dòng)HTTP服務(wù)器進(jìn)行演示；演示過(guò)程中，按照設(shè)置好的服務(wù)器套接字進(jìn)行實(shí)現(xiàn)。

本發(fā)明還提供一種實(shí)現(xiàn)上述方法的基于HAR的脫離后臺(tái)邏輯的Web系統(tǒng)演示裝置，該裝置包括訪(fǎng)問(wèn)地址獲取模塊、Web頁(yè)面打開(kāi)模塊、傳輸過(guò)程信息搜集模塊、har文件生成模塊、服務(wù)器套接字創(chuàng)建模塊和Web演示實(shí)現(xiàn)模塊。所述訪(fǎng)問(wèn)地址獲取模塊用于：在安裝并運(yùn)行已成功部署的Web系統(tǒng)后，獲取Web系統(tǒng)的訪(fǎng)問(wèn)地址；所述Web頁(yè)面打開(kāi)模塊用于：根據(jù)Web系統(tǒng)的訪(fǎng)問(wèn)地址打開(kāi)相應(yīng)Web頁(yè)面，并啟動(dòng)瀏覽器自帶的開(kāi)發(fā)者工具；所述傳輸過(guò)程信息搜集模塊用于：在打開(kāi)的Web頁(yè)面中進(jìn)行各項(xiàng)功能操作，使瀏覽器搜集各項(xiàng)功能操作中的各種HTTP傳輸過(guò)程信息；所述har文件生成模塊用于：利用開(kāi)發(fā)者工具，將搜集到的各種HTTP傳輸過(guò)程信息保存為har文件；所述服務(wù)器套接字創(chuàng)建模塊用于：創(chuàng)建HTTP服務(wù)器套接字，并將服務(wù)器套接字設(shè)置為：每當(dāng)服務(wù)器套接字收到瀏覽器請(qǐng)求時(shí)，就以保存的har文件作為數(shù)據(jù)源，循環(huán)執(zhí)行har文件中的所有HTTP傳輸過(guò)程，并將結(jié)果反饋給瀏覽器；所述Web演示實(shí)現(xiàn)模塊用于：將設(shè)置好的服務(wù)器套接字的地址綁定到本機(jī)地址，啟動(dòng)HTTP服務(wù)器進(jìn)行演示；演示過(guò)程中，按照設(shè)置好的服務(wù)器套接字進(jìn)行實(shí)現(xiàn)。

本發(fā)明的有益效果在于：

本發(fā)明事先在打開(kāi)的Web頁(yè)面中進(jìn)行各項(xiàng)功能操作，使瀏覽器搜集各項(xiàng)功能操作中的各種HTTP傳輸過(guò)程信息，利用開(kāi)發(fā)者工具，將瀏覽器搜集到的各種HTTP傳輸過(guò)程信息保存為har文件；然后，將服務(wù)器套接字設(shè)置為每當(dāng)服務(wù)器套接字收到瀏覽器請(qǐng)求時(shí)，就以har文件作為數(shù)據(jù)源，循環(huán)執(zhí)行har文件中的所有HTTP傳輸過(guò)程，并將結(jié)果反饋給瀏覽器。當(dāng)需要演示時(shí)，只需將設(shè)置好的服務(wù)器套接字的地址綁定到本機(jī)地址，啟動(dòng)HTTP服務(wù)器進(jìn)行演示即可，演示過(guò)程中，會(huì)按照設(shè)置好的服務(wù)器套接字進(jìn)行實(shí)現(xiàn)。

相較傳統(tǒng)的需要依賴(lài)大量數(shù)據(jù)庫(kù)、緩存等組件的瀏覽器演示方式來(lái)說(shuō)，本發(fā)明通過(guò)使用瀏覽器導(dǎo)出的har文件作為數(shù)據(jù)源來(lái)實(shí)現(xiàn)Web系統(tǒng)的演示，無(wú)需復(fù)雜的后臺(tái)邏輯和繁重的數(shù)據(jù)庫(kù)查詢(xún)，僅需少量步驟即可達(dá)到Web系統(tǒng)演示目的，而且僅讀取少量文件即可，對(duì)硬件性能要求極低，不會(huì)出現(xiàn)卡頓、延時(shí)現(xiàn)象，從而提高了演示的流暢性。

附圖說(shuō)明

圖1為本發(fā)明實(shí)施例中基于HAR的脫離后臺(tái)邏輯的Web系統(tǒng)演示方法的流程圖；

圖2為本發(fā)明實(shí)施例中生成har文件的示意圖；

圖3為本發(fā)明實(shí)施例中基于HAR的脫離后臺(tái)邏輯的Web系統(tǒng)演示裝置的結(jié)構(gòu)框圖。

具體實(shí)施方式

下面結(jié)合附圖及具體實(shí)施例對(duì)本發(fā)明作進(jìn)一步的詳細(xì)描述。

本發(fā)明中需要使用har文件，因此在這里對(duì)har文件進(jìn)行一些解釋說(shuō)明。HAR是一種Web標(biāo)準(zhǔn)，它規(guī)定瀏覽器要詳細(xì)的記錄每次HTTP傳輸過(guò)程中發(fā)出的數(shù)據(jù)信息(包括請(qǐng)求頭、請(qǐng)求體)和收到的數(shù)據(jù)信息(包括響應(yīng)頭、響應(yīng)碼、響應(yīng)內(nèi)容)。這些HTTP傳輸過(guò)程信息可以被導(dǎo)出/保存為后綴名為.har的JSON(JavaScript Object Notation，是一種輕量級(jí)的數(shù)據(jù)交換格式)格式文本文件，被導(dǎo)出/保存的文本文件即為har文件。本發(fā)明則通過(guò)使用瀏覽器導(dǎo)出的har文件作為數(shù)據(jù)源來(lái)實(shí)現(xiàn)本方案。

具體來(lái)說(shuō)，參見(jiàn)圖1所示，本發(fā)明實(shí)施例提供一種基于HAR的脫離后臺(tái)邏輯的Web系統(tǒng)演示方法，包括以下步驟：

步驟S1：安裝并運(yùn)行已成功部署的Web系統(tǒng)，獲取Web系統(tǒng)的訪(fǎng)問(wèn)地址，轉(zhuǎn)入步驟S2。本實(shí)施例中，Web系統(tǒng)的訪(fǎng)問(wèn)地址為http://127.0.0.1:8000。

步驟S2：通過(guò)在瀏覽器(例如，谷歌瀏覽器)的地址欄中輸入所述Web系統(tǒng)的訪(fǎng)問(wèn)地址，打開(kāi)相應(yīng)Web頁(yè)面；并啟動(dòng)瀏覽器自帶的開(kāi)發(fā)者工具，轉(zhuǎn)入步驟S3。本實(shí)施例中，通過(guò)在谷歌瀏覽器的地址欄中輸入http://127.0.0.1:8000打開(kāi)相應(yīng)Web頁(yè)面。

步驟S3：在打開(kāi)的Web頁(yè)面中進(jìn)行各項(xiàng)功能操作，該功能操作覆蓋到Web系統(tǒng)的每個(gè)功能，使瀏覽器搜集各項(xiàng)功能操作中的各種HTTP傳輸過(guò)程信息，轉(zhuǎn)入步驟S4?？梢岳斫獾氖牵琀TTP傳輸過(guò)程信息包括每次HTTP傳輸過(guò)程中發(fā)出的數(shù)據(jù)信息和收到的數(shù)據(jù)信息；其中，發(fā)出的數(shù)據(jù)信息包括請(qǐng)求頭、請(qǐng)求體，收到的數(shù)據(jù)信息包括響應(yīng)頭、響應(yīng)碼和響應(yīng)內(nèi)容。

步驟S4：利用開(kāi)發(fā)者工具，將瀏覽器搜集到的各種HTTP傳輸過(guò)程信息保存為har文件，轉(zhuǎn)入步驟S5。實(shí)際操作時(shí)，如圖2所示，只需在開(kāi)發(fā)者工具的“network”表項(xiàng)中選擇“Save as HAR with content”選項(xiàng)，就會(huì)彈窗提示保存文件，然后設(shè)置保存的文件名即可。例如，保存的har文件的文件名為HARFILE。

步驟S5：創(chuàng)建HTTP服務(wù)器套接字，并將服務(wù)器套接字設(shè)置為：每當(dāng)服務(wù)器套接字收到瀏覽器請(qǐng)求時(shí)，就以所述保存的har文件作為數(shù)據(jù)源，循環(huán)執(zhí)行har文件中的所有HTTP傳輸過(guò)程，并將結(jié)果反饋給瀏覽器，轉(zhuǎn)入步驟S6。

進(jìn)一步地，步驟S5中所述每當(dāng)服務(wù)器套接字收到瀏覽器請(qǐng)求時(shí)，就以所述保存的har文件作為數(shù)據(jù)源，循環(huán)執(zhí)行har文件中的所有HTTP傳輸過(guò)程，并將結(jié)果反饋給瀏覽器，具體包括以下操作：

1)每當(dāng)服務(wù)器套接字收到瀏覽器請(qǐng)求時(shí)，獲取當(dāng)前瀏覽器的請(qǐng)求路徑和請(qǐng)求方法；實(shí)際操作中，當(dāng)前瀏覽器的請(qǐng)求路徑和請(qǐng)求方法可分別記為PATH、METHOD。

2)獲取所述保存的har文件，將該文件內(nèi)容解析為JSON對(duì)象。

3)根據(jù)獲取到的當(dāng)前瀏覽器的請(qǐng)求路徑和請(qǐng)求方法，循環(huán)執(zhí)行解析的JSON對(duì)象的HTTP傳輸過(guò)程，并將結(jié)果反饋給瀏覽器。

更進(jìn)一步的，步驟3中，每次循環(huán)執(zhí)行解析的JSON對(duì)象的HTTP傳輸過(guò)程，具體包括以下操作：

301)獲取當(dāng)前傳輸過(guò)程的請(qǐng)求路徑，即request.url屬性；獲取當(dāng)前傳輸過(guò)程的請(qǐng)求方法，即request.method屬性；獲取當(dāng)前傳輸過(guò)程的響應(yīng)對(duì)象，即response屬性。

302)判斷瀏覽器的請(qǐng)求路徑和請(qǐng)求方法是否分別與當(dāng)前傳輸過(guò)程的請(qǐng)求路徑和請(qǐng)求方法一致，即PATH和request.url的路徑一致且METHOD和request.method一致，若是，則說(shuō)明找到當(dāng)前請(qǐng)求對(duì)應(yīng)的資源，轉(zhuǎn)入步驟303；否則，說(shuō)明找不到當(dāng)前請(qǐng)求對(duì)應(yīng)的資源，則反饋錯(cuò)誤信息給瀏覽器。

303)返回當(dāng)前傳輸過(guò)程的響應(yīng)頭、響應(yīng)碼和響應(yīng)內(nèi)容給瀏覽器，即response.headers屬性、response.status屬性和response.content.text屬性。

可以理解的是，由于步驟303中，所返回的響應(yīng)頭、響應(yīng)碼和響應(yīng)內(nèi)容都是數(shù)據(jù)源har文件中已保存好的內(nèi)容，因此，可有效避免復(fù)雜的后臺(tái)邏輯和繁重的數(shù)據(jù)庫(kù)查詢(xún)，提高了演示的流暢性。具體來(lái)說(shuō)，步驟3的實(shí)現(xiàn)代碼可為如下內(nèi)容：

步驟S6：將設(shè)置好的服務(wù)器套接字的地址綁定到本機(jī)地址，啟動(dòng)HTTP服務(wù)器進(jìn)行演示；演示過(guò)程中，按照設(shè)置好的服務(wù)器套接字進(jìn)行實(shí)現(xiàn)。

利用本發(fā)明的方法去實(shí)現(xiàn)Web系統(tǒng)的演示時(shí)，僅需少量步驟即可達(dá)到Web系統(tǒng)演示目的，而且僅僅讀取少量文件，對(duì)系統(tǒng)性能要求極低，為流暢的演示W(wǎng)eb系統(tǒng)提供了強(qiáng)大的動(dòng)力。

參見(jiàn)圖3所示，本發(fā)明還提供一種實(shí)現(xiàn)上述方法的基于HAR的脫離后臺(tái)邏輯的Web系統(tǒng)演示裝置，該裝置包括訪(fǎng)問(wèn)地址獲取模塊、Web頁(yè)面打開(kāi)模塊、傳輸過(guò)程信息搜集模塊、har文件生成模塊、服務(wù)器套接字創(chuàng)建模塊和Web演示實(shí)現(xiàn)模塊。

其中，訪(fǎng)問(wèn)地址獲取模塊用于：在安裝并運(yùn)行已成功部署的Web系統(tǒng)后，獲取Web系統(tǒng)的訪(fǎng)問(wèn)地址。Web頁(yè)面打開(kāi)模塊用于：根據(jù)Web系統(tǒng)的訪(fǎng)問(wèn)地址打開(kāi)相應(yīng)Web頁(yè)面，并啟動(dòng)瀏覽器自帶的開(kāi)發(fā)者工具。傳輸過(guò)程信息搜集模塊用于：在打開(kāi)的Web頁(yè)面中進(jìn)行各項(xiàng)功能操作，使瀏覽器搜集各項(xiàng)功能操作中的各種HTTP傳輸過(guò)程信息。har文件生成模塊用于：利用開(kāi)發(fā)者工具，將搜集到的各種HTTP傳輸過(guò)程信息保存為har文件。服務(wù)器套接字創(chuàng)建模塊用于：創(chuàng)建HTTP服務(wù)器套接字，并將服務(wù)器套接字設(shè)置為：每當(dāng)服務(wù)器套接字收到瀏覽器請(qǐng)求時(shí)，就以保存的har文件作為數(shù)據(jù)源，循環(huán)執(zhí)行har文件中的所有HTTP傳輸過(guò)程，并將結(jié)果反饋給瀏覽器。Web演示實(shí)現(xiàn)模塊用于：將設(shè)置好的服務(wù)器套接字的地址綁定到本機(jī)地址，啟動(dòng)HTTP服務(wù)器進(jìn)行演示；演示過(guò)程中，按照設(shè)置好的服務(wù)器套接字進(jìn)行實(shí)現(xiàn)。

進(jìn)一步地，所述服務(wù)器套接字創(chuàng)建模塊具體將服務(wù)器套接字設(shè)置為按照如下內(nèi)容進(jìn)行操作：每當(dāng)服務(wù)器套接字收到瀏覽器請(qǐng)求時(shí)，先獲取當(dāng)前瀏覽器的請(qǐng)求路徑和請(qǐng)求方法；再獲取所述保存的har文件，將該文件內(nèi)容解析為JSON對(duì)象；最后，根據(jù)獲取到的當(dāng)前瀏覽器的請(qǐng)求路徑和請(qǐng)求方法，循環(huán)執(zhí)行解析的JSON對(duì)象的HTTP傳輸過(guò)程，并將結(jié)果反饋給瀏覽器。其中，每次循環(huán)執(zhí)行解析的JSON對(duì)象的HTTP傳輸過(guò)程的具體操作為：獲取當(dāng)前傳輸過(guò)程的請(qǐng)求路徑，獲取當(dāng)前傳輸過(guò)程的請(qǐng)求方法，獲取當(dāng)前傳輸過(guò)程的響應(yīng)對(duì)象；判斷瀏覽器的請(qǐng)求路徑和請(qǐng)求方法是否分別與當(dāng)前傳輸過(guò)程的請(qǐng)求路徑和請(qǐng)求方法一致，若是，返回當(dāng)前傳輸過(guò)程的響應(yīng)頭、響應(yīng)碼和響應(yīng)內(nèi)容給瀏覽器；否則，反饋錯(cuò)誤信息給瀏覽器。

需要說(shuō)明的是：上述實(shí)施例提供的裝置在進(jìn)行操作時(shí)，僅以上述各功能模塊的劃分進(jìn)行舉例說(shuō)明，實(shí)際應(yīng)用中，可根據(jù)需要將上述功能分配由不同的功能模塊完成，即將裝置的內(nèi)部結(jié)構(gòu)劃分成不同的功能模塊，以完成以上描述的全部或者部分功能。

本發(fā)明不局限于上述實(shí)施方式，對(duì)于本技術(shù)領(lǐng)域的普通技術(shù)人員來(lái)說(shuō)，在不脫離本發(fā)明原理的前提下，還可以做出若干改進(jìn)和潤(rùn)飾，這些改進(jìn)和潤(rùn)飾也視為本發(fā)明的保護(hù)范圍之內(nèi)。本說(shuō)明書(shū)中未作詳細(xì)描述的內(nèi)容屬于本領(lǐng)域?qū)I(yè)技術(shù)人員公知的現(xiàn)有技術(shù)。