面向开发人员的 ActiveX 筛选
在 IE9 候选发布版中引入 ActiveX 筛选时,我们关注的是交付卓越的用户体验,使得筛选能够避开常规浏览,并使用户能够在必要时轻松关闭筛选。与此同时,我们希望在启用 ActiveX 筛选的情况下,用户仍能获得出色的 Web 站点查看体验。这包括最小化站点兼容性问题,以及在 ActiveX 筛选阻止了一个 Web 页面内容时进行明确说明。
在这篇文章中,我们介绍了 IE9 最终发布版中对于 ActiveX 筛选的一些补充,同时分享了鼓励 Web 站点开发人员遵循的一些最佳实践。若能根据这些最佳实践更新 Web 站点,将有助于让使用 ActiveX 筛选的浏览体验提升至最佳程度。
msActiveXFilteringEnabled API
在检测到用户未安装 ActiveX 控件时,许多 Web 站点都会显示替用内容。通常情况下,站点会显示一条消息,通知用户需要安装或升级 ActiveX 控件,之后才能查看内容:
在 ActiveX 筛选阻止 Web 站点上的一个控件运行时,站点将向用户显示相同的消息,即使控件已经安装也是如此。站点无法确定控件究竟是未安装,还是被 ActiveX 筛选所阻止。用户将继续重新安装或升级控件,但由于控件仍然被阻止,因此用户最终会看到相同的消息。
在 IE9 最终发布版中,我们添加了 msActiveXFilteringEnabled API,它能确定是否为当前站点启用了 ActiveX 筛选。如果用户决定为一个站点关闭筛选,或者 ActiveX 筛选在全局范围内关闭,则 API 将返回 false。后文中有关最佳实践的部分将给出如何利用这种 API 的具体建议。
页内筛选器图标
在 ActiveX 筛选阻止了 ActiveX 控件时,某些 Web 站点不会显示替换内容。现在,IE 不再是在占位符区域内显示一个损坏的对象图标,而是显示与过去在地址栏内使用的相同的筛选图标:
在 ActiveX 筛选关闭时 , ActiveX 控件显示正常
在 ActiveX 筛选阻止了 ActiveX 控件时 , IE 将在该控件的占位符内显示一个筛选器图标
IE 将在被跟踪保护阻止的内容的占位符中显示相同的图标。显示此图标使用户能够清楚地了解到 IE 已经从页面中筛选掉了此内容。它为用户提供了一种视觉线索,表示单击地址栏上的这个图标即可为该 Web 站点关闭筛选,并查看此内容。如果没有这项更改,用户就可能会认为 Web 页面中包含损坏的链接,可能不会为该页面配置筛选选项。
面向 Web 站点开发人员的最佳实践
下面给出了一些最佳实践,我们鼓励 Web 站点开发人员遵循这些最佳实践,以确保其站点能够与 ActiveX 筛选配合良好:
利用本机对象而非 ActiveX
在产品测试过程中,我们发现了不一定依靠 Microsoft.XMLHTTP ActiveX 控件执行 AJAX 操作的 Web 站点的几个示例。由于 ActiveX 筛选通过脚本阻止了该控件的实例化,因此在启用 ActiveX 筛选的情况下,站点无法正常显示,即便站点似乎并未包含任何 ActiveX 内容时也是如此。
这些站点使用以下编码模式来使用 XMLHttpRequest 对象的 ActiveX 版本,因此在启用 ActiveX 筛选时会出错:
// BAD PATTERN:Don't do this!
var xhr = window.ActiveXObject
? new ActiveXObject("Microsoft.XMLHTTP")
: new XMLHttpRequest();
自 IE7 以来,Internet Explorer 支持本机 XMLHttpRequest 对象。即使在启用了 ActiveX 筛选的情况下,本机对象仍然能够正常工作。如果未使用本机对象,Web 站点的脚本应尽可能使用本机对象。下面的示例代码展示了如何以可靠的方式创建 XMLHttpRequest 对象:
// Best Practice:Use Native XHR, if available
if (window.XMLHttpRequest) {
// If IE7+, Gecko, WebKit:Use native object
var xmlHttp = new XMLHttpRequest();
}
else if (window.ActiveXObject) {
// ...if not, try the ActiveX control
var xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
}
else {
// No XMLHTTPRequest mechanism is available.
}
使用这个代码示例,站点只有在万不得已的情况下才需要实例化 ActiveX 控件。站点可以尽可能地利用本机对象,确保其功能不会受到 ActiveX 筛选的不必要影响。
许多出现过这种行为的 Web 站点都曾使用旧版本的 JQuery,使用上述不良模式来实例化 XMLHttpRequest 对象。最新版本的 JQuery 1.5.1 已经解决了这个问题,因此我们鼓励 Web 站点开发人员更新到最新版本。
正确显示替用内容
在上文中,我们提到了在 ActiveX 筛选阻止控件时显示类型不当的替用内容可能会给用户造成的迷惑。Web 站点应该使用全新的 API 来确定站点上是否启用了 ActiveX 筛选,以便与未安装 ActiveX 控件或版本过期的情况区分开来。
如果站点确实启用了 ActiveX 筛选,我们为开发人员提供的第一条建议就是不要显示替用内容。这将允许在占位符区域内显示筛选器图标,并能提供前文所述的用户优势。
如果站点仍然希望显示一些替用内容,则可以显示一条自定义消息,告知用户必须关闭筛选才能查看内容。以下示例代码展示了如何利用新的 API 来检查 ActiveX 筛选,并在控件被阻止的情况下显示一条自定义消息:
<object type="application/x-shockwave-flash" data="test.swf">
<script type="text/javascript">
// Best Practice:First detect if ActiveX Filtering is enabled
if (typeof window.external.msActiveXFilteringEnabled != "undefined"
&& window.external.msActiveXFilteringEnabled() == true) {
document.write("ActiveX Filtering has hidden this content.");
}
else {
// Either the browser isn’t IE, or ActiveX Filtering is not enabled in IE
document.write("Please install the Flash plug-in to view this content.");
}
</script>
</object>
Web 站点可以利用某些替代方法在页面上显示原始内容。例如,ActiveX 筛选 Test Drive 演示在为站点启用 ActiveX 筛选时显示 HTML5 视频格式的视频。
我们要求开发人员在检测到启用了 ActiveX 筛选时不要将用户转到另外一个 Web 页面。即使新 Web 页面不包含任何 ActiveX 控件,IE 包含的逻辑也会使得其地址栏中显示筛选器图标,而且用户在关闭筛选后还需要导航回上一个页面。如果新 Web 页面位于不同的域中,用户最终可能会为错误的域关闭 ActiveX 筛选。
使用 ActiveX 筛选测试您的 Web 站点
我们所观察到的与 ActiveX 筛选相关的一些站点兼容性问题可通过测试轻松识别和解决。下面的站点给出了一个示例,在启用了 ActiveX 筛选的情况下,该站点的布局会受到影响:
筛选器图标正确地出现在被阻止的 ActiveX 控件的占位符中。结果表明,该站点声明的一个控件的默认尺寸与其实际尺寸不一致。由于 IE 使用默认尺寸来显示页面上的占位符对象,因此尺寸不正确的占位符将导致页面其他部分出现布局问题:
控件的默认尺寸与实际尺寸不一致。 Web 页面其余部分的布局取决于实际尺寸。
开发人员应该测试其 Web 站点与 ActiveX 筛选的兼容性,以便识别类似于本文所述的问题。这能确保 ActiveX 筛选仅阻止一个 Web 页面上的 ActiveX 内容,保证用户能够继续正确地查看该页面的其他内容。
合理使用 ActiveX 筛选
自 IE9 候选发布版中发布了 ActiveX 筛选之后,我们接收到的反馈意见帮助我们对此功能进行了合理的补充,使之对最终用户和开发人员更为有用。例如,为 ActiveX 控件的占位符对象添加一个筛选器图标,这有助于向用户表明 ActiveX 筛选已经阻止了该页面上的内容,用户可以通过地址栏中的相同图标关闭筛选。
我们鼓励 Web 站点开发人员遵循本文中分享的最佳实践,保证 Web 站点能够合理利用 ActiveX 筛选。开发人员应该尽可能地为 ActiveX 控件提供对象的本机实现,并将站点更新到 JQuery 1.5.1,这个版本使用了正确的方法实例化本机 XMLHttpRequest 对象。利用新 API 检测一个站点上是否启用了 ActiveX 筛选,并显示更有针对性的替用内容。最后,应该全面测试 Web 站点与ActiveX 筛选的兼容性,识别细微的布局问题。与此同时,我们欢迎开发人员在本文的评论中分享自己的最佳实践。
—Herman Ng,项目经理,Internet Explorer