使用 WebSphere sMash 来为 Google Gadget 提供支持
http://tech.ddvip.com 2008年09月09日 社区交流
内容摘要：本文介绍如何从头构建一个 Google Gadget，发布它，并使用 WebSphere sMash 来为其提供支持。在整个过程中，您将研究 Gadget XML 规范，使用 WebSphere sMash 流模型和 Feed 工具，并最终将该 Gadget 部署到网页。
IBM® WebSphere® sMash 提供了各种各样在 Web 2.0 应用程序中共享信息的方法。本文介绍如何从头构建一个 Google Gadget，发布它，并使用 WebSphere sMash 来为其提供支持。在整个过程中，您将研究 Gadget XML 规范，使用 WebSphere sMash 流模型和 Feed 工具，并最终将该 Gadget 部署到网页。
引言
IBM WebSphere sMash 是一个用于开发和交付 Web 2.0 应用程序的灵活和敏捷的平台。通过一个包括动态语言的易于使用的编程模型，WebSphere sMash 提供了一个卓越的环境来构建 RESTful 服务以扩展 SOA，并使您能够以对您的具体情景目标最有意义的方式使用服务。本文描述如何构建一个 Google Gadget，这是一个在 HTML、JavaScript™ 和 XML 基础上构造的轻量级模块，您可以将其放在许多网页中，并使用 WebSphere sMash 来为其提供支持。
Gadget 剖析
Gadget 是简单的 HTML 和 JavaScript 小应用程序，它们为您提供了与其他人共享数据的轻量级方法。Gadget 只需编写一次，即可在许多地方使用，包括 iGoogle、Google Maps、Orkut、IBM WebSphere Portal 或在几乎任何网页或桌面中。图 1 显示了 iGoogle 网页，这是 Google 主页的可自定义门户版本，其中填充了从诸如 Slashdot.org、Fool.com、BBC News 和 Kiplinger Personal Finance 等其他站点采集的不同 Google Gadget。
图 1. iGoogle 网页
基本的 Gadget 可以在 HTML、XML 和 JavaScript 的基础上构造而成。Gadget 使用 XML 文档来描述将在 Gadget 容器上呈现的 HTML 和 JavaScript，该容器是支持在页面中显示 Gadget 的函数集。本文使用 iGoogle.com 页面作为容器，但是您可以使用诸如 WebSphere Portal 等产品或由 Google 提供的代码片段在典型网页上显示 Gadget。开始构建 Gadget 的起点是在 Gadget 规范文件中，清单 1 显示了该规范文件的示例。
清单 1. Google Gadget 的 Gadget 规范
<?xml version="1.0" encoding="UTF-8" ?>
<Module>
<ModulePrefs title="Gadget Sample"
title_url="http://www.ibm.com/developerworks/"
height="200"
author="Jay Palat"
author_email="vpalat@us.ibm.com"/>
<UserPref name="exampleStr" display_name="Name" required="true" />
<Content type="html">
<![CDATA[
Hello, world!]]>
</Content>
</Module>
将其细分一下，可以看到 Gadget 是一个由三个部分组成的模块：
模块首选项
ModulePrefs（清单 2）引用该模块或 Gadget 本身，并提供用于发布和订阅的属性。显示属性包括标题、标题 URL、Gadget 尺寸（高度和宽度）、滚动（如果 Gadget 内容超出页面限制）和创作者信息（姓名、电子邮件地址等等）。如果某个模块要使用特殊库，则还必须在 ModulePrefs 中包括该特殊库。
清单 2. 模块首选项
<ModulePrefs title="Gadget Sample"
title_url="http://www.ibm.com/developerworks/"
height="200"
author="Jay Palat"
author_email="vpalat@us.ibm.com"/>
Gadget 还支持其他功能（本文将不对此做详细介绍），包括区域支持和兼容性需求。区域使 Gadget 能够具有基于语言和国家/地区的特定内容，兼容性使 Gadget 创作者能够设置规则来要求 Gadget 环境在某些条件下运行。例如，某个 Gadget 可能需要特定的平台、浏览器或插件才能运行。
用户首选项
UserPref（清单 3）使您可以设置 Gadget 的特定首选项。例如，您可能希望用户能够更改 Gadget 的外观。用户首选项具有若干个组件。name 属性是首选项本身的名称；除非设置了 display_name，否则在缺省情况下，用户将看到 UserPref name 值。UserPref 支持多种数据类型，包括字符串（缺省）、布尔、枚举、隐藏和列表。
清单 3. 用户首选项
<UserPref name="exampleStr" display_name="Name" required="true" />
<UserPref name="exampleStr2" display_name="Photo"
default_value="http://doc.examples.googlepages.com/Rowan-headshot.jpg"/>
<UserPref name="exampleBool" display_name="Show Photo?" datatype="bool"
default_value="true"/>
<UserPref name="exampleEnum" display_name="Color" default_value="Yellow"
datatype="enum" >
<EnumValue value="Red" />
<EnumValue value="Yellow" />
<EnumValue value="Blue" />
</UserPref>
用户不能查看或编辑隐藏字符串。如果将某个必需标记设置为 true，则在设置必需的 UserPref 之前，Gadget 将不会呈现出来。
内容
内容是 Gadget 的实质。Gadget 必须声明可用的内容类型（选项为 HTML 和 URL）。HTML 类型的 Gadget 封装了必要的 HTML 和 JavaScript，以使该 Gadget 能够在 XML 文档本身中工作。代码在 Gadget 中全都是自包含的。由于这个原因，内容类型为 HTML 的 Gadget 需要 CDATA 标记，如下所示：
<Content type="html">
<![CDATA[ HTML here... ]]>
下面请注意，Gadget 包括的 HTML 不包含 <html>、<head>或 <body> 标记；这些项在 Gadget 容器级别进行处理，因此不应该包括在 Gadget 的 HTML 片段中：
<Content type="html">
<![CDATA[
Hello, world!]]>
</Content>
与典型的 HTML 页面一样，可以通过内联方式或外部文件包括 JavaScript。Google 提供了一组 JavaScript 库来帮助完成此任务。核心 JavaScript 库提供对 UserPrefs 部分中创建的用户首选项的访问。
清单 4. 使用核心 JavaScript 库
<![CDATA[
<script type="text/javascript">
function getPrefs()
var prefs = new _IG_Prefs(__MODULE_ID__);
var name = prefs.getString("exampleStr");
var url = prefs.getBool("exampleStr2");
var bool = prefs.getBool("exampleBool");
var primaryColor = prefs.getString("exampleEnum");
...
Google 还提供了用于处理内容（包括 Feed、图像和 XML 文档）的库。表 1 显示了一些取自 Google Gadgets API Reference 页面的示例。
表 1. Google Gadget 核心 JavaScript 库中可用的精选功能
| 函数 | 描述 |
| _IG_FetchContent(url, func, {refreshInterval:num}) | 获取位于 url 的内容。当此函数完成时，将调用 func。请注意，_IG_FetchContent() 是异步的，意味着它立即返回，然后在稍后完成获取时调用内部函数。这意味着您必须将任何依赖代码放在回调函数内，或者放在由回调函数调用的函数内。可选的 refreshInterval 参数允许您通过每隔 num 秒刷新缓存，从而覆盖缺省缓存行为。 |
| _IG_FetchXmlContent(url, func, {refreshInterval:num}) | 获取位于 url 的 XML 内容。当此函数完成时，将调用 func。可选的 refreshInterval 参数允许您通过每隔 num 秒刷新缓存，从而覆盖缺省缓存行为。也是异步的。 |
| _IG_FetchFeedAsJSON(url, func, num_entries, get_summaries) | 获取位于 url 的 RSS / Atom Feed 内容，并将其作为 JSON 对象返回。当此函数完成时，将调用 func。获取由 num_entries（缺省为 3，可能值为 1-100）指定数量的 Feed 条目，并根据 get_summaries 的值（缺省为 false）可选地获取条目摘要。也是异步的。 |
| _IG_RegisterOnloadHandler(func) | 在加载时调用的事件处理程序。接受单个参数，该参数是在 Gadget 加载以后调用的函数。所传递的函数不接受参数。 |
| _gel(id) | 围绕 JavaScript document.getElementById() 函数的包装。 |
| _args() | 从 document.location 中将 URL 参数键-值对作为关联数组返回。例如， &foo=bar&up_cats=meow 将返回为 {"foo":"bar", "up_cats":"meow"}. 下面是您可能如何使用该函数来获取语言或国家/地区的示例： var lang = _args()["lang"]; if (typeof lang == "undefined") { lang = "en"; } |
| _IG_GetImage(url, {refreshInterval:num}) | 返回由 url 指定的图像的缓存版本。在具有静态图像的 Gadget 中，这可以改进性能。例如： var img = _IG_GetImage(my_image_url); 可选的 refreshInterval 参数允许您通过每隔 num 秒刷新缓存，从而覆盖缺省缓存行为。函数 _IG_GetImageUrl() 和 _IG_GetCachedUrl() 也提供了对缓存内容的访问。（另请参阅 Improving Gadget Performance。） |
| _IG_GetCachedUrl(url, {refreshInterval:num}) | 返回由 url 指定的文件的缓存版本的代理 URL。使用缓存的内容可以改进 Gdaget 性能。可选的 refreshInterval 参数允许您通过每隔 num 秒刷新缓存，从而覆盖缺省缓存行为。 |
虽然许多 Gadget 只是使用 HTML 类型来产生的，但是在某些情况下，从基于服务器的解决方案中运行 Gadget 将更有意义。对于那些情况，您可以使用内容类型 URL：
<Content type="url" href="http://www/cgi-bin/example/gadgets/mystats.cgi" />
基于 URL 的 Gadget 在服务器端执行所有的处理和逻辑。这些 Gadget 通过 iFrame 来承载。作为 Gadget 创建者，您要负责确保使用 CSS 来隐藏 iFrame 边缘。
构建和发布 Gadget
虽然可以使用任何简单的文本编辑器来创建基本的 XML 规范，但是为简单起见，本文将使用 Google Gadget Editor（图 2）。Google Gadgets Editor 是一个具有语法突出显示功能的基本文本编辑器，还提供了预览模式以表明 Gadget 在部署后的外观状况（图 3）。Google Gadgets Editor 页面提供了其他可用的 Gadget 的示例，以及 API 示例。
图 2. Google Gadgets Editor：编辑模式
图 3. Google Gadgets Editor：预览模式
（本示例将不使用预览功能，因此在编辑器中工作时将该值设置为 false，但是在发布时将其设置为 true。）
Google Gadgets Editor 提供了以下命令：
New：创建新文件
Open...：从 Google 承载平台中打开现有的文件
Open from URL：从远程 URL 打开文件
Save：保存文件
Save As：使用新名称来保存
Rename：重命名现有的文件
Upload：上载某个文件以便编辑
Publish：发布该 Gadget
发布 Gadget 将把内容放在公开可用的空间中。发布到 Google 将使其他开发人员可以在其开发工作中利用 Google 基础设施，包括缓存和服务高可用性。话虽这样说，但是您可以将 Gadget 发布到任何网站，并且只需将 Gadget 容器页面指向您的 Gadget 的 URL。
在下面几个部分中，您将看到如何使用 WebSphere sMash 的流模型和 Feed 工具来创建基于 Feed 的内容，然后了解如何使用 WebSphere sMash 来为该 Gadget 提供支持。
使用简单的流
WebSphere sMash 提供了聚合 Feed 并使用一个组装组件来协调服务的能力。这里使用 Feed 聚合功能来从现有的 Feed 提取数据，并为将要使用数据的 Gadget 提供支持。
流由以下组件和功能组成：
Feed：源 Feed。WebSphere sMash 可以使用 RSS 0.x、RSS 1.0、RSS 2.0、Atom 0.3 和 Atom1.0 类型的 Feed。
SortFeed：Sort Feed。使用 SortFeed，可以按诸如标题或日期等以升序或降序对 Feed 条目排序。
AggregateFeeds：支持两个或更多个输入 Feed，并输出单个 Atom 1.0 类型的输出 Feed。
FilterFeed：使流创建者能够指定流选择条件。您可以使用关键字或布尔 XPath 1.0 表达式来选择输出 Atom 节点的条目。
Unique：通过使用 XPath 表达式来确定重复的方面，从而删除重复的条目。
Truncate：返回特定的条目集，例如输入 Feed 的前十个条目。
当然，还存在更多的组件和功能，但是上述组件和功能对于本文来说已经足够了。（有关其他可用的操作符，请参阅 WebSphere sMash 文档。）
下面让我们构建一个 Gadget，该 Gadget 使用 WebSphere sMash 流来聚合一对从 IBM developerWorks 到 WebSphere sMash 的 Feed：
如果还没有安装 Project Zero 或 WebSphere sMash，您可以从 Project Zero 网站安装免费的 WebSphere sMash Developer’s Edition，该版本也提供了安装说明和文档。
安装完成以后，您可以使用 WebSphere sMash App Builder（图 4）来开始构建您的流。首先从命令提示符输入适当的启动命令。（清单 5 中的命令用于在 Linux 上启动 App Buiilder。要找到用于您的平台的命令，请参考安装 WebSphere sMash CLI 模块的目录中的 startAppBuilder 脚本。）
清单 5. 启动 WebSphere sMash App Builder
vpalat@vpalat-laptop2:~/zero$ ./startAppBuilder
Application started and servicing requests at http://localhost:8070/
CWPZT0600I: Command start was successful
vpalat@vpalat-laptop2:~/zero$
图 4. WebSphere sMash App Builder
要构建您的 Feed，您将通过单击左侧导航框中的 New Application 链接（图 4）来创建一个新应用程序。
在 New Application 面板（图 5）中，通过输入以下数据来描述您的应用程序：
Application Name： GadgetFeed
Application Path： <HomePath>/GadgetFeed/
Application Description： Feed Aggregation for Google Gadgets
单击 Create 按钮以返回到更新后的主菜单（图 6）。
图 5. New Application 面板
要编辑您的应用程序，请单击铅笔图标（图 6）。这将显示 GadgetFeed Editor（图 7），您可以从中添加和编辑您的应用程序的文件。
图 6. 带编辑图标的主菜单
图 7. GadgetFeed Editor
要创建新的流，您需要通过单击 New File => New Page (in /public)（图 9），从而在应用程序的公共文件夹中创建一个新文件。
图 8. New Page 菜单
在提示您指定希望创建的文件时，请输入 /public/gadget/websphere.flow，以在公共目录中创建该文件（图 9）。
图 9. 创建文件
然后 App Builder 将提示您添加 zero.assemble.flow 依赖关系（图 10）。单击 Add。
图 10. 添加依赖关系
为什么要添加依赖关系？与预先提供所有类库的应用程序服务器不同，WebSphere sMash 在需要时添加依赖关系，以便应用程序决不加载任何不需要的东西。查看一下图 11 中的依赖关系列表，可以看到其中仅显示了正在使用的 Modulegroup：zero.core、zero.assemble.flow 和 zero.flow.management。
图 11. 应用程序依赖关系
在活动下拉菜单中，确保将选择设置为 Feed Activities。
图 12. 更新活动
通过将 Feed 图标拖放到 Editor 面板上来导入以下 URL 的 Feed，并将 URL 值更新为以下 URL（图 13）：
http://www.ibm.com/developerworks/views/webservices/rss/libraryview.jsp
http://www.ibm.com/developerworks/views/websphere/rss/libraryview.jsp
图 13. 添加 Feed 操作符
使用 FeedAgregator 来将这些 Feed 合并在一起。将一个 aggregateFeeds 操作符拖放到编辑器上（图 14）。根据情况更改标题和描述，然后将 Feed 的输出拖到 aggregateFeeds 小部件的输入。
图 14. 添加 aggregateFeeds 操作符
要聚合 Feed，请将 Feed 的输出拖到 aggregateFeeds 的输入（图 15）。
图 15. 聚合 Feed
aggregateFeeds 小部件将返回一个 Atom 对象，但是要将该对象返回给请求者，您需要包括一个 replyGet 条目。replyGET 活动向先前与某个接收活动相匹配的 HTTP GET 请求提供响应。每个流只能执行到一个 HTTP 响应为止。将一个 replyGet 项从 Feed Activities 拖到 Editor。通过接受 aggregateFeeds 的输出并将其拖到 replyGet 项（图 16），从而将该项链接到 aggregateFeeds。
图 16. 添加 replyGet
编辑器将自动为您保存更改。未保存的文件的名称标注有一个星号 (*)（图 17），而已保存的文件则没有标注星号（图 18）。
图 17. 未保存的流
图 18. 已保存的流
要启动流，可以单击面板左上角的 Run（图 19）。这将启动运行在端口 8080 的应用程序。
图 19. 流已停止
图 20. 流正在运行
通过在浏览器中导航到 http://localhost:8080/gadget/websphere.flow 来调用您的流（图 21）。
图 21. 调用 Fedd
这看起来很不错，但是为什么“Integrating IT monitoring and business activity monitoring”在列表中出现了两次呢？结果表明，在这个流中聚集在一起的两个 Feed 之间，存在一些共享的文章。可以通过添加唯一操作符来解决此问题。将唯一操作符从 Feed Activities 菜单拖到编辑器（图 22）。
图 22. 添加唯一操作符
通过单击 aggregateFeeds 和 replyGET 之间的链接，然后选择剪刀图标，从而删除该链接（图 23）。
图 23. 删除链接
一旦删除了该链接，您就可以将 aggregateFeeds 连接到 unique_0，并将 unique_0 连接到 replyGET_0。使文章标题保持唯一。为此，请在 unique_0 下拉列表中选择 atom:title（图 24），并保存该流。
图 24. 选择求值
重试 http://localhost:8080/gadget/websphere.flow（图 25）。您将看到“Integrating IT monitoring and business activity monitoring”现在仅显示一次。
图 25. 修改后的唯一条目 Feed
将 Feed 转换为 Gadget
现在有了一个 Feed，下面将其转换为 Gadget：
首先从一个没有用户首选项的基本示例着手，但是使用一些 JavaScript 来开始（清单 6）。
清单 6. 简单的开始
<?xml version="1.0" encoding="UTF-8" ?>
<Module>
<ModulePrefs title="Gadget Sample"
title_url="http://www.ibm.com/developerworks/"
height="200"
author="Jay Palat"
author_email="vpalat@us.ibm.com"/>
<Content type="html">
<![CDATA[
<style> #content_div { font-size: 80%; margin: 5px; background-color: #FFFFBF;}
</style>
<div id=content_div></div>
<script type="text/javascript">
function showfeed__MODULE_ID__() {
var html = "Powered by JavaScript";
_gel("content_div").innerHTML = html;
};
_IG_RegisterOnloadHandler(showfeed__MODULE_ID__());
</script>
]]>
</Content>
</Module>
在此示例中，您从一个样式表开始为内容提供格式设置。您将创建一个 div 容器 (<div id=content_div></div>) 以在其中放置内容，并在最后实现 JavaScript 函数（清单 7）。
清单 7. JavaScript 函数
<script type="text/javascript">
function showfeed__MODULE_ID__() {
var html = "Powered by JavaScript";
_gel("content_div").innerHTML = html;
};
_IG_RegisterOnloadHandler(showfeed__MODULE_ID__());
</script>
该函数为 showfeed__MODULE_ID__()，并且 __MODULE_ID__ 将被该特定模块的标识符取代。该函数本身创建一个简单的 HTML 字符串，并将其放在您在几行代码之前创建的内容 div 中。最后一行 _IG_RegisterOnloadHandler(showfeed__MODULE_ID__()); 将在启动时运行 showfeed__MODULE_ID__()。图 26 显示了您的示例代码在 Google Gadgets Editor 预览模式下的情况。
图 26. 预览模式
这是在您的 Gadget 中使用 JavaScript 的很好起点，但是首先让我们看看如何整合 Feed。为此，您将使用 _IG_FetchFeedAsJSON 命令，该命令接受以下参数：
URL：您的 Feed（字符串）的位置
function：Gadget 引擎将在检索 Feed 以后使用的函数（JavaScript 函数）
number of entries：条目数量：要从 Feed 中检索的条目数量（int，缺省为 3）
get summaries：如果为 true，则该函数将获取摘要（Boolean，缺省为 false）
下面让我们开始整合 Feed 吧。请注意，到目前为止，您一直是从 localhost 查看 WebSphere sMash。从现在开始，您的 WebSphere sMash 实例需要公开可用，因为 Google 基础设施需要能够看到公开的 Feed。
清单 8. 用于显示 feed 内容的新脚本
<script type="text/javascript">
var entries = 5;
var summaries = false;
_IG_FetchFeedAsJSON("http://6myhost.com:8080/gadget/websphere.flow", function (feed)
{
if (feed == null){
alert("There is no data.");
return;
}
var html = ""
html += "<div><b>" + feed.Title + "</b></div>";
html += "<div>" + feed.Description + "</div><br>";
if (feed.Entry) {
for (var i = 0; i < feed.Entry.length; i++) {
html += "<div>"
+ "<li><a target='_blank' href='" + feed.Entry[i].Link + "'>"
+ feed.Entry[i].Title
+ "</a> ";
}
html += "</div>";
}
_gel("content_div").innerHTML = html;
},
entries, summaries);
</script>
清单 8 添加了 _IG_FetchFeedAsJSON 函数，并且为该 Feed 添加了您的 sMash 实例。这应该非常容易，就像是对本地主机使用 Internet 可访问的 IP 地址一样。function (feed) 函数被列为 IG__FetchFeedAsJSON 的一部分。该内联函数执行检查，以确保在使用 Feed 的详细信息来填充 HTML 之前，您拥有某个 Feed（如果该 Feed 为空，则返回警报）。将条目数量设置为 5，并将摘要设置为 false。将这些设置应用于该示例，可以看到如图 27 所示的预览。
图 27. 预览整合的 Feed
这非常好，但是您仅看到了五个 Feed 条目中的三个。要解决此问题，可以更新 ModulePrefs 以允许滚动。这可以通过向 Gadget 代码添加 scrolling 参数来实现，如下面的粗体字体所示。
清单 9. 修改后的 Gadget
<ModulePrefs title="Gadget Sample"
title_url="http://www.ibm.com/developerworks/"
height="200"
author="Jay Palat"
scrolling="true"
author_email="vpalat@us.ibm.com"/>
此修改将为您提供图 28 中的结果。
图 28. 滚动 Gadget
这非常好，但是您还可以做得更好。如果用户希望五个以上的条目，或者希望查看这些文章的摘要，又该如何呢？您可以通过使用用户首选项来处理这些选择。添加一个针对条目数量的用户首选项，添加另一个针对摘要使用的用户首选项（清单 10）。
清单 10. 添加用户首选项
<UserPref name="num_entries" display_name="Number of Entries?" default_value="5"/>
<UserPref name="show_summaries" display_name="Show summaries?" datatype="bool"
default_value="false"/>
有了 XML 中的这些 <UserPref> 条目以后，下一步是让 JavaScript 提取它们。使用 Google Gadget JavaScript 核心库来获取首选项。
清单 11. 提取用户首选项
var prefs = new _IG_Prefs(__MODULE_ID__);
var summaries = prefs.getBool("show_summaries");
var entries = prefs.getInt("num_entries");
这将取代您先前的摘要和条目声明。您现在可以将这整合到您的 Gadget 逻辑中。具有用于处理摘要的新逻辑的完成后的 Gadget 如清单 12 所示。
清单 12. 完成的 Gadget 代码
<?xml version="1.0" encoding="UTF-8" ?>
<Module>
<ModulePrefs title="Gadget Sample"
title_url="http://www.ibm.com/developerworks/"
height="200"
author="Jay Palat"
scrolling="true"
author_email="vpalat@us.ibm.com"/>
<UserPref name="num_entries" display_name="Number of Entries?" default_value="3"/>
<UserPref name="show_summaries" display_name="Show summaries?" datatype="bool"
default_value="false"/>
<Content type="html">
<![CDATA[
<style> #content_div { font-size: 80%; margin: 5px; background-color: #FFFFBF;}
</style>
<div id=content_div></div>
<script type="text/javascript">
var entries = 5;
var summaries = false;
var prefs = new _IG_Prefs(__MODULE_ID__);
var summaries = prefs.getBool("show_summaries");
var entries = prefs.getInt("num_entries");
_IG_FetchFeedAsJSON("http://66.93.60.86:8080/gadget/websphere.flow", function (feed)
{
if (feed == null){
alert("There is no data.");
return;
}
var html = ""
html += "<div><b>" + feed.Title + "</b></div>";
html += "<div>" + feed.Description + "</div><br>";
if (feed.Entry) {
for (var i = 0; i < feed.Entry.length; i++) {
html += "<div>"
+ "<li><a target='_blank' href='" + feed.Entry[i].Link + "'>"
+ feed.Entry[i].Title
+ "</a> ";
if (summaries==true) {
html += "<br><i>" + feed.Entry[i].Summary + "</i>";
}
}
html += "</div>";
}
_gel("content_div").innerHTML = html;
},
entries, summaries);
</script>
]]>
</Content>
</Module>
要使 Gadget 有用，需要发布它。幸运的是，Google Gadgets Editor 使得发布非常容易。只需从编辑器菜单中选择 File => Publish。
图 29. 发布 Gadget
编辑器执行验证检查（图 30）。单击 OK，您的 Gadget 将被发布（图 31）。
图 30. Gadget 验证
图 31. Gadget 已发布
虽然可以发布到 iGoogle 目录以便每个人都能看到您的 Gadget，但是将您的 Gadget 发布到 iGoogle 页面，同时继续对其进行处理，这样将会更有意义。选择 Add to my iGoogle page（图 31），您将收到类似于如图 32 所示的确认消息。您的 Gadget 现已在 iGoogle 上。
图 32. Add to iGoogle 确认消息
完成这些步骤以后，您的 Gadget 现已在 iGoogle 页面上可用，如图 33 所示。
图 33. 带有示例 Gadget 的 iGoogle Web 网页
结束语
本文研究了如何创建 Gadget，如何使用 Gadget XML 规范的不同部分，以及如何使用 AppBuilder GUI 在 WebSphere sMash 中创建 Feed 组装。然后将 Gadget 和 Feed 组装组合在一起，并使用由 WebSphere sMash 生成的 Feed 来为该 Gadget 提供支持。通过将这些说明应用于您自己的具体情景应用需求，您可以从头构建 Gadget 并将其部署到 iGoogle 主页。
来源：developerWorks 作者：Vijaykumar Palat 责编：豆豆技术应用