IBM®
跳转到主要内容
    中国 [选择]    使用条款
 
 
Select a scope:Search for:    
    首页    产品    服务与解决方案     支持与下载    个性化服务    
跳转到主要内容

developerWorks 中国  >  XML | Web development  >

编写跨浏览器的 XForms

XForms 新手入门指南

developerWorks
文档选项

未显示需要 JavaScript 的文档选项

讨论

样例代码


级别: 中级

Steve K Speicher (sspeiche@us.ibm.com), 资深软件工程师, IBM 

2007 年 11 月 05 日

了解如何安排和编写 XHTML 和 XForms 文档,让 XForms 应用程序的最终用户获得最佳体验。

简介

XForms 的目的是嵌入到其他标记语言中。应用最广,同时也是本文主要讨论的,是用在 XHTML 中。为保证在不同的浏览器上获得流畅的体验,比如 Microsoft® 的 Internet Explorer、Mozilla 的 Firefox、X-Smiles 和 Opera 等,XHTML 文档必须遵循一定的规则。撰写本文的时候,只有一种桌面浏览器为 XForms 提供原生支持,即 X-Smiles。因此,浏览器需要一个增件(add-on),或者有时候叫做插件,来处理 XForms 内容。还有一些方法将 XForms 标记转换成现有浏览器广泛支持的 ECMAScript 和 HTML。更多信息请参阅 参考资料

尽管本文希望提供一种适用各种不同配置的解决方案,但是具体的情况和配置各不相同,难以完全覆盖。随着新版本的浏览器和 XForms 处理程序的发布,以及对标准支持程度的变化,本文所述的解决方案可能不再适用。应对这种情况的方法是通过某种方式将变化隔离起来,以将变化局部化。

什么是 XForms?

W3C 针对表单数据的表示和采集提出了 XForms 标准。如 W3C Recommendation 中所述,XForms 的目的是成为 “下一代 Web 表单”。和现有的 HTML 表单相比,XForms 有许多突出的优点。正如 Recommendation中所说的,“通过将传统的 XHTML 表单分成三部分 —— XForms 模型、实例数据和用户界面,从而把表示从内容中分离出来、提高重用性和实现强类型,可以减少和服务器通信的次数、提供设备独立性,并减少脚本的使用”。

XForms 文档有一个数据模型,包含一个或多个 XML 实例文档。表单操纵这些实例文档,并负责将 XML 提交到后端系统。

2006 年 3 月,XForms 1.0 规范第二版的发布是 XForms 的一个重要里程碑。

服务内容准则

在 Web 服务器上布置需要处理的表单文档时需要考虑一些因素。这直接依赖于具体的部署环境。下表列举了一些可能的配置:


表 1. 一些浏览器和 XForms 处理程序选项
浏览器XForms 处理程序
Mozilla FirefoxMozilla XForms
FormFace
Microsoft Internet ExplorerformPlayer
MozzIE
FormFaces
X-SmilesN/A
OperaFormFaces
Apple SafariFormFaces

由上表可知,根据配置的不同情况可能非常复杂。当然也可使用 Chiba 这样的服务器端处理程序,这种处理程序适合上述所有浏览器平台。这里有意省略了支持的操作系统,那是另一方面的问题了。

不同的配置各有优缺点。本文不打算讨论这些问题,可根据自己的具体要求决定。本文主要讨论如何编写可用于上表列出大多数配置的 XHTML + XForms 内容。

本文假设采用下列部署:

  • 带有 Mozilla XForms 的 Mozilla Firefox
  • 带有 formsPlayer 的 Microsoft Internet Explorer
  • X-Smiles
  • 其他的浏览器都使用 FormFaces

为了保证正常运行,服务器端还有两点要求:

  1. Firefox 要求提供的服务内容其 HTTP 响应头部的内容类型必须包含一个 application/xhtml+xml 值。从技术上讲,就是需要一种能够调用其 “标准” 呈现模式的内容类型。关于 Firefox 呈现的更多信息请参阅 参考资料
  2. Internet Explorer 要求服务内容的 HTTP 响应头部中的 Content-type 包含 text/htmlapplication/xhtml+xml。关于 Internet Explorer 对内容类型的处理的更多信息,请参阅 参考资料

免责声明:不同版本的 Internet Explorer 可能有不同的配置参数,很可能有一些配置不能工作。详情参阅 参考资料

为了让 Apache Tomcat 这样的 Web 服务器支持此类内容,只需要将 web.xml 配置文件更新为如下内容:


清单 1. Apache Tomcat web.xml 配置文件
                
<mime-mapping>
 <extension>html</extension>
 <mime-type>application/xhtml+xml</mime-type>
</mime-mapping>

设置 Content-type 头部还有很多方法,和具体的 Web 服务器有关。要修改 Java™ Servlet 的头部,需要:


清单 2. Java Servlet 设置 HTTP 头部 Content-type
                
