基于開源瀏覽器技術的客戶端平臺設計

宗蓮松

(西華大學 教務處，成都 610039)

應用軟件的設計方法通常被劃分為B/S(瀏覽器/服務器)與C/S(客戶端/服務器)2種，其主要的區別在于是否通過Web頁面來實現應用與用戶的交互。某個應用應該采用哪一種方式進行開發主要取決于這2種方法的各自優勢，通常可以通過評估其實現軟件3層結構(表現層、業務邏輯層、數據訪問層)中每一層的可行性和代價來決定。此外Web與C/S客戶端還具有許多細節上的差異，例如在網絡通信方面Web能夠通過標準的HTTP/HTTPS接口大大降低數據傳輸的開發成本，而傳統客戶端則在即時通信和流媒體等領域扮演著重要角色。

網頁瀏覽器是一個非常復雜的客戶端軟件，它在傳統客戶端軟件的基礎上通過支持Web標準完成對Web技術的支撐，成為B/S與C/S軟件開發方式劃分的邊界。瀏覽器軟件屬于C/S軟件的范疇，因為通常情況下它實現了Web技術所依賴的基礎卻并不應用Web技術來實現附加功能，而如果突破這一限制將能夠充分利用B/S與C/S的優勢打造可以快速開發復雜應用的軟件平臺。本文提出了一種將Web技術與傳統客戶端軟件相結合的新的軟件平臺，以支撐各種不同的客戶端應用。

1 開源瀏覽器技術在客戶端軟件中的應用現狀

Web技術，特別是由于Web UI和JavaScript腳本在軟件開發過程中的優勢，使其在PC與移動客戶端的應用越來越多，與應用的整合也越來越深入。

在PC客戶端應用中，應用Web技術的主要方式是嵌入Web控件，常見于RSS、電子郵件、Blog客戶端以及即時通信和Web開發工具中。在Windows平臺上可以通過在應用程序中嵌入IE控件來實現;而Qt WebKit作為Qt開源項目的一部分，更提供了跨平臺實現的能力［1］。控件的作用主要在于輔助界面展現，而沒有充分利用JavaScript腳本的動態語言特性來簡化業務實現和提高開發效率。

基于FireFox瀏覽器的XUL則將Web技術而不是原生代碼作為客戶端業務邏輯的主體，通過XULRunner解析并運行由XML、DOM、CSS、JavaScript所構成的應用，也能夠與原生代碼通過XPCOM對象機制進行交互，一定程度上實現了簡化客戶端應用開發的“平臺”能力［2-3］。但是XUL仍然具有其局限性，主要適用于UI事件驅動的應用。

在移動客戶端平臺上，PhoneGap能夠為Android、iOS等系統提供只使用JavaScript和HTML5/CSS3就能夠開發移動平臺桌面應用的能力，同時提供訪問移動硬件平臺(如加速傳感器和攝像頭)的接口。

相比傳統的整合方式，Web操作系統(如Chrome OS)建立在平臺思想上，盡管脫離了當前意義上的客戶端軟件范疇，卻提供了更為理想的客戶端軟件開發和運行環境，在功能完備的基礎上大大降低了開發成本、提供更自然的用戶交互模式并增強了安全性等優勢。

2 腳本驅動的客戶端軟件平臺及其應用模型

為了降低客戶端開發成本，可以充分利用Web技術與JavaScript腳本的動態語言優勢構建一個客戶端平臺運行環境(而不是應用本身)，通過它來加載和運行實際的客戶端業務邏輯代碼，并為應用提供基礎的開發接口和運行環境，如圖1所示。

圖1 新的客戶端平臺應用模型

在新的軟件平臺中，定義平臺的設計目標和應用規則如下(也是與前述Web技術在客戶端軟件中應用模式的主要區別):1)客戶端平臺本身并不實現具體的功能特性和業務邏輯，只為應用的實現提供幫助;2)應用本身采用更接近于Web開發的方式，盡可能減少原生代碼開發以提高開發效率;3)應用可以在不編寫原生代碼的條件下，以客戶端軟件的形式實現Web應用的功能;4)每一個用戶界面都以一個Web頁面進行展現，必要時嵌入原生UI，而不是在客戶端界面中嵌入Web控件的傳統方案;5)能夠實現與原生代碼的交互以使用操作系統平臺相關的能力。

