丁 霞, 曾 成, 李琦琳
(1.河北工業(yè)大學(xué) 天津 300401;2.渤海石油職業(yè)學(xué)院 河北 任丘 062552)
目前,以計(jì)算機(jī)和軟件為核心的數(shù)字化技術(shù)取得迅猛發(fā)展,機(jī)頂盒、信息家電等新產(chǎn)品的出現(xiàn)讓人們開始關(guān)注嵌入式系統(tǒng),嵌入式瀏覽器也隨之開始被關(guān)注。瀏覽器主要完成實(shí)現(xiàn)下載網(wǎng)頁,解析網(wǎng)頁腳本語言,最后再合理的顯示給用戶的任務(wù)。 WAP(wireless Application Protocol),即無線應(yīng)用協(xié)議[1],亦稱無線互聯(lián)網(wǎng)協(xié)議。WAP協(xié)議的功能:用戶只要使用具有WAP功能的移動(dòng)終端諸如移動(dòng)電話之類的無線客戶端,就會(huì)像電腦IE、搜狗等PC瀏覽器一樣,查看各種網(wǎng)頁信息,展示Internet內(nèi)容。WAP由一系列通信協(xié)議組成。WAP的協(xié)議棧采用了層次化設(shè)計(jì),從而為應(yīng)用系統(tǒng)的開發(fā)提供了一種可伸縮和擴(kuò)展的環(huán)境。每層協(xié)議棧均定義了相應(yīng)的接口,可被上一層協(xié)議所使用,也可被其他服務(wù)或應(yīng)用程序所直接應(yīng)用。WAP的各層協(xié)議如圖1所示。
圖1 WAP協(xié)議層Fig.1 WAP protocol layer
本文分析了WAP嵌入式瀏覽器的主要功能模塊、工作流程、總體設(shè)計(jì),重點(diǎn)分析解析模塊和布局模塊,最后展望WAP瀏覽器發(fā)展未來。
一般情況下,嵌入式瀏覽器[2]包括兩個(gè)功能:一是支持如HTTP、WAP傳輸協(xié)議;二是能夠在嵌入式設(shè)備中運(yùn)行傳輸協(xié)議,并有標(biāo)記語言的功能以及能夠根據(jù)使用者的需求進(jìn)行處理各種情況。
如圖2所示,在本文設(shè)計(jì)中,瀏覽器主要模塊有:繪圖模塊、布局模塊、數(shù)據(jù)處理模塊、DOM樹模塊。這樣做的目的是確定分層體系結(jié)構(gòu),使每個(gè)層和相鄰的進(jìn)行交流,和不相鄰的不進(jìn)行交互,符合軟件工程“高內(nèi)聚,低耦合”的思想。其中:
圖2 功能模塊Fig.2 Function module
繪圖模塊:利用對(duì)XML文件解析的結(jié)果生成DOM樹和布局模塊(RENDER)樹,同時(shí)生成瀏覽器窗口及相應(yīng)的控件,并在屏幕上排版顯示。
布局模塊:對(duì)生成的DOM樹中得到樣式的有關(guān)信息,如居中,字體等,組織布局、顯示XML元素等內(nèi)容。數(shù)據(jù)處理模塊:數(shù)據(jù)處理模塊包括處理XML和images。對(duì)訪問的網(wǎng)頁XML文件進(jìn)行解析處理,包括表格、圖片、文字并生成相應(yīng)的DOM樹。
DOM樹模塊:DOM(文檔對(duì)象模型)[3]是 XML文件解析后的結(jié)果。它的內(nèi)容包括了當(dāng)前XML文件中所有的元素、元素的子元素、元素的屬性、元素的樣式、元素的事件等。在對(duì)象樹模型中,文件的每一節(jié)點(diǎn)都被稱為屬性。而且它是完整的,對(duì)文件最小細(xì)節(jié)它都允許進(jìn)行模型化而且可以訪問。它也是對(duì)修改最不敏感的一種模型。
數(shù)據(jù)從URL發(fā)出一個(gè)網(wǎng)頁請(qǐng)求,提交到通信模塊,通信模塊得到數(shù)據(jù)之后,交給數(shù)據(jù)處理模塊進(jìn)行解析,生成DOM樹,然后布局模塊會(huì)根據(jù)DOM樹上的節(jié)點(diǎn)進(jìn)行布局整理,同時(shí)將布局信息存儲(chǔ)到DOM樹中,最后繪圖模塊會(huì)對(duì)客戶端進(jìn)行繪制[4]。一般情況下,瀏覽器中看到的就是繪圖模塊的繪制效果。頁面訪問流程如圖3所示。
圖3 頁面訪問流程Fig.3 The flow chart of pages visit
在嵌入式瀏覽器設(shè)計(jì)時(shí)中考慮了C/S(Client/Server)結(jié)構(gòu),即客戶機(jī)和服務(wù)器結(jié)構(gòu)。它是軟件系統(tǒng)體系結(jié)構(gòu),通過它可以充分利用兩端硬件環(huán)境的優(yōu)勢(shì),將任務(wù)合理分配到Client端和Server端來實(shí)現(xiàn),降低了系統(tǒng)的通訊開銷。在此設(shè)計(jì)中,解析處理和文字布局均在server處理,最終顯示在client端。
獲得WML文件之后,開始讀取WML文件,獲取字符,判斷是否是“<”字符。如果是,就繼續(xù)判斷是否是標(biāo)簽開始符。如果是起始標(biāo)簽,獲取元素的屬性,比如屬性值和屬性名稱等,屬性由WML文檔的DTD定義。也就是程序自動(dòng)判斷是文本格式、圖片格式、表格格式、還是其他格式,根據(jù)格式類型進(jìn)行不同的解析。最后,將當(dāng)前狀態(tài)以及參數(shù)值進(jìn)行存儲(chǔ),依次循環(huán),直至循環(huán)結(jié)束,生成DOM樹。具體流程如圖4所示。
圖4 解析流程Fig.4 The flow chart of parse
所謂布局模塊,就是處理WML語法和DOM樹,樹的每個(gè)結(jié)點(diǎn)是一個(gè)對(duì)象,包含著對(duì)象的所有屬性設(shè)置信息。最后提交到繪圖模塊,由繪圖模塊進(jìn)行處理,顯示出來網(wǎng)頁信息。
2.2.1 文字布局
由圖2可知,布局層位于解析和繪圖之間,用來對(duì)語義分析后的文檔內(nèi)容進(jìn)行排版處理,將網(wǎng)頁內(nèi)容以適當(dāng)?shù)姆绞脚欧旁陲@示屏幕上。
WML語言[5]的文字排版控制較少,只有居中、左對(duì)齊和右對(duì)齊3種方式;其次WML語言的表達(dá)控制也很弱,只有em:加強(qiáng)(斜體)、strong:加重(斜體)、i:斜體、b:加粗、u:下劃線、big:大字體(字體加大一號(hào))、small:小字體(字體減小一號(hào))等7種文字表達(dá)方式。
2.2.2 圖片布局
img元素是圖片元素。一般情況下,img元素的src屬性值會(huì)是通過URL指向一個(gè)圖片,該圖片就是需要顯示的圖片,而img的排版[6]會(huì)優(yōu)先考慮其width屬性值和height屬性值,如果兩個(gè)屬性值都存在,則按照其屬性值中相應(yīng)的值進(jìn)行排版,顯示相應(yīng)的屬性值的圖片;如果僅有一個(gè)屬性值,則縮放實(shí)際照片的屬性值,顯示圖片;如果img元素沒有這兩個(gè)屬性,則排版的照片為實(shí)際寬高;當(dāng)僅有一個(gè)屬性值或沒有width屬性和height屬性時(shí),該img元素的排版會(huì)被跳過,同時(shí)相應(yīng)的圖片URL會(huì)進(jìn)入下載隊(duì)列,等待該圖片下載成功后,對(duì)當(dāng)前的頁面進(jìn)行重新排版[7]。
本文主要針對(duì)支持Java的嵌入式瀏覽器的設(shè)計(jì)與實(shí)現(xiàn)。系統(tǒng)以J2ME為開發(fā)平臺(tái),通信協(xié)議沒有采取HTTP協(xié)議,而是采取以WAP協(xié)議作為協(xié)議棧,以WML為標(biāo)記語言作為網(wǎng)頁數(shù)據(jù)的表現(xiàn)形式,在嵌入式瀏覽器中實(shí)現(xiàn)方便、豐富的多媒體信息瀏覽服務(wù)。
在仿真結(jié)果中,如圖5所示,圖片為訪問外網(wǎng)的百度頁面,而且有前進(jìn)、后退、刷新標(biāo)志,均說明此應(yīng)用能夠在嵌入式設(shè)備中實(shí)現(xiàn)。如果用戶為了節(jié)省流量,可以考慮切換到極簡(jiǎn)版本,也就是解析過程中沒有處理解析圖片,只是簡(jiǎn)單解析文字。由于HTML網(wǎng)頁中,百度logo圖片要大于屏幕大小,所以進(jìn)行壓縮之后進(jìn)行顯示。在此設(shè)計(jì)中,圖片下載完整,能夠完整顯示出來。
圖5 百度頁面Fig.5 Baidu page
通過測(cè)試,本瀏覽器的模塊可移植性很好,解決了傳統(tǒng)瀏覽器的可移植性困難以及帶寬比較窄、屏幕比較小的問題。同時(shí),該瀏覽器針對(duì)嵌入式系統(tǒng)應(yīng)用進(jìn)行特殊設(shè)計(jì),省去了一些不實(shí)用的、冗余的和影響系統(tǒng)效率的模塊 ,具有可移植性、運(yùn)行效率高等特點(diǎn)。
[1]WAP Forum wirless application protocol architecture specification[EB/OL].(2008-10).URL:http://www.wapforum.org/.
[2]魯強(qiáng),陳明.基于語義Web的WAP服務(wù)功能推薦模型[J].小型微型計(jì)算機(jī)系統(tǒng),2006(9):1-2.LU Qiang,CHEN Ming.Semantic Web based WAP service recommendation model[J].Journal of Chinese Computer System, 2006(9):1-2.
[3]王瑛,梁楚樵.嵌入式環(huán)境下的瀏覽器定制技術(shù)的實(shí)現(xiàn)[J].武漢理工大學(xué)學(xué)報(bào),2006(28):2.WANG Ying,LIANG Chu-qiao.WebBrowser customization in embedded system[J].Journal of Wuhan University of Technology , 2006(28):2.
[4]Webkit.The WebKit Open Projects [EB/OL].2010.http://webkit.org/.
[5]吳曉瓊,許劍勇.基于WAP的校友通訊錄模塊的設(shè)計(jì)和實(shí)現(xiàn)[J].計(jì)算機(jī)工程與應(yīng)用,2004(126):1-2.WU Xiao-qiong,XU Jian-yong.Design and implementation of alumni address list module based on WAP[J].Computer Engineering and Applications,2004(126):1-2.
[6]Nokia.Next generation mobile browsing:Rich and colorful
browsing for mobileusers.[EB/OL]2010.http://www.nokia.com.
[7]張申亞.基于Linux的嵌入式瀏覽器的設(shè)計(jì)及實(shí)現(xiàn)[J].信陽師范學(xué)院學(xué)報(bào),2007,10(4):499-514.ZHANG Shen-ya.Design and implementation ofan embedded browser Based on Linux[J].Journal of Xinyang Normal University,2007,10(4):499-514.