TWI592807B - Method and device for web style address merge - Google Patents

Method and device for web style address merge Download PDF

Info

Publication number
TWI592807B
TWI592807B TW102122366A TW102122366A TWI592807B TW I592807 B TWI592807 B TW I592807B TW 102122366 A TW102122366 A TW 102122366A TW 102122366 A TW102122366 A TW 102122366A TW I592807 B TWI592807 B TW I592807B
Authority
TW
Taiwan
Prior art keywords
style
address
addresses
combined
webpage
Prior art date
Application number
TW102122366A
Other languages
English (en)
Other versions
TW201437826A (zh
Inventor
Zhi-Wen Mi
Original Assignee
Alibaba Group Services Ltd
Priority date (The priority date is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the date listed.)
Filing date
Publication date
Application filed by Alibaba Group Services Ltd filed Critical Alibaba Group Services Ltd
Publication of TW201437826A publication Critical patent/TW201437826A/zh
Application granted granted Critical
Publication of TWI592807B publication Critical patent/TWI592807B/zh

Links

Classifications

    • G—PHYSICS
    • G06—COMPUTING; CALCULATING OR COUNTING
    • G06F—ELECTRIC DIGITAL DATA PROCESSING
    • G06F40/00—Handling natural language data
    • G06F40/10—Text processing
    • G06F40/12—Use of codes for handling textual entities
    • G06F40/14—Tree-structured documents
    • G06F40/143—Markup, e.g. Standard Generalized Markup Language [SGML] or Document Type Definition [DTD]
    • G—PHYSICS
    • G06—COMPUTING; CALCULATING OR COUNTING
    • G06F—ELECTRIC DIGITAL DATA PROCESSING
    • G06F16/00—Information retrieval; Database structures therefor; File system structures therefor
    • G06F16/90—Details of database functions independent of the retrieved data types
    • G06F16/95—Retrieval from the web
    • G06F16/955—Retrieval from the web using information identifiers, e.g. uniform resource locators [URL]
    • G06F16/9566—URL specific, e.g. using aliases, detecting broken or misspelled links
    • G—PHYSICS
    • G06—COMPUTING; CALCULATING OR COUNTING
    • G06F—ELECTRIC DIGITAL DATA PROCESSING
    • G06F16/00—Information retrieval; Database structures therefor; File system structures therefor
    • G06F16/90—Details of database functions independent of the retrieved data types
    • G06F16/95—Retrieval from the web
    • G06F16/957—Browsing optimisation, e.g. caching or content distillation
    • G06F16/9577—Optimising the visualization of content, e.g. distillation of HTML documents

Landscapes

  • Engineering & Computer Science (AREA)
  • Theoretical Computer Science (AREA)
  • Databases & Information Systems (AREA)
  • Physics & Mathematics (AREA)
  • General Engineering & Computer Science (AREA)
  • General Physics & Mathematics (AREA)
  • Data Mining & Analysis (AREA)
  • Health & Medical Sciences (AREA)
  • Artificial Intelligence (AREA)
  • Audiology, Speech & Language Pathology (AREA)
  • Computational Linguistics (AREA)
  • General Health & Medical Sciences (AREA)
  • Information Transfer Between Computers (AREA)
  • Document Processing Apparatus (AREA)

Description

網頁樣式位址合併的方法和裝置
本發明係關於資料處理領域，尤其係關於一種網頁樣式位址合併的方法和裝置。
現在互聯網應用已經進入web2.0時代，由於應用端的表現越來越豐富，所以對於前端頁面性能的要求也越來越高。在使用互聯網時，一般需要透過流覽器來閱讀文字、圖像等元素組成的網頁，網頁是通過統一資源定位符(URL)來識別與存取的。URL是超文本標記語言格式的一個應用，用來完整的描述互聯網上網頁和其他資源的位址的一種標記方法。在進行網頁設計時，為了獲得更好的效果，對網站中的每一個網頁都進行了樣式設計，例如：網頁的佈局、字體、顏色、背景、距離等等，通過網頁樣式設計的方式來搭建網站的框架結構、外觀和事件。
在現有技術中，網頁引用的樣式越來越多，每次打開網頁時都需要載入多個樣式內容文件以供頁面展示，這帶來的問題是頁面載入過多樣式內容文件導致性能低下、用戶體驗下降。如：一個網頁中使用了10個樣式資源，使 用現有方式打開網頁時，則需要向伺服器發送10次網頁樣式URL請求去獲取樣式內容，並根據上述10個樣式內容渲染網頁並展示出來，而且每次打開時都會載入10次樣式內容，從而降低了頁面的展現速度和用戶體驗。
本發明的主要目的在於提供一種網頁樣式位址合併的方法和裝置，以解決現有技術存在的載入大量網頁樣式，造成的網頁性能下降的問題。
為了解決上述技術問題，本發明的目的是通過以下技術方案實現的：
本發明公開了一種網頁樣式位址合併的方法，包括以下步驟：接收來自終端的網頁請求；基於所述網頁請求，確定與所述網頁請求相對應的網頁內容資料；解析所述網頁內容資料，得到多個樣式資料；從所述多個樣式資料中提取相應樣式資料中的樣式位址和樣式屬性；以及將多個所述樣式位址進行合併，以得到一個或多個組合樣式位址。
較佳的，在根據本發明所述的方法中，所述將多個所述樣式位址進行合併，以得到一個或多個組合樣式位址的步驟，還包括：基於所述多個樣式位址的樣式屬性將所述多個樣式位址進行合併，以得到所述組合樣式位址；以及將所述組合樣式位址發送至所述終端。
較佳的，根據本發明所述的方法，還可以包括：接收 來自所述終端的樣式渲染請求，其中，所述樣式渲染請求中包括所述組合樣式位址；基於所述組合樣式位址，讀取與所述組合樣式位址相對應的樣式內容；以及將所述樣式內容發送至所述終端。
較佳的，在根據本發明所述的方法中，所述基於所述組合樣式位址，讀取與所述組合樣式位址相對應的樣式內容的步驟，還包括：解析所述組合樣式位址，將所述組合樣式位址拆分為多個位址段，並且每一個所述位址段對應所述多個樣式位址中的一個樣式位址；根據所述多個位址段，讀取所述多個位址段的多個樣式內容；以及創建一個與所述組合樣式位址相對應的文件，並將所述多個樣式內容保存至所述文件中。
較佳的，在根據本發明所述的方法中，所述基於所述組合樣式位址，讀取與所述組合樣式位址相對應的樣式內容的步驟，還包括：查詢與所述組合樣式位址相對應的文件，讀取所述文件中的樣式內容。
較佳的，在根據本發明所述的方法中，所述組合樣式位址的數量少於所述多個樣式位址的數量。
本發明還公開了一種網頁樣式位址合併的裝置，包括：接收模組，用於接收來自終端的網頁請求；查詢模組，用於基於所述網頁請求，確定與所述網頁請求相對應的網頁內容資料；解析模組，用於解析所述網頁內容資料，得到多個樣式資料；提取模組，用於從所述多個樣式資料中提取相應樣式資料的樣式位址和樣式屬性；以及合 併模組，用於將多個所述樣式位址進行合併，以得到一個或多個組合樣式位址。
較佳的，在根據本發明所述的裝置中，所述合併模組還被配置為：基於所述多個樣式位址的樣式屬性將所述多個樣式位址進行合併，以得到所述組合樣式位址；以及將所述組合樣式位址發送至所述終端。
較佳的，在根據本發明所述的裝置中，所述接收模組還被配置成接收來自所述終端的樣式渲染請求，其中，所述樣式渲染請求中包括所述組合樣式位址；所述查詢模組還被配置成基於所述組合樣式位址，讀取與所述組合樣式位址相對應的樣式內容；以及所述合併模組還被配置成將所述樣式內容發送至所述終端。
較佳的，在根據本發明所述的裝置中，所述查詢模組還包括：拆分單元，用於解析所述組合樣式位址，將所述組合樣式位址拆分為多個位址段，並且每一個所述位址段對應所述多個樣式位址中的一個樣式位址；讀取單元，用於根據所述多個位址段，讀取所述多個位址段的多個樣式內容；以及創建單元，用於創建一個與所述組合樣式位址相對應的文件，並將所述多個樣式內容保存至所述文件中。
較佳的，在根據本發明所述的裝置中，所述讀取單元還配置成通過查詢與所述組合樣式位址相對應的文件以讀取所述文件中的樣式內容。
較佳的，在根據本發明所述的裝置中，所述組合樣式 位址的數量少於所述多個樣式位址的數量。
與現有技術相比，根據本發明的技術方案具有以下優點：通過將網頁中多個樣式位址合併的方式，減少了樣式位址數量，從而，減少了用戶端與伺服器的交互次數，加快了頁面載入速度，同時減輕了伺服器的系統壓力。
410‧‧‧接收模組
420‧‧‧查詢模組
421‧‧‧拆分單元
422‧‧‧讀取單元
430‧‧‧解析模組
440‧‧‧提取模組
450‧‧‧合併模組
此處所說明的附圖用來提供對本發明的進一步理解，構成本發明的一部分，本發明的示意性實施例及其說明用於解釋本發明，並不構成對本發明的不當限定。在附圖中：圖1是本發明實施例的網頁樣式位址合併的方法的流程圖；圖2是本發明實施例的基於網頁樣式位址合併的方法獲取樣式內容的流程圖；圖3是本發明實施例的基於網頁樣式位址合併的方法獲取樣式內容的另一實施方式的流程圖；圖4是本發明實施例的網頁樣式位址合併的裝置的模組圖；以及圖5是本發明實施例的圖4中的查詢模組420的單元框圖。
本發明的主要思想在於，接收來自終端的網頁請求； 基於所述網頁請求，確定與所述網頁請求相對應的網頁內容資料；解析所述網頁內容資料，得到多個樣式資料；從所述多個樣式資料中提取相應樣式資料的樣式位址和樣式屬性；以及將多個所述樣式位址進行合併，以得到一個或多個組合樣式位址，其中所述組合樣式位址的數量少於所述多個樣式位址的數量。
為使本發明的目的、技術方案和優點更加清楚，以下結合附圖及具體實施例，對本發明作進一步地詳細說明。
根據本發明的實施例，提供了一種網頁樣式位址合併的方法。
如圖1所述，為本發明實施例的網頁樣式位址合併的方法的流程圖。
用戶在使用互聯網時，會打開網頁用於流覽相關內容，此時，終端會向伺服器發送一個網頁請求，該網頁請求可以滿足超文本傳輸協定(HTTP協定)的形式或所屬領域技術人員熟知的其他傳輸協議的形式並且包含所述網頁的頁面位址資訊，該網頁請求的目的是請求伺服器向所述終端發送所述網頁中的多個樣式的位址資訊，並利用所述多個樣式的位址載入該位址所指向的樣式內容。
在步驟S102處，接收來自終端的該網頁請求，並在步驟S104處，基於該網頁請求，確定與該網頁請求相對應的網頁內容資料，其中。具體而言，根據該網頁請求包含的頁面位址資訊在伺服器的第一資料庫中查詢並確定與該網頁請求相對應的網頁內容資料，該網頁內容資料同樣 滿足HTTP協定或與上述網頁請求相應的協議形式，而且該網頁內容資料包含超文本標記語言(HTML)代碼、腳本語言代碼等代碼語句，所述代碼語句用來描述網頁內容資料中的多個原始樣式資料，每個原始樣式資料中都包括資料標籤、樣式屬性、樣式位址等資訊。
在確定與所述網頁請求相對應的網頁內容資料後，在步驟S106中，解析所述網頁內容資料，得到多個樣式資料。
在所述網頁內容資料中包含多個原始樣式資料，解析所述網頁內容資料，也就是判斷所述每一個原始樣式資料的正確性和完整性，如，代碼語句格式、資料標籤等等。在該解析過程中，忽略出現語句錯誤和/或語句不完整的原始樣式資料，將具有正確性和完整性的原始樣式資料作為後續步驟的基礎，該具有正確性和完整性的原始樣式資料稱為樣式資料，從而得到該多個樣式資料。
舉例而言，查找所述網頁內容資料中包含的<link>標籤和<script>標籤，對包含<link>標籤和包含<script>標籤的每條代碼語句進行校驗和分析，判斷該代碼語句所描述的是否為一個樣式資料(代碼語句具有正確性和完整性)。例如：語句1：<link href="http：//style.china.alibaba.com/a.css”rel=”stylesheet”/>
首先檢查<link>標籤中是否存在“href”屬性，若存在則檢查資料標籤中是否存在rel=”stylesheet”，若存在rel=”stylesheet”，則檢查http：//style.china.alibaba.com/a.css 是否為符合要求的樣式位址資訊，如，判斷該樣式位址的伺服器功能變數名稱是否正確，若該樣式位址符合要求，則檢查該樣式位址的結尾類型，可以判斷出該樣式位址是以.css結尾。
語句2：<script src=“http：//style.china.alibaba.com/a.js”></script>
與語句1的解析過程相仿，首先檢查<script>標籤中是否包含“src”屬性，若存在則檢查該代碼語句是否以</script>結束，若正確，則檢查樣式位址http：//style.china.alibaba.com/a.js是否符合要求，在該樣式位址符合要求的前提下，檢查該樣式位址的結尾類型，判斷出該地址的結尾為.js。
經過解析，若代碼語句完整且正確，則該代碼語句描述的為一個樣式資料，若在解析過程中任一環節出現代碼語句錯誤，則停止該條語句的解析，進行下一條代碼語句的解析，從而解析所述網頁內容資料，可以得到多個樣式資料。
在每一個樣式資料中都包含樣式位址和樣式屬性，根據已解析的所述網頁內容資料，在步驟S108處，從所述多個樣式資料中提取相應樣式資料的樣式位址和樣式屬性。即：若解析某條代碼語句所描述的為一個樣式資料，則提取出該代碼語句的樣式位址和樣式屬性，進一步地，可以理解為，對已解析的網頁內容資料中的多個樣式資料進行資料再處理，目的在於獲得相應樣式資料的樣式位址和樣式屬性。在此，將已解析的網頁內容資料稱之為樣式 解析資料，其中該樣式解析資料可以包含多個樣式資料(具有正確性和完整性的原始樣式位址)，並且每一個樣式資料包含樣式位址和樣式屬性，可以利用該樣式屬性對樣式解析資料中的多個樣式資料進行分組、並將所述多個樣式資料中的多個樣式位址進行合併，進一步地，可以理解為利用樣式屬性對多個樣式位址進行合併，以達到簡化代碼語言的效果。
在得到多個樣式資料的樣式位址和樣式屬性之後，在步驟S110處，將多個所述樣式位址進行合併，以得到一個或多個組合樣式位址，其中所述組合樣式位址的數量少於所述多個樣式位址的數量。具體而言，將該樣式解析資料中的多個樣式資料按照樣式屬性的值進行分組，並將具有相同樣式屬性值的多個樣式位址進行合併。
在對所述樣式解析資料中多個樣式位址進行合併後，可以得到組合樣式資料，該組合樣式資料中包含一個或多個組合樣式位址，該組合樣式位址即是按照樣式屬性對多個樣式位址進行合併得到的樣式位址。概括而言，基於所述多個樣式位址的樣式屬性將所述多個樣式位址進行合併，以得到所述組合樣式位址。
本發明的實施例是以樣式解析資料為基礎對多個樣式資料進行分組從而對所述樣式資料中的樣式位址進行合併。程式碼1為現有技術中的樣式解析資料，以程式碼1為例，對多個樣式資料的合併進行說明。
程式碼1： <html> <head>.....</head> <body> <link data-sc-pos=”head”data-sc-group=”group1”href=”http：//style.china.alibaba.com/a.css”rel=”stylesheet”/> <link data-sc-pos=”head”data-sc-group=”group1”href=”http：//style.china.alibaba.com/b.css”rel=”stylesheet”/> <script data-sc-pos=”footer”data-sc-group=”group2”src=”http：//style.china.alibaba.com/a.js></script> <script data-sc-pos=”footer”data-sc-group=”group2”src=”http：//style.china.alibaba.com/b.js></script> </body> </html>
在該樣式解析資料中包含了CSS代碼和JS代碼兩種代碼語言，並使用CSS代碼定義了兩條<link>語句，使用JS代碼定義了兩條<script>語句，根據具有<link>標籤和<script>標籤的代碼語句的完整性和正確性，可以知道，在該樣式解析資料中包含有4個樣式資料。
將所述樣式解析資料中的4個樣式資料進行合併，得到程式碼2所示的組合樣式資料，在程式碼2的代碼語句中包含有兩個樣式屬性，即，位置屬性(data-sc-pos)和分組屬性(data-sc-group)。其中，位置屬性用於表示當前樣式位址在合併後需要放置在頁面的位置。當data-sc-pos=“head”時，表示該樣式位址放置在HTML語言的<head>${…}</head>中間，當data-sc-pos=“footer”時， 表示該樣式位址放置在HTML語言的${…}</body>前面；分組屬性，用於指定樣式位址所屬的分組，利用分組屬性的值劃分不同的分組，該分組屬性需要與位置屬性一同使用，若單獨使用該分組屬性，則忽略兩種樣式資料。
對程式碼1所示的樣式解析資料，為了按分組對樣式位址進行合併，首先進行位置屬性分組，再進行分組屬性分組，將所述樣式解析資料中的4個樣式資料進行分組。
在所述樣式解析資料中，按照位置屬性的值，如：data-sc-pos=“head”、data-sc-pos=“footer”，對樣式位址進行第一次分組，例如，將位置屬性具有值“head”的語句分組在一起，將位置屬性具有值“footer”的語句分組在一起，這樣可以得到具有位置屬性的樣式位址分組，通過位置屬性對樣式位址進行分組，可以區分出網頁樣式載入的先後順序；將具有位置屬性的樣式位址分組再按照分組屬性進行第二次分組，將具有同樣分組值，如：data-sc-group=“group1”、data-sc-group=“group2”的樣式位址進行分組，如，將包含data-sc-group=“group1”的樣式位址分為一組，將包含data-sc-group=“group2”的樣式位址分為一組。
將每一個分組的樣式位址進行合併，得到組合樣式位址，程式碼2為對所述樣式解析資料中4個樣式位址進行合併的結果。
程式碼2： <html> <head> <link href=”http：//style.china.alibaba.com/a|b.css”rel=”stylesheet”/> </head> <body> <script src=http：//style.china.alibaba.com/a|b.js></script> </body> </html>
其中將樣式解析資料中的語句<link data-sc-pos=“head”data-sc-group=”group1”href=“http：//style.china.alibaba.com/a.css”rel=“stylesheet”/>和語句<link data-sc-pos=“head”data-sc-group=”group1”href=“http：//style.china.alibaba.com/b.css”rel=“stylesheet”/>進行了合併，得到語句<link href=“http：//style.china.alibaba.com/a|b.css”rel=“stylesheet”/>。
將語句<script data-sc-pos=“footer”data-sc-group=”group2”scr=http：//style.china.alibaba.com/a.js></script>和<script data-sc-pos=“footer”data-sc-group=”group2”scr=http：//style.china.alibaba.com/b.js></script>進行合併，得到語句<script scr=http：//style.china.alibaba.com/a|b.js></script>。
進一步地，在對樣式解析資料合併時，若代碼由兩種以上代碼語言組成，則代碼與代碼之間的合併需要分開進行，如：在程式碼1中包含有CSS代碼和JS代碼兩種代碼語言，在進行合併操作時，CSS代碼編寫的語句之間按分組進行合併，JS代碼編寫的語句之間按分組進行合 併。
通過對程式碼1和程式碼2的描述，可以看到，合併後的樣式解析資料只包含2個樣式位址，相較於程式碼1，程式碼2的語句更為簡潔，可以減少伺服器請求次數，若樣式解析資料中包含較多的樣式位址，利用本發明的方法合併樣式位址，可以有效地減少樣式位址條目，減少用戶端與伺服器的交互次數。
在另一種實施例中，樣式解析資料可以存在多個樣式資料的位置屬性不同，但分組屬性相同，或者多個樣式資料的位置屬性相同，但分組屬性不同的情況，如下述程式碼3所示的樣式解析資料。
程式碼3： <html> <head>.....</head> <body> <link data-sc-pos=“head”data-sc-group=”group1”href=”http：//style.china.alibaba.com/c.css”rel=”stylesheet”/> <link data-sc-pos=“footer”data-sc-group=”group1”href=”http：//style.china.alibaba.com/d.css”rel=”stylesheet”/> <link data-sc-pos=“footer”data-sc-group=”group1”href=”http：//style.china.alibaba.com/e.css”rel=”stylesheet”/> <script data-sc-pos=“footer”data-sc-group=”group3”src=”http：//style.china.alibaba.com/c.js”></script> <script data-sc-pos=“footer”data-sc-group=”group4”src=”http：//style.china.alibaba.com/d.js”></script> <script data-sc-pos=“footer”data-sc-group=”group4”src=”http：//style.china.alibaba.com/e.js”></script>
在該樣式解析資料中包含6個樣式資料，前3個包含<link>標籤的代碼，具有不同值的位置屬性和相同值的分組屬性，後3個包含<script>標籤的代碼，具有相同值的位置屬性和不同值的分組屬性。在本實施例中，按照分組屬性的值進行分組，將包含“group1”的樣式資料分為一組，將包含“group3”的樣式資料分為一組，將包含“group4”的樣式資料分為一組，其中，包含“group1”的分組中位置屬性的值分別有“head”和“footer”兩種，以先出現的值為准，忽略在後出現的值，即，以值為“head”的位置屬性為准，忽略值為“footer”的位置屬性，將該分組中樣式位址進行合併，並將該組合樣式位址 放置於html語言的<head>${...}</head>中間；包含“group3”和“group4”的兩個分組，位置屬性的值均為“footer”，則在樣式位址合併後，將組合樣式位址放置於html語言的${…}</body>前面。
對該樣式解析資料中的多個樣式資料按分組進行合併，可以得到程式碼4所示的組合樣式資料。
程式碼4；<html> <head> <link href="http：//style.china.alibaba.com/c|d|e.css”rel=”stylesheet”/> </head> <body> <script src=“http：//style.china.alibaba.com/c.js”></script> <script src=“http：//style.china.alibaba.com/d|e.js”></script> </body> </html>
在另一種實施例中，樣式解析資料可以只包括位置屬性，並且該位置屬性包含不同值，通過位置屬性控制分組，如，程式碼5所示。
程式碼5： <html> <head>.....</head> <body> <link data-sc-pos=“head”href=”http：//style.china.alibaba.com/f.css”rel=”stylesheet”/> <link data-sc-pos=“footer”href=”http：//style.china.alibaba.com/h.css”rel=”stylesheet”/> <link data-sc-pos=“footer”href=”http：//style.china.alibaba.com/g.css”rel=”stylesheet”/> <script data-sc-pos=“footer”src=”http：//style.china.alibaba.com/f.js”></script> <script data-sc-pos=“head”src=”http：//style.china.alibaba.com/h.js”></script> <script data-sc-pos=“footer”src=”http：//style.china.alibaba.com/g.js”></script>
在對該樣式解析資料執行按分組進行合併操作時，只按照位置屬性的值進行分組，即，將包含“head”的樣式資料分為一組，將包含“footer”的樣式資料分為一組，並將每組樣式資料進行合併。
需要說明的是，在該樣式解析資料中，具有同一值的樣式資料由兩種代碼語言(CSS代碼、JS代碼)組成，所以，在兩種代碼間不考慮位置屬性的因素，分別對樣式資料中的樣式位址按分組進行合併，得到組合樣式資料，如程式碼6所述。
程式碼6： <html> <head> <link href="http：//style.china.alibaba.com/f.css”rel=”stylesheet”/> <script src=“http：//style.china.alibaba.com/h.js”></script> </head> <body> <link href="http：//style.china.alibaba.com/h|g.css”rel=”stylesheet”/> <script src=“http：//style.china.alibaba.com/f|g.js”></script> </body>
將樣式解析資料中的樣式位址按分組進行合併，得到組合樣式位址，有效地減少了樣式位址條數，從而減少了終端與伺服器之間的交互，減輕了伺服器的資料處理壓力。
在得到所述組合樣式資料後，將該組合樣式資料發送至所述終端，也即是說，將所述一個或多個組合樣式位址發送至所述終端。所述終端接收到組合樣式資料的資料包，並根據所述組合樣式資料中包含的組合樣式位址載入網頁資源，網頁資源載入完畢，所述終端對所述網頁進行網頁渲染，在進行網頁渲染時，流覽器需要根據樣式內容渲染網頁，但是，由於所述終端中不包含所述組合樣式位址的樣式內容，無法渲染頁面，所以，所述終端要向伺服器發送樣式渲染請求，該樣式渲染請求的目的在於請求伺服器向終端傳送與每一個組合樣式位址對應的樣式內容，該樣式內容包括：層疊樣式表、JS代碼等，並且該樣式內容可以位於第二資料庫中。所述層疊樣式表和JS代碼 可以控制頁面的佈局、字體、顏色、背景、距離等等，該終端根據所述樣式內容進行頁面渲染。
圖2為本發明實施例的基於網頁樣式位址合併的方法獲取樣式內容的流程圖。
在步驟S202處，接收來自所述終端的樣式渲染請求，其中，所述樣式渲染請求中包含所述組合樣式位址，並在步驟S204處，基於該組合樣式位址，讀取與該組合樣式位址相對應的樣式內容。在讀取所述樣式內容時，對該組合樣式位址進行解析，如：在語句<script scr=http：//style.china.alibaba.com/a|b.js></script>中，解析出該語句的伺服器功能變數名稱為style.china.alibaba.com，所要獲取的樣式內容的路徑為/a|b.js。將該組合樣式位址從第三個“/”開始將“|”為標識的合併部分a|b.js拆分為地址段a.js和地址段b.js，每個位址段對應一個樣式位址。
進一步地，解析所述組合樣式位址，將所述組合樣式位址拆分為多個位址段，並且每一個所述位址段對應所述多個樣式位址中的一個樣式位址，根據拆分後的多個位址段在伺服器的第二資料庫中讀取對應的多個樣式內容，即，根據所述多個位址段，讀取所述多個位址段的多個樣式內容，該樣式內容包括：層疊樣式表、JS代碼等。較佳地，第二資料庫為樣式資料庫。
在步驟S206處，將所述樣式內容發送至所述終端。
在另一種實施例中，伺服器可以將多個位址段的多個 樣式內容彙集到一個文件中，並使該文件與多個位址段所對應的組合樣式位址相對應，通過組合樣式位址整體讀取該文件中的樣式內容，以簡化樣式內容的讀取過程。
如圖3所示，為本發明實施例的基於網頁樣式位址合併的方法獲取樣式內容的另一實施方式的流程圖。
在步驟S302處，接收來自終端的樣式渲染請求，解析所述樣式渲染請求中包含的組合樣式位址，將所述組合樣式位址拆分為多個位址段，讀取所述多個位址段的多個樣式內容。在步驟S304處，將該組合樣式位址轉換為對應的路徑，利用dm5演算法，將該路徑生成一段md5字串，在第二資料庫創建一個文件，並用該字串命名該文件，將該文件作為與所述組合樣式位址相對應的文件，利用該文件保存所述多個樣式內容，該步驟可概括為，創建一個與所述組合樣式位址相對應的文件，並將所述多個樣式內容保存至所述文件中。其中，md5演算法是將一段資料加密成一個32位元長的字串文本，如：ef8dead9cce9da95277431aa12291634_4371893471.js，該字串文本具有單一性，即，不同的組合樣式位址生成的字串文本不相同。
在步驟S306處，查詢與所述組合樣式位址相對應的文件，讀取所述文件中的樣式內容，並在步驟S308處，將所述樣式內容發送至所述終端。
所述終端根據接收到的樣式內容渲染網頁，最終展現給用戶。
需要說明的是，上述伺服器可以使用獨立伺服器，也可以使用多個伺服器，如：動態伺服器和樣式伺服器。所述動態伺服器用於儲存每個網頁位址對應的網頁內容資料，並負責將樣式解析資料中樣式位址按分組進行合併的操作；樣式伺服器用於儲存每個樣式位址對應的樣式內容，並具有拆分組合樣式位址的能力。
在現有技術中，所述終端需要將樣式解析資料中所有樣式位址併發發送給伺服器，以獲取對應的樣式內容，本發明通過對樣式位址進行合併的方式，減少了樣式位址的數量，從而有效的降低了網路交互次數，提升了用戶體驗。
本發明還提供了一種網頁樣式位址合併的裝置，參照圖4所述為本發明實施例的網頁樣式位址合併的裝置的模組圖。
根據本發明的裝置，可以包括接收模組410、查詢模組420、解析模組430、提取模組440、以及合併模組450。
其中，接收模組410可以用於接收來自終端的網頁請求。
該網頁請求在終端開啟網頁時發出，其中，該網頁請求中包含頁面位址資訊，查詢模組420基於該網頁請求確定網頁內容資料，解析模組430解析該網頁內容資料，找出該網頁內容資料中的有用資料(樣式資料)，提取模組440，提取該有用資料(樣式資料)中的樣式位址和樣式 屬性，合併模組450根據相應樣式資料的樣式位址和樣式屬性，對樣式位址進行合併。
查詢模組420，用於基於所述網頁請求，確定與所述網頁請求相對應的網頁內容資料。
根據網頁請求中包含的頁面位址資訊可以在伺服器第一資料庫中確定出一個與該網頁請求相對應的網頁內容資料，該網頁內容資料包括多個原始樣式資料，每一個原始樣式資料包括資料標籤、樣式屬性、樣式位址等資訊。
解析模組430，用於解析所述網頁內容資料，得到多個樣式資料。
該解析模組430需要對網頁內容資料中的每一個原始樣式資料進行解析，判斷每一個原始樣式資料的正確性和完整性，忽略存在錯誤語句和/或不完整語句的原始樣式資料，將具有正確性和完整性的原始樣式資料稱為樣式資料。
將已解析所述網頁內容資料稱為樣式解析資料，在該樣式解析資料中包含多個樣式資料。
提取模組440，用於從所述多個樣式資料中提取相應樣式資料的樣式位址和樣式屬性，從而可以得到多個樣式位址和多個樣式屬性。
合併模組450，用於將多個所述樣式位址進行合併，以得到一個或多個組合樣式位址，其中所述組合樣式位址的數量少於所述多個樣式位址的數量。
由於提取模組440可以提取出相應樣式資料的樣式位 址和樣式屬性，合併模組450基於所述多個樣式位址的樣式屬性將所述多個樣式位址進行合併，以得到組合樣式位址。
由於對多個樣式位址進行了合併，所以得到的組合樣式位址數量少於所述多個樣式位址，從而減少了伺服器與終端之間的資料交互次數。
合併模組450將該組合樣式位址發送至所述終端。
由於所述終端不具備該組合樣式位址所指向的樣式內容，不能以該組合樣式位址渲染網頁，所以會再次向伺服器發送請求，該請求為樣式渲染請求。
接收模組410還被配置成接收來自終端的樣式渲染請求，其中，在該樣式渲染請求中包括所述組合樣式位址。
查詢模組420還被配置成基於該組合樣式位址，讀取與該組合樣式位址相對應的樣式內容。
在查詢模組420中，還包括：拆分單元421、讀取單元422。
具體的，如圖5所示的本發明實施例的圖4中的查詢模組420的單元框圖。
拆分單元421用於解析所述組合樣式位址，將所述組合樣式位址拆分為多個位址段，並且每一個所述位址段對應所述多個樣式位址中的一個樣式位址。通過該拆分單元421將所述組合樣式拆分的多個位址段，讀取單元422，根據所述多個位址段，讀取所述多個位址段的多個樣式內容。
合併模組450將所述樣式內容發送至所述終端。
在另一種實施例中，查詢模組420還包括創建單元(未示出)，該創建單元基於已解析的組合樣式位址，創建一個與該組合樣式位址相對應的文件，並將所述多個樣式內容保存至該文件中。
接收模組410再次接收到來自終端的樣式渲染請求時，拆分單元421解析該樣式渲染請求中的組合樣式位址，讀取單元422通過查詢與該組合樣式位址相對應的文件，以讀取所述文件中的樣式內容。
合併模組450將該文件中的樣式內容向所述終端發送。
由於圖3和圖4所描述的本發明的裝置所包括的各個模組(含模組中包含的單元)的具體實施方式與本發明的方法中的步驟的具體實施方式是相對應的，由於已經對圖1、圖2和圖3進行了詳細的描述，所以為了不模糊本發明，在此不再對各個模組(含模組中包含的單元)的具體細節進行描述。
本說明書中的各個實施例一般採用遞進的方式描述，每個實施例重點說明的都是與其他實施例的不同之處，各個實施例之間相同相似的部分互相參見即可。
本發明可以在由電腦執行的電腦可執行指令的一般上下文中描述，例如程式模組或單元。一般地，程式模組或單元可以包括執行特定任務或實現特定抽象資料類型的常式、程式、物件、組件、資料結構等等。一般來說，程式 模組或單元可以由軟體、硬體或兩者的結合來實現。也可以在分散式計算環境中實踐本發明，在這些分散式計算環境中，由通過通信網路而被連接的遠端處理設備來執行任務。在分散式計算環境中，程式模組或單元可以位於包括儲存設備在內的本地和遠端電腦儲存介質中。
最後，還需要說明的是，術語“包括”、“包含”或者其任何其他變體意在涵蓋非排他性的包含，從而使得包括一系列要素的過程、方法、商品或者設備不僅包括那些要素，而且還包括沒有明確列出的其他要素，或者是還包括為這種過程、方法、商品或者設備所固有的要素。在沒有更多限制的情況下，由語句“包括一個......”限定的要素，並不排除在包括所述要素的過程、方法、商品或者設備中還存在另外的相同要素。
本領域內的技術人員應明白，本發明的實施例可提供為方法、系統、或電腦程式產品。因此，本發明可採用完全硬體實施例、完全軟體實施例、或結合軟體和硬體方面的實施例的形式。而且，本發明可採用在一個或多個其中包含有電腦可用程式碼的電腦可用儲存介質(包括但不限於磁盤記憶體、CD-ROM、光學記憶體等)上實施的電腦程式產品的形式。
本文中應用了具體個例對本發明的原理及實施方式進行了闡述，以上實施例的說明只是用於幫助理解本發明的方法及其主要思想；同時，對於本領域的一般技術人員，依據本發明的思想，在具體實施方式及應用範圍上均會有 改變之處，綜上所述，本說明書內容不應理解為對本發明的限制。

Claims (12)

  1. 一種網頁樣式位址合併的方法，其特徵在於，包括：接收來自客戶終端的網頁請求；基於所述網頁請求，確定與所述網頁請求相對應的網頁內容資料；從所述網頁內容資料提取多個樣式資料，所述多個樣式資料之各者包括樣式位址和至少兩個樣式屬性，所述至少兩個樣式屬性包括第一樣式屬性和第二樣式屬性；以及將多個樣式位址進行合併，以得到一個或多個組合樣式位址，包含：基於所述第一樣式屬性，將所述多個樣式資料之第一複數個樣式位址進行分組，分為至少第一組樣式位址及第二組樣式位址；基於所述第二樣式屬性，將所述第一組樣式位址的一或多個樣式位址進行分組，分為至少第一子組樣式位址及第二子組樣式位址，所述第一樣式屬性與所述第二樣式屬性不同；基於所述第二樣式屬性，將所述第二組樣式位址的一或多個樣式位址進行分組，分為至少第三子組樣式位址及第四子組樣式位址；以及將來自所述第一子組、第二子組、第三子組、或第四子組之其中一組的第一複數個樣式位址合併成組合樣式位址，所述第一複數個樣式位址的樣式位址來自相同的子 組。
  2. 根據申請專利範圍第1項所述的方法，其中，將多個樣式位址進行合併，以得到一個或多個組合樣式位址的步驟，還包括：基於與所述多個樣式位址對應於同一樣式資料的多個樣式屬性將所述多個樣式位址進行合併，以得到所述一個或多個組合樣式位址；以及將所述一個或多個組合樣式位址發送至所述客戶終端。
  3. 根據申請專利範圍第2項所述的方法，其中，還包括：接收來自所述客戶終端的樣式渲染請求，其中，所述樣式渲染請求中包括所述組合樣式位址；基於所述組合樣式位址，讀取與所述組合樣式位址相對應的樣式內容；以及將所述樣式內容發送至所述客戶終端。
  4. 根據申請專利範圍第3項所述的方法，其中，基於所述組合樣式位址，讀取與所述組合樣式位址相對應的樣式內容的步驟，還包括：解析所述組合樣式位址，將所述組合樣式位址拆分為多個位址段，並且每一個所述位址段對應所述多個樣式位址中的一個樣式位址；根據所述多個位址段，讀取所述多個位址段的多個樣式內容；以及 創建一個與所述組合樣式位址相對應的文件，並將所述多個樣式內容保存至所述文件中。
  5. 根據申請專利範圍第4項所述的方法，其中，基於所述組合樣式位址，讀取與所述組合樣式位址相對應的樣式內容的步驟，還包括：查詢與所述組合樣式位址相對應的文件，讀取所述文件中的樣式內容。
  6. 根據申請專利範圍第1至5項中任一項所述的方法，其中，將多個所述樣式位址進行合併，以得到一個或多個組合樣式位址的步驟，包括：所述組合樣式位址的數量少於所述多個樣式位址的數量。
  7. 一種網頁樣式位址合併的裝置，其特徵在於，包括：接收模組，用於接收來自客戶終端的網頁請求；查詢模組，用於基於所述網頁請求，確定與所述網頁請求相對應的網頁內容資料；解析模組，用於從所述網頁內容資料提取多個樣式資料，所述多個樣式資料之各者包括樣式位址和至少兩個樣式屬性，所述至少兩個樣式屬性包括第一樣式屬性和第二樣式屬性；以及合併模組，用於將多個樣式位址進行合併，以得到一個或多個組合樣式位址，包含：基於所述第一樣式屬性，將所述多個樣式資料之第一 複數個樣式位址進行分組，分為至少第一組樣式位址及第二組樣式位址；基於所述第二樣式屬性，將所述第一組樣式位址的一或多個樣式位址進行分組，分為至少第一子組樣式位址及第二子組樣式位址，所述第一樣式屬性與所述第二樣式屬性不同；基於所述第二樣式屬性，將所述第二組樣式位址的一或多個樣式位址進行分組，分為至少第三子組樣式位址及第四子組樣式位址；以及將來自所述第一子組、第二子組、第三子組、或第四子組之其中一組的第一複數個樣式位址合併成組合樣式位址，所述第一複數個樣式位址的樣式位址來自相同的子組。
  8. 根據申請專利範圍第7項所述的裝置，其中，所述合併模組還被配置為：基於與所述多個樣式位址對應於同一樣式資料的多個樣式屬性將所述多個樣式位址進行合併，以得到所述一個或多個組合樣式位址；以及將所述一個或多個組合樣式位址發送至所述客戶終端。
  9. 根據申請專利範圍第8項所述的裝置，其中，所述接收模組還被配置成接收來自所述客戶終端的樣式渲染請求，其中，所述樣式渲染請求中包括所述組合樣式位址； 所述查詢模組還被配置成基於所述組合樣式位址，讀取與所述組合樣式位址相對應的樣式內容；以及所述合併模組還被配置成將所述樣式內容發送至所述客戶終端。
  10. 根據申請專利範圍第9項所述的裝置，其中，所述查詢模組還包括：拆分單元，用於解析所述組合樣式位址，將所述組合樣式位址拆分為多個位址段，並且每一個所述位址段對應所述多個樣式位址中的一個樣式位址；讀取單元，用於根據所述多個位址段，讀取所述多個位址段的多個樣式內容；以及創建單元，用於創建一個與所述組合樣式位址相對應的文件，並將所述多個樣式內容保存至所述文件中。
  11. 根據申請專利範圍第10項所述的裝置，其中，所述讀取單元還被配置成通過查詢與所述組合樣式位址相對應的文件以讀取所述文件中的樣式內容。
  12. 根據申請專利範圍第7至11項中任一項所述的裝置，其中，所述組合樣式位址的數量少於所述多個樣式位址的數量。
TW102122366A 2013-03-22 2013-06-24 Method and device for web style address merge TWI592807B (zh)

Applications Claiming Priority (1)

Application Number Priority Date Filing Date Title
CN201310095228.9A CN104063401B (zh) 2013-03-22 2013-03-22 一种网页样式地址合并的方法和装置

Publications (2)

Publication Number Publication Date
TW201437826A TW201437826A (zh) 2014-10-01
TWI592807B true TWI592807B (zh) 2017-07-21

Family

ID=51551117

Family Applications (1)

Application Number Title Priority Date Filing Date
TW102122366A TWI592807B (zh) 2013-03-22 2013-06-24 Method and device for web style address merge

Country Status (5)

Country Link
US (1) US9563611B2 (zh)
JP (1) JP6203374B2 (zh)
CN (2) CN104063401B (zh)
TW (1) TWI592807B (zh)
WO (1) WO2014153457A1 (zh)

Families Citing this family (12)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
WO2016061269A1 (en) * 2014-10-15 2016-04-21 Alibaba Group Holding Limited Compression of cascading style sheet files
CN105577719B (zh) 2014-10-15 2019-11-05 阿里巴巴集团控股有限公司 一种数据压缩方法和装置
CN105574041B (zh) 2014-10-16 2020-07-21 阿里巴巴集团控股有限公司 一种数据重组方法和装置
CN105630345B (zh) 2014-11-06 2019-02-19 阿里巴巴集团控股有限公司 一种控制显示方向的方法和设备
CN106341367A (zh) * 2015-07-06 2017-01-18 中兴通讯股份有限公司 一种内容植入的实现方法和装置
US10657315B2 (en) * 2016-06-28 2020-05-19 Sap Se Generic and automated CSS scoping
CN106294597B (zh) * 2016-07-28 2019-09-20 百度在线网络技术（北京）有限公司 用于对网页的静态资源进行分组的方法和装置
CN106649499A (zh) * 2016-10-10 2017-05-10 五矿电子商务有限公司 一种合并网页中背景图的方法和系统
CN111355803A (zh) * 2020-03-04 2020-06-30 海南金盘智能科技股份有限公司 网页的传输方法、客户端和应用服务器
US11514121B2 (en) 2020-08-10 2022-11-29 International Business Machines Corporation Webpage customization
CN112231619A (zh) * 2020-10-15 2021-01-15 北京三快在线科技有限公司 转换方法、装置、电子设备及存储介质
CN113656717B (zh) * 2021-08-06 2024-05-28 上海硬通网络科技有限公司 一种网页的控件渲染方法、装置、设备及存储介质

Family Cites Families (8)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
US5944790A (en) 1996-07-19 1999-08-31 Lucent Technologies Inc. Method and apparatus for providing a web site having a home page that automatically adapts to user language and customs
NZ566291A (en) * 2008-02-27 2008-12-24 Actionthis Ltd Methods and devices for post processing rendered web pages and handling requests of post processed web pages
US8612881B2 (en) 2008-08-13 2013-12-17 Microsoft Corporation Web page content discovery
US8990289B2 (en) 2009-02-27 2015-03-24 Oracle America, Inc. Server based framework for improving Ajax performance
US8321533B2 (en) 2009-08-03 2012-11-27 Limelight Networks, Inc. Systems and methods thereto for acceleration of web pages access using next page optimization, caching and pre-fetching techniques
US8788577B2 (en) * 2010-06-22 2014-07-22 Akamai Technologies, Inc. Method and system for automated analysis and transformation of web pages
CN102622376A (zh) * 2011-01-28 2012-08-01 北京千橡网景科技发展有限公司 用于合并层叠样式表文件的方法和设备
CN102737067B (zh) * 2011-04-15 2015-05-13 阿里巴巴集团控股有限公司 输出网页的方法和系统

Also Published As

Publication number Publication date
TW201437826A (zh) 2014-10-01
US9563611B2 (en) 2017-02-07
JP6203374B2 (ja) 2017-09-27
CN104063401A (zh) 2014-09-24
CN108595468A (zh) 2018-09-28
WO2014153457A1 (en) 2014-09-25
JP2016518652A (ja) 2016-06-23
US20140289612A1 (en) 2014-09-25
CN104063401B (zh) 2018-02-02

Similar Documents

Publication Publication Date Title
TWI592807B (zh) Method and device for web style address merge
KR101824222B1 (ko) 동적 컨텐츠 및 스테일 컨텐츠를 포함하는 웹사이트들의 고속 렌더링
US9639631B2 (en) Converting XML to JSON with configurable output
CN104185845B (zh) 用于提供网页的二进制表示的系统和方法
JP5695027B2 (ja) Ａｊａｘウェブページコンテンツを取得する方法およびシステム
US8977606B2 (en) Method and apparatus for generating extended page snippet of search result
US20140201617A1 (en) Method for Browsing Web Page on Mobile Terminal
US9208255B2 (en) Method of converting data of database and creating XML document
CN103488732A (zh) 一种静态页面生成方法及装置
WO2011017929A1 (zh) 手机浏览器快速定位有效信息的方法与装置
CN105528369B (zh) 网页转码方法、装置以及服务器
CN110941950A (zh) 接口文档的生成方法、装置、服务器及存储介质
CN103577447A (zh) 一种用于确定目标页面的页面类型信息的方法和设备
CN103902571A (zh) 保存网页完整内容的方法、系统及相应的客户端和服务器
CN104156421B (zh) 页面的展现方法、装置及系统
WO2015154682A1 (zh) 一种网络请求处理方法、网络服务器和网络系统
CN113127776A (zh) 面包屑路径生成方法、装置及终端设备
US10095791B2 (en) Information search method and apparatus
US12056434B2 (en) Generating tagged content from text of an electronic document
CN104881453B (zh) 一种识别网页类型的方法和装置
JP5986896B2 (ja) Ｗｅｂ閲覧履歴管理装置及びプログラム
US10762279B2 (en) Method and system for augmenting text in a document
CN104965924B (zh) 一种数据存储方法及装置
US20240104106A1 (en) Data extraction cycles with multiple parsing frames
US20210357465A1 (en) Method and System for High Speed Serving of Webpages