相對于原生代碼JavaScript腳本的特性更適合描述業務邏輯流程，原生代碼適合實現平臺相關特性和較大運算量的算法細節。在新的客戶端軟件平臺中，通過用JavaScript腳本替代原生代碼作為業務邏輯入口，在保持清晰的業務邏輯的同時提高開發效率［4］。

新的平臺保留Web開發中的所有關鍵開發方法，包括HTML、CSS、DOM及JavaScript，能夠快速地將Web應用移植到該客戶端軟件平臺中。這既能夠增加Web應用的交互性，也能夠隨客戶端發布避免Web應用為兼容不同瀏覽器的額外工作，同時可以借助原生代碼的支持實現Web應用無法實現的功能。

與瀏覽器運行環境不同，客戶端軟件需要自主決定是否及何時顯示交互界面，業務邏輯的運行需要能夠脫離可視化的網頁范圍。同時，客戶端軟件的行為方式也需要脫離單個頁面框架的束縛，可以由多個窗體共同完成客戶端軟件功能并對每個窗體有比在瀏覽器中更強的控制能力(例如窗體的模態與非模態)。因此，需要使JavaScript能夠脫離HTML單獨運行，并增加能夠由JavaScript控制的窗體對象和多窗體的界面體系。為了簡化界面框架的設計，可以限定每個窗體僅由一個Web頁面來表現(這并不會影響UI的靈活性，因為仍然可以在頁面中使用內嵌的界面元素)。

客戶端軟件應該不被局限只在網絡環境下運行，但同時能夠讓HTML訪問本地資源能夠像通過HTTP訪問網絡資源一樣方便，這在Chromium的體系中可以通過實現新的URI Scheme來完成，將URI(統一資源標識符)地址源映射到本地限定的HTML及其他資源，這樣做同時也增強了對本地資源的安全保護，頁面并不能利用這個途徑無限制地訪問任意資源。

最核心的需求是為實現復雜多變的客戶端業務邏輯建立一套規則的開發模型，包括降低JavaScript與原生代碼實現互相調用及傳遞參數與對象的成本、為事件觸發同步回調或異步通知的支持以及實現靈活的線程模型。

以展現一個客戶端即時通信工具的登錄界面為例，希望主體的工作流程能夠在平臺基礎上用JavaScript代碼控制:

在這個示例中，客戶端平臺首先加載一段 JavaScript腳本并運行，平臺中內嵌了 JavaScript對象“Modules”，并允許腳本代碼通過它加載其他通過原生代碼或腳本所擴展的JavaScript對象“ui”并調用相應的方法ShowModalUI顯示一個Web界面，參數指定訪問經過URI Scheme映射的本地資源login/login.html。UI框架經過擴展后，login.html能夠在頁面中嵌入其他JavaScript腳本控制新窗體的位置、大小及風格。

通過對客戶端應用需求的分析，可以對用例描述采用動名結構的方式分離出所涉及的主要對象:WebUI、JavaScript業務邏輯、原生代碼所對應的JavaScript接口、URI Scheme以及客戶端平臺預先內嵌的JavaScript對象。客戶端平臺的職責則是需要完成對其中每一類對象及對象間關系的管理。

3 框架設計與實現

圖2 基于Chromium的客戶端軟件平臺結構示意圖

通過分析客戶端平臺的應用模型，構建平臺需要實現的要素包括:1)脫離頁面環境加載并運行JavaScript腳本;2)為腳本環境內置必需的JavaScript對象;3)能夠將原生代碼封裝為JavaScript對象或接口供 JavaScript腳本調用［5］;4)提供原生代碼到JavaScript的回調或事件通知的途徑［6］;5)實現訪問本地資源的URI Scheme;6)以擴展JavaScript對象的方式提供Web UI窗體支持。

Chromium是基于WebKit內核的Chrome瀏覽器的開放源代碼項目名稱，其發布版本被分為Chromium Dev開發版本和官方Chrome瀏覽器版本。WebKit由網頁渲染引擎WebCore和JavaScript腳本引擎JavaScriptCore構成。Chromium基于WebKit之上進行擴展，具備許多優點:跨平臺、多進程架構、利用高效的V8 JavaScript引擎替換JavaScriptCore、實現了NPAPI插件體系、GPU加速、很好地支持HTML5標準等等。

