W3C Widget配置與打包是本文要介紹的內容，主要是來了解并學習W3C Widget的應用，看本文詳解W3C Widget的配置與打包操作，來看內容詳解。

了解W3C Widgets候選規范

NathanA.Good居住在明尼蘇達州的雙子城。他的專長是軟件開發、軟件架構和系統管理。平時不編寫軟件時，他喜歡組裝PC和服務器、閱讀和撰寫技術文章，并鼓勵他的所有朋友轉用開源軟件。他是許多書籍和文章的作者或合著者，包括

ProfessionalRedHatEnterpriseLinux3,RegularExpressionRecipes:AProblem-SolutionApproach和FoundationsofPEAR:RapidPHPDevelopment。 

(AnIBMdeveloperWorksContributingAuthor)

World Wide Web Consortium(W3C)的“Widget打包和配置”規范目前仍處于候選推薦狀態。Widget是一種在Hyper text Markup Language(HTML)中使用的新興技術，它可用于實現移動設備和網站的富Web應用元素。它們打包成壓縮文件（.zip），可以將一種MultipurposeInternetMailExtensions(MIME)類型的應用或Widget部署在HTML文件中。本文將深入探討這個規范，闡述Web應用開發人員可以怎樣使用它，它的好處有哪些。

W3C“Widget打包和配置”規范是一個新興的用于配置、打包和部署Widget的規范。W3C Widget由HTML、層疊樣式表（CSS）、JavaScript文件和其它資源組成，如圖片。我們可以在設備中使用Widget實現一些小型應用，如日歷、天氣預報、聊天等等。

相對于普通的Web應用，使用Widget的優點在于它們可以一次下載，然后多次使用，這類似于安裝在設備上的非Web應用。這可以讓用戶節省帶寬，因為它們所傳輸的數據只是Widget使用的數據，而不包括Widget文件本身。

Widget通常都實現了富用戶體驗，如交互式日歷，甚至是游戲。我們可以在移動設備上使用Widget，而Widget的一次下載、重復使用的優點可以節省數據傳輸的花費。

從2010年1月起，W3C“Widget打包和配置”規范（見參考資料中的完整規范的鏈接）就處于候選推薦狀態。這表示W3C認為這個規范已經處于穩定狀態，并鼓勵開發人員實現這個規范。

W3C Widget規范的目標是提出一個創建和打包Widget的標準。目前有許多不同的供應商支持Widget（見參考資料），并且他們幾乎都實現了它們自己的私有應用程序接口（API）和打包格式。

本文將介紹W3C的打包和配置規范，介紹我們可以怎樣將HTML、CSS和JavaScript文件打包成一個可以部署到實現W3CWidget規范的設備的Widget。因為這是一個新興的規范，支持Widget渲染的設備實現還是很有限的。如果希望看到Widget的實際運行，同時還沒有安裝這些應用，我們就需要先下載這些具體的應用。

要查看W3CWidget包的運行，我們需要：

實現W3C Widget規范的軟件。本文使用的是ApacheWookie，它是一個ApacheIncubator項目，它的作用是作為了W3C Widget內容服務器，用戶可以用它來部署W3C Widget。

一個創建Widget壓縮文件包的工具。

用于下載和安裝ApacheWookie的Subversion(SVN)客戶端。

目前市面上有許多不同版本的Widget和Gadget，所以有時很難分辨這些技術之間的區別。Widget技術的差別增加了創建可重用富用戶Web組件的難度。

Widget與Gadget

根據本文的撰寫目的，Widget和Gadget表示的是相同的意思—可以像應用一樣安裝和運行在本地的小型組件。本文采用的是與供應商相對應的方式來使用Widget或Gadget。例如，如果是W3C產品，我們稱為Widget，而對于Google的產品，我們則稱為Gadget。

除了Microsoft®Windows®VistaGadgets和Apple®Widgets，類似的技術還包括GoogleWaveGadgets、OpenSocial和OpenAjax。這些技術都有自己的API和規范（見參考資料）。

