一種將互聯(lián)網(wǎng)站轉(zhuǎn)換為適合手機(jī)用戶瀏覽的風(fēng)格的技術(shù) ,更改歷史一、前言移動(dòng)互聯(lián)網(wǎng)的興起，使手機(jī)用戶逐漸形成用手機(jī)訪問(wèn)互聯(lián)網(wǎng)的習(xí)慣。但由于傳統(tǒng)互聯(lián)WEB 網(wǎng)站的界面和風(fēng)格，是為

一種將互聯(lián)網(wǎng)站轉(zhuǎn)換為適合手機(jī)用戶瀏覽的風(fēng)格的技術(shù)

更改歷史

一、前言

移動(dòng)互聯(lián)網(wǎng)的興起，使手機(jī)用戶逐漸形成用手機(jī)訪問(wèn)互聯(lián)網(wǎng)的習(xí)慣。但由于傳統(tǒng)互聯(lián)WEB 網(wǎng)站的界面和風(fēng)格，是為PC 屏幕而設(shè)計(jì)的，即使手機(jī)上安裝了可閱讀HTML 格式網(wǎng)頁(yè)的瀏覽器，但網(wǎng)頁(yè)在手機(jī)屏幕上顯示的效果仍然很難看，用戶體驗(yàn)很差，因此，傳統(tǒng)互聯(lián)網(wǎng)站的所有者不得不專門為手機(jī)用戶開(kāi)發(fā)專門的手機(jī)網(wǎng)站。但開(kāi)發(fā)新的手機(jī)網(wǎng)站需投入較高的開(kāi)發(fā)成本，并需要專門的服務(wù)器和網(wǎng)絡(luò)條件，因此，手機(jī)網(wǎng)站建設(shè)難以得到推廣，普通手機(jī)用戶只能面臨豐富的互聯(lián)網(wǎng)資源而無(wú)法訪問(wèn)。

本文提出了一種新型的網(wǎng)頁(yè)轉(zhuǎn)換技術(shù)，可以較低的成本將互聯(lián)網(wǎng)WEB 網(wǎng)站轉(zhuǎn)換成適合手機(jī)屏幕瀏覽的界面風(fēng)格，而且無(wú)需互聯(lián)網(wǎng)站投入新的服務(wù)器設(shè)施和租用網(wǎng)絡(luò)。

二、基本原理

本技術(shù)采用了HTTP 反向代理服務(wù)器的類似技術(shù)。在互聯(lián)網(wǎng)上需部署一臺(tái)服務(wù)器，稱為W2M 代理服務(wù)器，傳統(tǒng)互聯(lián)網(wǎng)站（稱為源WEB 網(wǎng)站如www.sina.com ），需將其手機(jī)網(wǎng)站域名（稱為手機(jī)網(wǎng)站，如sina.cn ）解析到該服務(wù)器的IP 地址上。當(dāng)手機(jī)用戶訪問(wèn)手機(jī)網(wǎng)站域名時(shí)，W2M 代理服務(wù)器將Http 請(qǐng)求轉(zhuǎn)發(fā)到源WEB 網(wǎng)站，源WEB 網(wǎng)站返回WEB 網(wǎng)頁(yè)內(nèi)容給W2M 代理服務(wù)器，由于該網(wǎng)頁(yè)只適合PC 屏幕瀏覽，因此，W2M 代理服務(wù)器按事先設(shè)置的規(guī)則，將該網(wǎng)頁(yè)重新組織成適合手機(jī)屏幕瀏覽的內(nèi)容，發(fā)回給手機(jī)瀏覽器，手機(jī)瀏覽器將網(wǎng)頁(yè)展現(xiàn)給用戶。如下圖所示：

三、技術(shù)架構(gòu)

W2M 代理服務(wù)器的架構(gòu)如下所示：

手機(jī)瀏覽器

上圖展現(xiàn)了手機(jī)瀏覽器發(fā)出對(duì)手機(jī)網(wǎng)站的請(qǐng)求，到接收到手機(jī)網(wǎng)站內(nèi)容的整個(gè)過(guò)程中，W2M 代理服務(wù)器內(nèi)各模塊的工作流程。主要的流程如下：

1. 手機(jī)瀏覽器提交對(duì)手機(jī)網(wǎng)站的網(wǎng)頁(yè)的HTTP 請(qǐng)求，由于手機(jī)網(wǎng)站的域名被映射到

W2M 代理服務(wù)器，因此請(qǐng)求發(fā)送到W2M 服務(wù)器的HTTP 請(qǐng)求接入模塊；