protected void doPost(HttpServletRequest request,
 HttpServletResponse response) throws ServletException, IOException {
 // Logic to determine which content type goes here...
 response.setContentType("application/xhtml+xml");
}

为了更好地理解不同配置和需求,表 2 列出了服务的内容:


表 2. HTTP Content-type 头部设置
客户机内容类型
Firefox + Moz XFormsapplication/xhtml+xml
application/xml
application/___+xml (any +xml)
IE + formsPlayerformPlayer
MozzIE
FormFaces
IE + MozzIEapplication/xhtml+xml
X-Smilesapplication/xhtml+xml
Opera + FormFacestext/html
application/xhtml
application/xml
application/___+xml (any +xml)
Safari + FormFacestext/html
application/xhtml
application/xml
application/___+xml (any +xml)

内容编辑准则

准则 1:使用 XHTML 名称空间作为默认名称空间

如果准备使用安装 formsPlayer 或 FormFaces 这类增件的 Microsoft Internet Explorer,编写时需要以 XHTML 名称空间作为默认的 XML 名称空间。为什么?Internet Explorer 不支持 XHTML,但是只要保证使用合法的 HTML 标签名并且没有 XML 名称空间前缀,就能够使用 HTML 处理程序。清单 3 给出了一个例子。


清单 3. 使用默认 XML 名称空间的 XHTML
                
<?xml version="1.0"?>
<html xmlns="http://www.w3.org/1999/xhtml"
                ...more namespace declarations go here...>
 <head>
 ...head contents go here...
 </head>
 <body>
 ...body contents go here...
 </body>
</html>

提示:使用模式验证器(schema validator)和支持模式的编辑器很容易编写结构良好并且有效的 XHTML+XForms 内容。更多信息请参阅 参考资料

准则 2:为 XForms 实例添加 XML 名称空间声明

由于在 HTML 中使用 XML 的一些限制,必须在 XForms 实例元素上重复声明某些名称空间。具体情况取决于使用的特性和实例使用的名称空间。即 XML 实例使用的名称空间、XSI 前缀(XML Schema 实例)和 XSD 前缀(XML Schema)。表单出现问题的时候一定要想到这一点。

XForms 处理程序的激活与安装

这一节给出一段简单的 ECMAScript 代码,可用于 XHTML 文件中执行适当的检查和进行定义好的动作。脚本文件名为 xforms-check.js。利用它可以简化表单代码的编写。只需要遵循本文列出的准则并把这段 脚本 包含到文档中即可。

前面的脚本经过修改后就变成了:


清单 4. 带有浏览器检查的 XHTML
#
     
<?xml version="1.0"?>
<html xmlns="http://www.w3.org/1999/xhtml"
 ...more namespace declarations go here....>
 <head>
 <script src="xforms-check.js"></script>
 ...more head content go here...
 </head>
 <body>
 ...body contents go here..
 </body>
</html>

注意:深入分析这段客户端 ECMAScript 之前,首先说明它如何确定使用的浏览器。大多数站点都提供了脚本或者准则来确定浏览器。下面的脚本采用了一种非常简单的方法识别浏览器,方法就是测试 navigator.appName

现在看看各种不同的浏览器如何激活处理程序。在有些情况下,如果没有安装插件,我们还要讨论如何安装。

Mozilla Firefox

首先看看 Mozilla Firefox。需要以下部分:


清单 5. 检查 Firefox 浏览器
                
  if (isFirefox()) {
 if (hasMozXForms()) { message('Firefox: XForms add-on is installed'); return; }
 
 var xpi ='';
 var rel = '0.8';
 var relName='Mozilla XForms ' + rel + ' Release Extension';

 var relURL='...';
 if (navigator.platform == 'Win32') {
 xpi={relName : relURL + '_win.xpi'};
 } else if (navigator.platform == 'Linux') {
 xpi={relName : relURL + '_linux.xpi'};
 } else if (navigator.platform == 'MacOSX') {
 xpi={relName : relURL + 'macosx.xpi'};
 }
 /* If appropriate platform, start the installer. Let the
 installer handle browser version checks. */
 if (xpi != '') { 
 message('Firefox: Installing XForms add-on...');
 InstallTrigger.install(xpi); 
 } else { 
 alert('Firefox: Mozilla XForms not available for your browser platform');
 }

首先对 Firefox 执行浏览器测试,然后检查是否安装了 Mozilla XForms 增件。如果已经安装则返回,否则调用适当的 XForms 插件 XPI 的安装程序。

Microsoft Internet Explorer

接下来检查 Internet Explorer 并启用 formsPlayer,代码如下:


清单 6. Internet Explorer 浏览器检查
                
} else if (isIE()) {
 var useFormsPlayer = 1;
 if (useFormsPlayer) {
 /* No need to test for formsPlayer, below code will handle */
 var classId="CLSID:4D0ABA11-C5F0-4478-991A-375C4B648F58";
 var fpCab="http://www.formsplayer.com/download/download/cab/formsPlayer.cab";
 document.write('<object classid="'+classId+
 '" height="0" id="formsPlayer"'+
 'width="0" codebase="'+fpCab+
 '" ><b>formsPlayer has failed to load!'+
 ' Please check your installation.</b></object>'+
 '<?import namespace="xforms"'+
 ' implementation="#formsPlayer"?>');
 message('IE: Enabling formsPlayer,'+
 ' may see additional messages if installation is needed.');
 } else {
 ... 
 }

激活 formsPlayer 必须使用 <object> 把 CLSID 连接到本地 Windows® 注册表中的应用程序。我们可以通过引用 formPlayer 打包文件来自动安装该插件。

启用 formsPlayer 的操作说明请参阅 参考资料

Opera 和 Safari

按照上述配置表,浏览器 Opera 和 Safari 都使用 FormFaces。为此,首先检查 appName 然后在 HTML DOM 中包含 formsfaces.js 实现。将对 xforms-check.js 的引用换成对 FormFaces.js 的引用。下面的清单说明了如何动态添加 <script> 实现这一功能:


清单 7. Opera 和 Safari 浏览器检查
                
} else if (isOpera()
 || 
isSafari()) {
 message('Opera/Safari: Enabling FormFaces');
 var script = document.createElement('script');
 script.src = 'FormFaces/formfaces.js'; /* Wherever FormFaces is installed */
 script.type = 'text/javascript';
 var head = document.getElementsByTagName('head')[0];
 head.appendChild(script);

X-Smiles

因为 X-Smiles 本身支持 XForms,默认情况下通知用户或者执行其他正确的动作:


清单 8. X-Smiles 浏览器检查
                
} else if (isXSmiles()) {
 message('XSmiles: Builtin XForms support, no action taken.');

alphaWorks XML Forms 生成器

如果使用过 IBM® alphaWork 工具集,就会理解本文中提到的 “Convert for XForms Renderer->” 动作是什么了。它可以修改默认名称空间、删除名称空间前缀并添加 “xforms-check.js” 脚本。该工具也非常适合开发 XForms 应用程序。更多信息请参阅 参考资料

结束语

本文说明了只要在编辑和部署的时候采取一定的步骤,就可以让基于 XForms 的网页不但能够在不同的浏览器上工作,而且可在必要的时候安装相关插件。

也许将来有一天这些浏览器本身都支持 XForms 和 XHTML,从而大大简化了最终用户对这类 Web 应用程序的使用。






回页首


下载

描述名字大小下载方法
XHTML, XForms, and JavaScript simple samplecross_browser_xforms.zip3KBHTTP
关于下载方法的信息


参考资料

学习

获得产品和技术
  • Mozilla XForms:利用该插件在 Mozilla Firefox 上呈现符合标准的表单。

  • MozzIE:这种开源插件可在 Internet Explorer 上呈现 XForms。

  • FormsPlayer:呈现 XForms 的 Internet Explorer 插件。

  • X-Smiles:原生支持 XForms 的开源浏览器。

  • Opera:Opera 开发的基于标准的浏览器。

  • Apple Safari:Apple 开发的基于标准的浏览器。

  • Chiba:一种服务器端 XForms 处理程序。

  • FormFaces:一种利用 JavaScript 的基于浏览器的 XForms 处理程序。

  • XML Forms Generator:利用来自 alphaWorks 的基于 Eclipse 的这个工具,只需单击鼠标就能创建功能完备、符合标准的表单。

  • Visual XForms Designer:其主页上提供了安装说明、先决条件和论坛。

  • Compound XML Document Toolkit:探讨其他开放标准的 XML 标记,包括可缩放向量图形(SVG)、MathML、VoiceXML 和 Synchronized Multimedia Integration Language (SMIL)。


讨论


关于作者

Steve Speicher 是一位从事新标准研究的 IBM 高级软件工程师,复合 XML 文档工具箱(Compound XML Document Toolkit)的首席开发人员。Speicher 先生是 W3C Compound Document Formats (CDF) 工作组的成员,他利用模型驱动的开发(MDD)来改进标准的开发。以前他曾经在 Rational 部门和 IBM 内部工具部门研究 “构建” 和软件配置管理(SCM)工具。




对本文的评价

太差! (1)
需提高 (2)
一般;尚可 (3)
好文章 (4)
真棒!(5)

将您的建议发给我们或者通过参加讨论与其他人分享您的想法.




回页首


IBM 公司保留在 developerWorks 网站上发表的内容的著作权。未经IBM公司或原始作者的书面明确许可,请勿转载。如果您希望转载,请通过 提交转载请求表单 联系我们的编辑团队。
    关于 IBM 隐私条约 联系 IBM 使用条款