GoogleWaveGadgets

GoogleWaveGadgets概念上類似于W3C Widgets，但是前者只是用在GoogleWaveWeb應用中。相反，W3C Widgets則是由W3C發布的一個規范，是公開的，可以被不同的供應商使用。

GoogleWave是一個Web應用，目前處于對開發人員和早期希望學習這個技術的用戶開放的有限預覽的階段。GoogleWave主要是一個社交工具，它以GoogleWaveGadgets的方式向用戶提供不同的功能。開發人員可以創建Gadgets向Wave用戶提供特定的功能。

OpenSocial

OpenSocial是一個API，它可以用來創建能運行在社交網絡Web應用中的Gadgets。OpenSocial1.0規范目前正處于預覽階段，而0.9版本和0.8.1版本已經在各種containers（使用Gadgets的Web應用）中使用了，如iGoogle、MySpace、Yahoo和LinkedIn。

OpenSocialGadgets是基于GoogleGadgets框架的。OpenSocial框架包括預先寫好的JavaScriptsAPI，我們可以使用這些API來操作人、活動和持久化等數據。

OpenSocial是另一種備受關注的創建Gadgets的方法。

OpenAjax

OpenAjax是“一個專注于成功應用開放和互操作的基于AjaxWeb技術的組織。它由主流供應商、開放源碼項目和使用AsynchronousJavaScript+XML(Ajax)技術的公司所組成”（見參考資料）。

OpenAjaxHub提供的發布和訂閱（pub/sub）技術可以在OpenSocialGadgets中使用。

由于OpenAjax基于W3C打包和配置規范創建的Widgets能夠使用Ajax，因此它是創建能改進互操作性的Widgets的一個非常好的技術。我們可以創建即使用OpenAjax又符合W3C Widget規范的Widgets。

ApacheWookie

ApacheWookie是一個ApacheSoftwareFoundation的孵化項目，它能夠同時作為GoogleWaveGadgets和W3C Widget包的服務器。ApacheWookie是一個服務器應用，可以作為一個Web應用下載安裝，或者作為單獨的服務器運行。

獲取ApacheWookie源代碼也是查看W3C Widget源代碼的一種很好的方法。

目前官方網站（見參考資料）上還沒有預編譯好的ApacheWookie二進制包，所以需要安裝SVN才能下載和運行ApacheWookie。使用清單1中顯示的簡單命令就可以下載ApacheWookie。

清單1.下載ApacheWookie

$svncohttp://svn.apache.org/repos/asf/incubator/wookie/trunk 

在下載ApacheWookie后，我們可以通過輸入清單2中顯示的命令來將它作為了一個獨立服務器運行：

清單2.以獨立模式運行ApacheWookie

$antrun 

ant命令會以獨立模式啟動ApacheWookie服務器。在服務器啟動后，我們可以通過這個地址訪問Widgets：http://localhost:8080/wookie/。

#p#

Widget配置

創建一個Widget，首先要創建一個以Widget名稱命名的目錄，如：myWidget。（在允許使用帶點文件名的操作系統上，可以使用myWidget.wgt。）我們將會把新的Widget文件放到這個目錄中。如果想要創建和測試新的HTML、CSS和JavaScript文件，我們可以把這個目錄創建在Web服務器的文檔根目錄下，這樣我們就可以在打包Widget前通過瀏覽器查看HTML文件。

每一個Widget包必須有一個名為config.xml（大小寫敏感）的配置文件，它就位于我們剛創建的空目錄下，這個目錄就是包的根目錄。這個配置文件包含了關于Widget的重要信息，如：名稱、作者、描述、許可證等等。

清單3中顯示的是一個配置文件例子。

清單3.一個示例config.xml文件

id="http://www.example.com/widgets/HelloWidget" 
version="0.1"width="300"height="200"> 
HelloWidget  
Averybasicwidgetthatsays,"Hello"  
NathanA.Good  
Thisismylicense 