2. HTTP 請(qǐng)求接入模塊獲取到HTTP 請(qǐng)求，，該請(qǐng)求的HTTP 頭信息中包含了手機(jī)

網(wǎng)站域名和請(qǐng)求的網(wǎng)頁(yè)URL ，以及其他信息，比如Cookie ，會(huì)話信息等，并將該請(qǐng)求提交給HTTP 請(qǐng)求解析模塊處理。

3. HTTP 請(qǐng)求解析模塊通過(guò)分析手機(jī)網(wǎng)站域名和請(qǐng)求的網(wǎng)頁(yè)URL ，從系統(tǒng)內(nèi)部的源

網(wǎng)站網(wǎng)址映射表中得到源網(wǎng)站的域名；將HTTP 請(qǐng)求消息頭的Host 改成源網(wǎng)站域名，Accept 改成標(biāo)準(zhǔn)PC 瀏覽器的HTTP 請(qǐng)求的對(duì)應(yīng)Accept 數(shù)值。轉(zhuǎn)交給源網(wǎng)站請(qǐng)求模塊；

4. 源網(wǎng)站請(qǐng)求模塊與源網(wǎng)站建立起HTTP 連接，將請(qǐng)求轉(zhuǎn)發(fā)給源網(wǎng)站，源網(wǎng)站對(duì)該

請(qǐng)求視作標(biāo)準(zhǔn)PC 瀏覽器的HTTP 請(qǐng)求，返回網(wǎng)頁(yè)或圖片等資源的HTTP 響應(yīng)消息。

5. 源網(wǎng)站請(qǐng)求模塊將HTTP 響應(yīng)消息提交給WEB 數(shù)據(jù)提取模塊處理，如果該HTTP

響應(yīng)消息是網(wǎng)頁(yè)文本內(nèi)容，則該網(wǎng)頁(yè)中大量用于PC 瀏覽器布局處理和樣式展現(xiàn)的HTML 文本應(yīng)該過(guò)濾掉，只需要保留對(duì)用戶有用的信息內(nèi)容數(shù)據(jù)（比如新聞頁(yè)面中真正有價(jià)值的是新聞標(biāo)題、內(nèi)容和相關(guān)鏈接等信息內(nèi)容數(shù)據(jù)）。因此WEB 數(shù)據(jù)提取模塊根據(jù)HTTP 響應(yīng)消息對(duì)應(yīng)的請(qǐng)求URL ，從WEB 資源數(shù)據(jù)提取規(guī)則庫(kù)里獲得對(duì)該URL 的網(wǎng)頁(yè)解析規(guī)則，按規(guī)則的要求，對(duì)HTTP 響應(yīng)消息體進(jìn)行信息內(nèi)容數(shù)據(jù)提取。如果該HTTP 響應(yīng)消息是非文本信息，比如圖片，那么圖片數(shù)據(jù)就是信息內(nèi)容數(shù)據(jù)。

6. 提取出來(lái)的信息內(nèi)容數(shù)據(jù)被轉(zhuǎn)交給手機(jī)展現(xiàn)內(nèi)容生成模塊，手機(jī)網(wǎng)頁(yè)展現(xiàn)模塊對(duì)

網(wǎng)頁(yè)的信息內(nèi)容，用對(duì)應(yīng)的手機(jī)網(wǎng)頁(yè)模板進(jìn)行裝載處理，形成適合手機(jī)瀏覽器閱讀的手機(jī)網(wǎng)頁(yè)。如果該信息內(nèi)容數(shù)據(jù)時(shí)圖片，就將圖片進(jìn)行尺寸縮略和體積壓縮，以免超出手機(jī)屏幕顯示范圍。

7. 該手機(jī)展現(xiàn)數(shù)據(jù)要提交給HTTP 響應(yīng)生成模塊，組成手機(jī)瀏覽器可識(shí)別的HTTP

消息頭和消息體，這就是手機(jī)瀏覽器請(qǐng)求的URL 對(duì)應(yīng)的HTTP 回應(yīng)消息；

8. HTTP 回應(yīng)消息被轉(zhuǎn)交給HTTP 請(qǐng)求接入模塊，準(zhǔn)備返回給手機(jī)瀏覽器；

9. 該HTTP 回應(yīng)消息被保存在HTTP 響應(yīng)消息緩存模塊中，被設(shè)定緩存一定時(shí)間，

以備后用；