在Chromium內部包含了構建客戶端平臺的基礎技術，例如JavaScript腳本與原生代碼的交互，對其進行適當的改造能夠符合預期，下面將基于Chromium的框架進一步闡述新的客戶端軟件平臺的設計重點。在新的平臺設計中，能夠依賴于Chromium框架的主要內容在于使用WebKit展現可視化界面、通過JavaScript腳本引擎實現腳本與原生代碼的交互、以及為本地資源定義URI路徑以實現脫離對網絡環境的依賴，平臺與開源Chromium的關系如圖2所示。

由于Chromium中使用V8替代WebKit自帶的JSCore作為JavaScript腳本引擎，因此大多數需要在JavaScript與原生代碼之間進行的交互的接口可以通過V8所提供的能力來實現。V8通過腳本運行環境上下文來控制JavaScript對象在腳本中是否能夠被訪問，每個頁面都有相應的腳本環境，也可以顯式的構造一個上下文使JavaScript脫離頁面運行［7］。下面是利用V8腳本引擎執行JavaScript腳本的代碼片斷:

V8使用一種通過將JavaScript腳本注入到在腳本環境中的特殊方式來注冊腳本對象與接口，V8引擎在腳本的語法解析過程中如果遇到native function的聲明將會通過相應的接口根據所提供的函數名稱查詢對應的原生代碼是否存在。以下代碼片斷用于在特定的JavaScript運行環境上下文中內置Modules對象并將Modules.Load方法與原生代碼通過名稱LoadModule進行關聯，如果查找到對應的原生代碼接口會在調用時將JavaScript參數以其C++的封裝形式傳遞給原生代碼:

對本地資源的URI定義可以通過Chromium中的URLRequest::RegisterProtocolFactory接口來實現，在頁面請求一個指定的URI時，Chromium通過已注冊的URI協議規則生成對應的URLRequestJob，因此能夠在所注冊的ProtocolFactory中生成自定義的URLRequestJob以控制對資源的訪問。由于瀏覽器基于同源策略控制Web資源訪問的安全性，在實現URI Scheme注冊后還需要將對應的URI訪問添加到SecurityOrigin的白名單中。

因為Chromium對HTML5提供良好的支持，HTML5標準中有關WebWorker的定義能夠幫助我們簡化在JavaScript腳本中對應用程序線程模型的控制，關于自定義事件的定義則能夠通過在JavaScript中調用addEventListener來簡化對原生代碼與腳本間的異步事件通知機制的設計。

4 結語

Web技術伴隨互聯網應用的普及得到了廣泛應用和快速發展，新的Web標準增強了網頁的視覺表現能力和業務處理能力。Web技術正在逐步實現以前只能由客戶端代碼才能完成的任務，同時客戶端開發工具也越來越多地將網頁相關的技術結合起來以提升開發效率和用戶體驗，人們越來越多地認識到兩者的優勢并加以應用。和其他開源項目一樣，瀏覽器的開源項目能夠為人們在軟件設計方法和實踐中提供很多有價值的參考，利用瀏覽器作為B/S與C/S開發邊界的角色，深入挖掘瀏覽器技術對于合理利用Web與傳統技術優勢、理解Web操作系統的設計目標等有著一定的參考作用。

［1］宋杰，曹竹冬.基于Qt/Embedded的Web瀏覽器的設計與實現［J］.計算機與現代化，2010(10):136-138.

［2］吳谷，章炯民.基于XUL開發富客戶端應用程序［J］.電腦知識與技術，2006(1):135-137.

［3］戚艷軍，李繼玲.圖形界面開發語言XUL應用研究［J］.計算機技術與發展，2007(3):233-235.

［4］劉春梅，孫鵬，胡琳琳.基于JavaScript引擎的終端動態數據處理方法［J］.微計算機應用，2010，31(4):25-30.

［5］蔣章概，陳榕.基于CAR構件的WebKit本地擴展策略［J］.計算機應用，2009(12):195-197.

［6］宋國瑞，何宗鍵.基于Windows CE平臺的Widget引擎中JavaScript解析器和JSBinding研究［J］.軟件導刊，2010(12):12-14.

［7］岳坐剛，張凱兵.基于WEB服務的框架結構分析［J］.西華大學學報:自然科學版，2004(S1):13-15.