這個XML文件必須采用UTF-8編碼，如例子所示。

Widget父元素有詳細說明Widget信息的屬性，如表1所示。

表1.Widget父元素的屬性

屬性名描述

id惟一URI，它是Widget的標識

versionWidget的版本號

width,height分別以像素值表示Widget的寬和高

viewmodesWidget的查看模式（見參考資料）

配置中的XML元素如表2所示。

表2.Widget配置元素

元素名描述

nameWidget的縮寫名是在屬性short指定的，而全名在XML元素的文本中指定。

descriptionWidget的描述信息

authorWidget的作者信息

licenseWidget的許可證

icon圖標文件的相對路徑

在創建一個簡單的配置文件后，我們就可以創建開始文件了。

開始文件

除了config.xml配置文件之外，一個有效的W3CWidget包至少還需要另一個文件：開始文件。如果沒有指定開始文件，默認的文件就是文件名以index開始的文件——通常帶有.html、.htm或.xhtml擴展名。不同類型的Widgets可能允許使用其它的擴展名，但本文僅關注標準的HTML例子。

清單4顯示了一個示例文件。

清單4.一個示例開始文件

"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 
"text/html;charset=us-ascii"/> 
HelloWorld... 

清單4中顯示的HTML文件和其他可以顯示在瀏覽器上的符合語法的HTML文件很相像。這使得Widget設計時很容易—我們像普通的HTML頁面一樣創建Widget。這個HTML開始文件就是用來渲染Widget的文件。

因為Widget是由瀏覽器所渲染的一個簡單的HTML文件，它們可能包含了JavaScript文件。使用JavaScript功能可以使Widget擁有富內容和動態內容。我們可以使用Ajax在Widget中動態地向用戶顯示數據。（見參考資料中關于Ajax的信息）

Widget的HTML開始文件中所引用的JavaScript文件必須包含在打包的Widget存檔包中。

這個Widget的示例HTML文件還使用了CSS樣式表。類似于JavaScript文件，這些CSS文件也必須包含在作為打包部署的Widget的壓縮文件存檔中。

W3C規范也規定了本地化（i10n）準則。本地化支持是基于文件夾的，所以我們可以在Widget目錄下創建一個名為locales目錄。在locales文件夾內，我們可以創建以本地化名稱命名的文件夾（例如，en、fr、de），它們包含了適合于各個本地化的不同資源。

#p#

打包Widget

Widget被打包成標準的壓縮存檔文件，擴展名為.wgt。我們可以使用DEFLATE方法將一個Widget包壓縮成一個存檔文件。壓縮文件存檔包必須包含配置文件、開始文件和文件所使用的所有資源，如JavaScript文件、CSS和圖片。

我們可以使用清單5中所示的命令行工具來創建一個Widget的壓縮文件包。

清單5.創建壓縮文件存檔包

$cdmyWidget  
$zipmyWidget.wgt* 

我們也可以使用一個圖形化用戶界面（GUI）來創建Widget的壓縮文件存檔包。在創建存檔包后，我們只需要將擴展名.zip修改為.wgt即可。

我們可以將Widget包按目錄整理好，這樣就更容易管理包。例如，圖1顯示了諸如images、style和scripts的文件夾，我們可以使用這些文件夾來管理Widget包。

圖1.W3CWidget包文件夾結構

在開始文件中引用資源時，要像部署在Web服務器上一樣使用相對路徑。例如，使用style/common.css引用style文件夾下的common.css文件，雖然它們都是包含在Widget包的壓縮文件存檔中。

我們還可以用數字符號來指定Widget包文件的安全性設置。具體可以查看參考資料中關于數字方式標記Widget包的W3C規范的信息。

部署Widget有限的實現