10. HTTP 請(qǐng)求接入模塊將HTTP 響應(yīng)消息返回給手機(jī)瀏覽器，該響應(yīng)消息內(nèi)容是專

門為手機(jī)瀏覽器進(jìn)行定制適配的網(wǎng)頁(yè)內(nèi)容，所以，展現(xiàn)效果更適合用戶體驗(yàn)，整

個(gè)流程至此完成。

11. 為了提高手機(jī)用戶訪問(wèn)網(wǎng)站的速度，如果手機(jī)用戶訪問(wèn)的是之前曾訪問(wèn)過(guò)的同一

個(gè)網(wǎng)頁(yè)（或圖片），那么HTTP 請(qǐng)求解析模塊會(huì)從HTTP 響應(yīng)緩存中拿到緩存的

網(wǎng)頁(yè)響應(yīng)消息。

12. 該網(wǎng)頁(yè)響應(yīng)消息被送往HTTP 請(qǐng)求接入模塊，立即返回給手機(jī)瀏覽器，大大提高

響應(yīng)速度。

四、關(guān)鍵技術(shù)

4.1 HTTP請(qǐng)求接入模塊

HTTP 請(qǐng)求接入模塊是連接手機(jī)用戶和W2M 代理服務(wù)器直接網(wǎng)絡(luò)通訊的模塊，要具備同時(shí)維持成千上萬(wàn)個(gè)手機(jī)網(wǎng)絡(luò)客戶端的能力。該模塊性能的好壞，直接影響著可同時(shí)服務(wù)的用戶數(shù)的多少以及用戶對(duì)響應(yīng)速度的感受。

因此，可利用為成熟的WEB 服務(wù)器掛接Proxy 模塊的思路來(lái)實(shí)現(xiàn)HTTP 請(qǐng)求接入模塊，由于WEB 服務(wù)器，例如IIS,Apache ，本身就擁有穩(wěn)定的大規(guī)模用戶訪問(wèn)接入能力，只要WEB 服務(wù)器將HTTP 請(qǐng)求轉(zhuǎn)交給Proxy 模塊，Proxy 模塊就可以處理后續(xù)的HTTP 請(qǐng)求處理操作。所有與手機(jī)瀏覽器之間的連接維護(hù)工作都交由WEB 服務(wù)器來(lái)處理。

4.2 WEB資源數(shù)據(jù)提取規(guī)則模型

WEB 資源是指URL 所指向的網(wǎng)站對(duì)象，一般包括網(wǎng)頁(yè)、圖片、Flash 、ActiveX 控件、音像文件、Javascript 腳本、樣式表、各種可下載的文件等等。WEB 資源數(shù)據(jù)提取規(guī)則是根據(jù)資源的數(shù)據(jù)特點(diǎn)定義出的規(guī)則，便于WEB 數(shù)據(jù)提取模塊，將必要的信息內(nèi)容數(shù)據(jù)抽取出來(lái)，用于手機(jī)展示。

由于本技術(shù)主要是為了解決傳統(tǒng)資訊網(wǎng)頁(yè)在手機(jī)屏幕的適配展示，所以，對(duì)于網(wǎng)頁(yè)、圖片

等網(wǎng)站資源要進(jìn)行比較復(fù)雜的轉(zhuǎn)換規(guī)則設(shè)計(jì)，對(duì)于其他資源類型，不必做轉(zhuǎn)換處理，原樣返回給手機(jī)瀏覽器自行處理即可。

4.2.1 網(wǎng)頁(yè)數(shù)據(jù)提取規(guī)則

每一個(gè)要適配的源網(wǎng)站網(wǎng)頁(yè)都要定義一套提取規(guī)則，一般而言，網(wǎng)頁(yè)的規(guī)則用網(wǎng)頁(yè)的網(wǎng)站Id 站內(nèi)URL 地址作為關(guān)鍵字來(lái)標(biāo)示，但對(duì)于動(dòng)態(tài)網(wǎng)頁(yè)而言，雖然參數(shù)不同，但實(shí)際上網(wǎng)頁(yè)的數(shù)據(jù)展現(xiàn)方式是一樣的，所以，網(wǎng)頁(yè)的規(guī)則可以用URL 的正則表達(dá)式來(lái)區(qū)別。