因為W3C Widget規范是新出現的，而且現在有許多不同的私有Widget規范，所以現在還很難找一個能達到生產環境質量要求的W3C Widget規范實現。ApacheWookie就是一個還在開發中的W3C Widget規范的實現例子。因為它還在開發過程中，它可能還不穩定。當我運行我的測試時，SVN中的代碼還有一些導致ApacheWookie暫時出錯的更新，但它們已經在后面的更新中解決了。

我們可以使用ApacheWookie的Administrative菜單部署Widget。我們先要保證Wookie正在運行（在命令行中輸入antrun），然后在瀏覽器上輸入ApacheWookie的位置，我們就可以訪問ApacheWookie的菜單。默認情況下，它的位置是http://localhost:8080/wookie。點擊Administrative菜單鏈接（見圖2）。

圖2.Administrative菜單鏈接

我們會被提示輸入用戶名和密碼。如果我們沒有修改默認值，用戶名和密碼都應該是java。

單擊圖3所示的Addnewwidget。

圖3.添加一個新的Widget

單擊ChooseFile，然后瀏覽Widget存檔文件。選擇文件，然后單擊Publish（見圖4）。

圖4.選擇Widget存檔文件

然后，ApacheWookie會處理Widget存檔。當存檔處理完成后，我們可以在Widget清單和Widget庫中看到所發布的Widget。

另外，我們也可以在ApacheWookie中不使用管理工具部署Widget。只需直接將Widget包復制到build.properties文件中widget.deploy.dir所配置的部署目錄即可。

部署和配置W3C Widget的規范包括了具體實現應該如何處理Widget存檔文件的推薦規范。當一個實現（如瀏覽器）下載一個包時，它會將Widget包作為一個可能的Widget包看待。瀏覽器會驗證包的完整性，保證它是正確創建的，而且配置文件是完整的。如果這個Widget包符合標準，它就會被作為一個有效的Widget包進行處理。

#p#

查看示例

ApacheWookie允許我們在所有瀏覽器上查看Widget，所以我們不需要搜索實現W3C規范的瀏覽器（類似于Opera瀏覽器的Widget實現）。理想地，瀏覽器將會實現W3C Widget規范，所以用戶可以利用Widget的一次下載、重復使用的優點。

為了查看我們新創建的Widget，我們必須確保ApacheWookie已經運行，并能從瀏覽器訪問它。單擊ViewWidgetGallery，我們就可以看到所部署的Widget已經列在庫中（見圖5）。

圖5.查看Widget庫

單擊Demo查看Widget的運行結果。

我們也可以創建一個測試文件，它用一個iframe元素包含我們創建的新Widget。創建一個如清單6所示的HTML文件。

清單6.一個簡單的運行Widget的HTML文件

"http://localhost:8080/wookie/wservices/wookie.apache.org/widgets/butterfly/index.html  
?idkey=sM4aI8pnUUNI2Kfz15aK2h6vIek.eq.&proxy=http://localhost:8080/wookie/proxy  
&st=wookie%3AwEQZrCsxTF502%2B6JeeEFlkq1KPgqXKQTllufS6Toez81qb40hPouhYV3apG4on23uVB  
kQ5xlLjOXvIKulGqKBZvnKv2pgfEMg7OVzJpdDQt66MfODW6BBJry33ybOyMSc2hKonu7Sp1n1SY6FOFUuRx8VAjED  
TuJip8BQ9i6ZXRH9193FT%2F7Ijjz0o1vdR91ofzcFA%3D%3D"width="500"height="400"> 

我們將看到所創建的Widget顯示在網頁中。我使用的WidgetURL是來自于Wookie主菜單的Instantiateawidget的執行結果。

我們還可以查看其他示例包，它們包含了更復雜的JavaScript文件、CSS和圖片，這些示例包是和ApacheWookie源代碼一起發布的。在下載了ApacheWookie源代碼后，子文件夾widgets中就包含了其他Widget的源代碼。

小結：W3C Widget配置與打包的內容介紹完了，希望通過W3C Widget應用中的配置與打包內容的學習能對你有所幫助！