網(wǎng)頁(yè)內(nèi)有眾多信息內(nèi)容塊，比如一段文字，一組類似于新聞列表那樣的文章標(biāo)題，這些信息內(nèi)容在網(wǎng)頁(yè)的HTML 代碼中，都以特定的代碼開(kāi)頭，以特定的代碼結(jié)尾，所以，通過(guò)分析HTML 代碼，可以提取出這些信息內(nèi)容塊。因此一個(gè)網(wǎng)頁(yè)的數(shù)據(jù)提取規(guī)則是由多個(gè)信息內(nèi)容塊定義組成的。信息內(nèi)容塊類型分為單塊圖文，標(biāo)題列表。

單塊圖文內(nèi)容塊定義

單塊圖文如上圖所示，要提取單塊圖文的信息，要有以下定義信息：

1. 內(nèi)容塊說(shuō)明：用于標(biāo)示某個(gè)內(nèi)容塊的說(shuō)明，比如：首頁(yè)活動(dòng)預(yù)告

2. 內(nèi)容塊前置特征HTML 代碼：即從頁(yè)面中的HTML 中，自從該段HTML 之后，就

是內(nèi)容塊的HTML 代碼內(nèi)容的開(kāi)始。

3. 內(nèi)容塊后置特征HTML 代碼：即內(nèi)容塊的HTML 代碼內(nèi)容至該段HTML 就結(jié)束了。

4. 替換目標(biāo)特征HTML 代碼（零或多項(xiàng)）：即內(nèi)容塊中要使用替換為HTML 來(lái)替換掉

的HTML 代碼；

5. 替換為HTML 代碼（與替換目標(biāo)特征HTML 代碼數(shù)量一樣）：即替換目標(biāo)HTML

代碼的內(nèi)容。留空值意味著只過(guò)濾掉替換目標(biāo)HTML 代碼；

6. 保留內(nèi)容中a 標(biāo)簽超鏈接：是或否，如果否，則內(nèi)容中的a 標(biāo)簽被過(guò)濾掉；

單塊內(nèi)容塊的img 圖片標(biāo)簽一般保留，手機(jī)瀏覽器看到該標(biāo)簽時(shí)，會(huì)再次向W2M 代理服務(wù)器發(fā)出圖片請(qǐng)求，再下載圖片。關(guān)于圖片資源的數(shù)據(jù)提取規(guī)則后面章節(jié)解釋。

標(biāo)題列表內(nèi)容塊定義

標(biāo)題列表內(nèi)容塊例

1

標(biāo)題列表內(nèi)容塊例2

標(biāo)題列表內(nèi)容塊例3

從以上例子可看出，標(biāo)題列表內(nèi)容塊的特點(diǎn)是，列表中只顯示信息的部分內(nèi)容，要看更詳細(xì)的內(nèi)容，要點(diǎn)擊進(jìn)入另外一個(gè)詳細(xì)內(nèi)容頁(yè)面，才能看到。而該詳細(xì)內(nèi)容頁(yè)面一般由單塊圖文內(nèi)容塊組成，如下圖所示：

標(biāo)題列表內(nèi)容塊的詳細(xì)內(nèi)容頁(yè)面示例

因此，標(biāo)題列表內(nèi)容塊的信息要提取出來(lái)，要有以下定義：

1. 內(nèi)容塊說(shuō)明：用于標(biāo)示某個(gè)內(nèi)容塊的說(shuō)明，比如：首頁(yè)活動(dòng)預(yù)告

2. 內(nèi)容塊前置特征HTML 代碼：即從頁(yè)面中的HTML 中，自從該段HTML 之后，就

是內(nèi)容塊的HTML 代碼內(nèi)容的開(kāi)始。

3. 內(nèi)容塊后置特征HTML 代碼：即內(nèi)容塊的HTML 代碼內(nèi)容至該段HTML 就結(jié)束了。

4. 替換目標(biāo)特征HTML 代碼（零或多項(xiàng)）：即內(nèi)容塊中要使用替換為HTML 來(lái)替換掉

的HTML 代碼；

5. 替換為HTML 代碼（與替換目標(biāo)特征HTML 代碼數(shù)量一樣）：即替換目標(biāo)HTML

代碼的內(nèi)容。留空值意味著只過(guò)濾掉替換目標(biāo)HTML 代碼；

6. 標(biāo)題圖片標(biāo)簽特征HTML 代碼：如果列表中有圖片，則通過(guò)該特征HTML 代碼可

以提取img 標(biāo)簽的內(nèi)容；

7. 詳細(xì)內(nèi)容頁(yè)面鏈接a 標(biāo)簽特征HTML 代碼：通過(guò)該特征代碼提取鏈接到詳細(xì)內(nèi)容頁(yè)